浏览代码

big:feat:icontextitem 功能改造 为 对多个textitem

haojianlong 4 年之前
父节点
当前提交
7603aa0d82
共有 1 个文件被更改,包括 85 次插入55 次删除
  1. 85 55
      persagy-web-big/src/items/SIconTextItem.ts

+ 85 - 55
persagy-web-big/src/items/SIconTextItem.ts

@@ -53,23 +53,29 @@ export class SIconTextItem extends SObjectItem {
     _status: SItemStatus = SItemStatus.Normal;
     get status(): SItemStatus {
         return this._status;
-    } // Get status
+    }
     set status(v: SItemStatus) {
         this._status = v;
         // 标准状态时
         if (v == SItemStatus.Normal) {
             this.moveable = true;
-            this.textItem.moveable = false;
+            this.textItemList.forEach((t): void => {
+                t.moveable = false;
+            });
             this.img.moveable = false;
         } else if (v == SItemStatus.Edit) {
             // 编辑状态时
             this.moveable = false;
-            this.textItem.moveable = true;
+            this.textItemList.forEach((t): void => {
+                t.moveable = true;
+            });
             this.img.moveable = true;
         } else if (v == SItemStatus.Create) {
             // 创建状态时
             this.moveable = true;
-            this.textItem.moveable = false;
+            this.textItemList.forEach((t): void => {
+                t.moveable = false;
+            });
             this.img.moveable = false;
         }
         this.update();
@@ -80,7 +86,6 @@ export class SIconTextItem extends SObjectItem {
     get showText(): boolean {
         return this._showText;
     }
-
     set showText(v: boolean) {
         // 当文字是显示状态时
         if (v === this._showText) {
@@ -89,9 +94,13 @@ export class SIconTextItem extends SObjectItem {
         this._showText = v;
         // 是否显示文字
         if (v) {
-            this.textItem.show();
+            this.textItemList.forEach((t): void => {
+                t.show();
+            });
         } else {
-            this.textItem.hide();
+            this.textItemList.forEach((t): void => {
+                t.hide();
+            });
         }
     }
 
@@ -99,7 +108,6 @@ export class SIconTextItem extends SObjectItem {
     get selected(): boolean {
         return this._selected && this.selectable && this.enabled;
     }
-
     set selected(value: boolean) {
         // 如果选择状态未变更
         if (this.selected == value) {
@@ -122,18 +130,13 @@ export class SIconTextItem extends SObjectItem {
     get isActive(): boolean {
         return this._isActive;
     }
-
     set isActive(v: boolean) {
         this._isActive = v;
         // 激活状态
         if (v) {
             this.cursor = "pointer";
-            this.textItem.cursor = "pointer";
-            this.img.cursor = "pointer";
         } else {
             this.cursor = "auto";
-            this.textItem.cursor = "auto";
-            this.img.cursor = "auto";
         }
         this.update();
     }
@@ -143,7 +146,6 @@ export class SIconTextItem extends SObjectItem {
     get activeColor(): SColor {
         return this._activeColor;
     }
-
     set activeColor(v: SColor) {
         this._activeColor = v;
         this.update();
@@ -153,7 +155,6 @@ export class SIconTextItem extends SObjectItem {
     get x(): number {
         return this.pos.x;
     }
-
     set x(v: number) {
         this.pos.x = v;
         this.$emit("changePos");
@@ -164,7 +165,6 @@ export class SIconTextItem extends SObjectItem {
     get y(): number {
         return this.pos.y;
     }
-
     set y(v: number) {
         this.pos.y = v;
         this.$emit("changePos");
@@ -175,7 +175,6 @@ export class SIconTextItem extends SObjectItem {
     get sWidth(): number {
         return this.img.width;
     }
-
     set sWidth(v: number) {
         this.img.width = v;
         this.img.origin = new SPoint(
@@ -190,7 +189,6 @@ export class SIconTextItem extends SObjectItem {
     get sHeight(): number {
         return this.img.height;
     }
-
     set sHeight(v: number) {
         this.img.height = v;
         this.img.origin = new SPoint(
@@ -206,7 +204,6 @@ export class SIconTextItem extends SObjectItem {
     get showAnchor(): boolean {
         return this._showAnchor;
     }
-
     set showAnchor(v: boolean) {
         this._showAnchor = v;
         this.anchorList.forEach((t): void => {
@@ -214,33 +211,33 @@ export class SIconTextItem extends SObjectItem {
         });
     }
 
-    /** 文本内容 */
-    get text(): string {
-        return this.textItem.text;
-    }
-
-    set text(v: string) {
-        this.textItem.text = v;
-        this.update();
-    }
-
     /** 文本颜色 */
     get color(): SColor {
-        return this.textItem.color;
+        if (this.textItemList.length) {
+            return this.textItemList[0].color;
+        } else {
+            return new SColor();
+        }
     }
-
     set color(v: SColor) {
-        this.textItem.color = v;
+        this.textItemList.forEach((item): void => {
+            item.color = v;
+        });
         this.update();
     }
 
     /** 文本字体 */
     get font(): SFont {
-        return this.textItem.font;
+        if (this.textItemList.length) {
+            return this.textItemList[0].font;
+        } else {
+            return new SFont();
+        }
     }
-
     set font(v: SFont) {
-        this.textItem.font = v;
+        this.textItemList.forEach((item): void => {
+            item.font = v;
+        });
         this.update();
     }
 
@@ -248,7 +245,7 @@ export class SIconTextItem extends SObjectItem {
     img: SImageItem = new SImageItem(this);
 
     /** text Item */
-    textItem: STextItem = new STextItem(this);
+    textItemList: STextItem[] = [];
 
     /**
      * 构造体
@@ -298,13 +295,13 @@ export class SIconTextItem extends SObjectItem {
             }
         );
         this.showAnchor = false;
-        this.textItem.text = "";
-        this.textItem.font.size = 12;
-        // 偏移二分之一文本高度
-        this.textItem.moveTo(
-            this.img.width * 0.5,
-            -(this.font.size * 1.25 * 0.5)
-        );
+        // this.textItem.text = "";
+        // this.textItem.font.size = 12;
+        // // 偏移二分之一文本高度
+        // this.textItem.moveTo(
+        //     this.img.width * 0.5,
+        //     -(this.font.size * 1.25 * 0.5)
+        // );
         this.moveable = true;
         this.selectable = true;
     }
@@ -332,6 +329,27 @@ export class SIconTextItem extends SObjectItem {
     }
 
     /**
+     * 添加文本
+     *
+     * @param item 文本图例
+     */
+    addTextItem(item: STextItem): void {
+        this.textItemList.push(item);
+    }
+
+    /**
+     * 删除文本
+     *
+     * @param index 索引
+     */
+    removeTextItem(index: number): void {
+        let [deleteItem] = this.textItemList.splice(index, 1);
+        if (this.scene) {
+            this.scene.removeItem(deleteItem);
+        }
+    }
+
+    /**
      * 鼠标按下事件
      *
      * @param event   事件对象
@@ -340,7 +358,8 @@ export class SIconTextItem extends SObjectItem {
     onMouseDown(event: SMouseEvent): boolean {
         // 如果为show状态 双击改对象则需改为编辑状态
         if (this.status == SItemStatus.Normal) {
-            return super.onMouseDown(event);
+            super.onMouseDown(event);
+            return true;
         } else if (this.status == SItemStatus.Edit) {
             // 编辑状态时
             return super.onMouseDown(event);
@@ -389,13 +408,12 @@ export class SIconTextItem extends SObjectItem {
             .adjusted(this.img.pos.x, this.img.pos.y, 0, 0);
         // 显示文字时
         if (this.showText) {
-            rect = rect.unioned(
-                this.textItem
-                    .boundingRect()
-                    .adjusted(this.textItem.pos.x, this.textItem.pos.y, 0, 0)
-            );
+            this.textItemList.forEach((t): void => {
+                rect = rect.unioned(
+                    t.boundingRect().adjusted(t.pos.x, t.pos.y, 0, 0)
+                );
+            });
         }
-
         return rect.adjusted(-5, -5, 10, 10);
     }
 
@@ -405,13 +423,25 @@ export class SIconTextItem extends SObjectItem {
      * @param painter   绘制对象
      */
     onDraw(painter: SPainter): void {
-        // 编辑状态时
-        if (this.status == SItemStatus.Edit) {
-            painter.pen.lineWidth = painter.toPx(1);
-            painter.pen.lineDash = [painter.toPx(3), painter.toPx(7)];
+        const rect = this.boundingRect();
+        const lw = painter.toPx(1);
+        // 编辑态和选中态出现绘制区域
+        if (this.status == SItemStatus.Edit || this.selected) {
+            // doto 如果子元素被选中
+            painter.pen.lineWidth = lw;
+            painter.pen.lineDash = [3 * lw, 7 * lw];
             painter.pen.color = SColor.Black;
             painter.brush.color = SColor.Transparent;
-            painter.drawRect(this.boundingRect());
+            painter.drawRect(rect);
+        }
+        // 编辑态出现四个角的圆点
+        if (this.status == SItemStatus.Edit) {
+            painter.pen.lineDash = [];
+            painter.brush.color = SColor.White;
+            painter.drawCircle(rect.x, rect.y, 5 * lw);
+            painter.drawCircle(rect.right, rect.bottom, 5 * lw);
+            painter.drawCircle(rect.x, rect.bottom, 5 * lw);
+            painter.drawCircle(rect.right, rect.y, 5 * lw);
         }
 
         // 处于激活状态时