Browse Source

'图标功能修改'

zhangyu 5 years ago
parent
commit
8584b4f1d3
2 changed files with 55 additions and 16 deletions
  1. 1 1
      saga-web-big/package.json
  2. 54 15
      saga-web-big/src/items/SIconTextItem.ts

+ 1 - 1
saga-web-big/package.json

@@ -42,6 +42,6 @@
         "typescript": "^3.9.3"
     },
     "dependencies": {
-        "@saga-web/graph": "2.1.104"
+        "@saga-web/graph": "2.1.105"
     }
 }

+ 54 - 15
saga-web-big/src/items/SIconTextItem.ts

@@ -55,6 +55,44 @@ export class SIconTextItem extends SObjectItem {
         }
     }
 
+    /** 是否被选中 */
+    get selected(): boolean {
+        return this._selected && this.selectable && this.enabled;
+    } // Get selected
+    set selected(value: boolean) {
+        // 如果选择状态未变更
+        if (this.selected == value) {
+            return;
+        }
+        this._selected = value;
+        if (value) {
+            this.img.scale = 1.25;
+        } else {
+            this.img.scale = 1
+        }
+        this.update();
+    } // Set selected
+
+    /** 是否激活  */
+    _isActive: boolean = false;
+    get isActive(): boolean {
+        return this._isActive;
+    } // Get isActive
+    set isActive(v: boolean) {
+        this._isActive = v;
+        this.update();
+    } // Set isActive
+
+    /** 激活显示颜色  */
+    _activeColor: SColor = new SColor("#00000033");
+    get activeColor(): SColor {
+        return this._activeColor;
+    } // Get activeColor
+    set activeColor(v: SColor) {
+        this._activeColor = v;
+        this.update();
+    } // Set activeColor
+
     /** X轴坐标 */
     get x(): number {
         return this.pos.x;
@@ -95,7 +133,7 @@ export class SIconTextItem extends SObjectItem {
     }
 
     /** 是否显示锚点  */
-    _showAnchor: boolean = false;
+    private _showAnchor: boolean = false;
     get showAnchor(): boolean {
         return this._showAnchor;
     }
@@ -140,8 +178,8 @@ export class SIconTextItem extends SObjectItem {
     constructor(parent: SGraphItem | null, data?: Anchor[]) {
         super(parent);
         this.img.url = `http://adm.sagacloud.cn:8080/doc/assets/img/logo.png`;
-        this.img.width = 24;
-        this.img.height = 24;
+        this.img.width = 32;
+        this.img.height = 32;
         this.img.connect("onMove", this, this.changeAhchorPoint.bind(this));
         let anchorPoint;
         if (data && data.length) {
@@ -168,11 +206,11 @@ export class SIconTextItem extends SObjectItem {
             item.moveTo(t.x, t.y);
             return item;
         });
+        this.showAnchor = false;
         this.textItem.text = "";
-        this.textItem.backgroundColor = SColor.White;
         this.textItem.font.size = 12;
         // 偏移二分之一文本高度
-        this.textItem.moveTo(17, -(this.textItem.height * 0.5));
+        this.textItem.moveTo(26, -(this.textItem.height * 0.5));
         this.moveable = true;
         this.selectable = true;
     }
@@ -263,20 +301,21 @@ export class SIconTextItem extends SObjectItem {
      * @param   painter painter对象
      */
     onDraw(painter: SPainter): void {
-        if (this.status == SItemStatus.Normal) {
-            if (this.selected) {
-                painter.pen.lineWidth = painter.toPx(1);
-                painter.pen.lineDash = [painter.toPx(3), painter.toPx(7)];
-                painter.pen.color = SColor.Black;
-                painter.brush.color = SColor.Transparent;
-                painter.drawRect(this.boundingRect());
-            }
-        } else if (this.status == SItemStatus.Edit) {
+        if (this.status == SItemStatus.Edit) {
             painter.pen.lineWidth = painter.toPx(1);
             painter.pen.lineDash = [painter.toPx(3), painter.toPx(7)];
-            painter.pen.color = SColor.Red;
+            painter.pen.color = SColor.Black;
             painter.brush.color = SColor.Transparent;
             painter.drawRect(this.boundingRect());
         }
+        if (this.isActive) {
+            painter.pen.color = SColor.Transparent;
+            painter.brush.color = this.activeColor;
+            if (this.selected) {
+                painter.drawCircle(this.img.x, this.img.y, (this.sWidth / 2.0 + 3) * 1.25);
+            } else {
+                painter.drawCircle(this.img.x, this.img.y, this.sWidth / 2.0 + 3);
+            }
+        }   
     } // Function onDraw()
 }