icontext

src/components/editClass/edit/SGraphEditScene.ts

@@ -406,7 +406,7 @@ export class SGraphEditScene extends SGraphScene {
             type: "Text",
             /** 位置 */
             pos: { x: event.x, y: event.y },
-            size: { width: 100, height: 100 },
+            size: { width: 50, height: 50 },
             /** 由应用自己定义 */
             properties: {
                 type: "BaseText"           // 自定义类型用于区分mark与node
@@ -453,6 +453,7 @@ export class SGraphEditScene extends SGraphScene {
         this.grabItem = icon;
         icon.connect("finishCreated", this, this.finishCreated);
         icon.connect("onContextMenu", this, this.getItem);
+        icon.$emit('finishCreated');
         if (this.view) {
             this.view.update();
         }

src/components/editClass/edit/items/SBaseIconTextEdit.ts

@@ -41,7 +41,7 @@ import {
     SFont,
     SPoint
 } from "@persagy-web/draw";
-import { SGraphEdit, SBaseTextEdit } from "..";
+import { SGraphEdit, SBaseTextEdit, SBaseImageEdit } from "..";
 import { Marker } from "../type/Marker";
 
 /**
@@ -262,8 +262,9 @@ export class SBaseIconTextEdit extends SGraphEdit {
         })
         this.update();
     } // Set font
+
     /** 图像 */
-    img: SImageItem = new SImageItem(this);
+    img: SBaseImageEdit = new SBaseImageEdit(this, {name: '', pos: {x: 0, y: 0}, type: '', style: {}});
 
     /** 文本数组 */
     textItemList: SBaseTextEdit[] = [];
@@ -276,6 +277,8 @@ export class SBaseIconTextEdit extends SGraphEdit {
     */
     constructor(parent: SGraphItem | null, data: Marker | null = null) {
         super(parent);
+        this.showSelect = false;
+        this.img.showSelect = false;
         this.data = data;
     } // Constructor
 
@@ -320,10 +323,12 @@ export class SBaseIconTextEdit extends SGraphEdit {
                         );
                     }
                     obj.font.size = item.font;
-                    obj.strokeColor = new SColor(item.color);
+                    obj.isTransform = false;
+                    obj.showSelect = false;
+                    obj.color = new SColor(item.color);
                     textItemList.push(obj)
                 })
-                this.textItemList = textItemList
+                this.textItemList = textItemList;                
             }
         }
         this.img.url = this.data.style.default.url;
@@ -382,7 +387,8 @@ export class SBaseIconTextEdit extends SGraphEdit {
     */
     onMouseDown(event: SMouseEvent): boolean {
         if (this.status == SItemStatus.Normal) {
-            return super.onMouseDown(event);
+            super.onMouseDown(event)
+            return true;
         } else if (this.status == SItemStatus.Edit) {
             return super.onMouseDown(event);
         }
@@ -447,14 +453,26 @@ export class SBaseIconTextEdit extends SGraphEdit {
      * @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)
         }
-
         if (this.isActive) {
             painter.pen.color = SColor.Transparent;
             painter.brush.color = this.activeColor;
@@ -499,7 +517,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
                 this.data.size.width = this.sWidth;
                 this.data.size.height = this.sHeight;
             }
-            this.data.style.default.text = this.textItemList.text;
+            this.data.style.default.text = JSON.stringify(this.textItemList);
             this.data.pos.x = this.pos.x;
             this.data.pos.y = this.pos.y;
             this.data.style.default.zorder = this.zOrder;

src/components/editClass/edit/items/SBaseImageEdit.ts

@@ -31,6 +31,7 @@ import { SItemStatus } from "@persagy-web/big";
 import { SGraphEdit } from "..";
 import { Marker } from "../type/Marker";
 import { ItemOrder } from '@persagy-web/big/lib';
+import { SMouseEvent } from '@persagy-web/base/lib';
 
 /**
  * 图片编辑类
@@ -406,6 +407,29 @@ export class SBaseImageEdit extends SGraphEdit {
     } // Function onResize()
 
     /**
+     * 鼠标按下事件
+     *
+     * @param event   保存事件参数
+     * @return 是否处理事件
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        console.log('img down');
+        super.onMouseDown(event);
+        return this.moveable;
+    } // Function onMouseDown()
+
+    /**
+     * 释放鼠标事件
+     *
+     * @param event   保存事件参数
+     * @return 是否处理事件
+     */
+    onMouseUp(event: SMouseEvent): boolean {
+        super.onMouseUp(event);
+        return this.moveable;
+    } // Function onMouseUp()
+
+    /**
      * Item 绘制操作
      *
      * @param painter    绘画类

src/components/editClass/edit/items/SBaseTextEdit.ts

@@ -29,6 +29,7 @@ import { SItemStatus } from "@persagy-web/big";
 import { SGraphEdit } from ".."
 import { Marker } from "../type/Marker";
 import { ItemOrder } from '@persagy-web/big/lib';
+import { SMouseEvent } from '@persagy-web/base/lib';
 
 /**
  * 文本编辑类
@@ -278,6 +279,30 @@ export class SBaseTextEdit extends SGraphEdit {
     // } // Function moveToOrigin()
 
     /**
+     * 鼠标按下事件
+     *
+     * @param event   保存事件参数
+     * @return 是否处理事件
+     */
+    onMouseDown(event: SMouseEvent): boolean {
+        super.onMouseDown(event);
+        return this.moveable;
+    } // Function onMouseDown()
+
+    /**
+     * 释放鼠标事件
+     *
+     * @param event   保存事件参数
+     * @return 是否处理事件
+     */
+    onMouseUp(event: SMouseEvent): boolean {
+        console.log('text up');
+        
+        super.onMouseUp(event);
+        return this.moveable;
+    } // Function onMouseUp()
+
+    /**
      * 绘制显示状态文本 Item
      *
      * @param painter    绘制类