@flexem/fc-gui 3.0.0-alpha.143 → 3.0.0-alpha.145

package/elements/shared/text/text-element.js

@@ -69,7 +69,7 @@ export class TextElementModal {
             const minFontSize = 12;
             lineHeight = parseInt(font.fontSize, 10) + 5;
             fontString += font.fontSize + '/' + lineHeight.toString() + 'px ' + font.fontFamily;
-            textDiv.style.cssText = `color: ${font.color};word-break: break-all;font: ${fontString};`;
+            textDiv.style.cssText = `color: ${font.color};word-break: break-all;font: ${fontString};text-align: ${textAlign};`;
             if (font.isUnderline) {
                 textDiv.style.textDecoration = 'underline';
             }

package/elements/shared/text/text-state-element.js

@@ -43,8 +43,6 @@ export class TextStateElement {
             return;
         }
         const textElement = this.getforeignObjectElement();
-        // 清空旧内容
-        textElement.textContent = '';
         // 设置 text-anchor 和 dominant-baseline
         textElement.setAttribute('text-anchor', 'middle');
         textElement.setAttribute('dominant-baseline', 'middle');
@@ -57,9 +55,15 @@ export class TextStateElement {
         const totalHeight = lines.length * lineHeight;
         // 调整文本整体垂直居中（通过 dy）
         const startY = (this.height / 2) - (totalHeight / 2) + (lineHeight / 2);
-        // 添加每行文本
+        // 复用已有 tspan，不足则新建，多余则隐藏——避免删除 touch 目标节点导致 touchend 丢失
+        const existingTspans = Array.from(textElement.children);
         for (let i = 0; i < lines.length; i++) {
-            const tspan = document.createElementNS('http://www.w3.org/2000/svg', 'tspan');
+            let tspan = existingTspans[i];
+            if (!tspan) {
+                tspan = document.createElementNS('http://www.w3.org/2000/svg', 'tspan');
+                textElement.appendChild(tspan);
+            }
+            tspan.setAttribute('display', 'inline');
             tspan.setAttribute('x', (this.width / 2).toString());
             tspan.setAttribute('y', startY + i * lineHeight + 'px');
             tspan.textContent = lines[i].replace(/ /g, '\u00A0');
@@ -71,7 +75,10 @@ export class TextStateElement {
             tspan.setAttribute('text-decoration', font.isUnderline ? 'underline' : 'none');
             tspan.setAttribute('text-anchor', 'middle');
             tspan.setAttribute('dominant-baseline', 'middle');
-            textElement.appendChild(tspan);
+        }
+        // 隐藏多余的 tspan（不删除）
+        for (let i = lines.length; i < existingTspans.length; i++) {
+            existingTspans[i].setAttribute('display', 'none');
         }
         this.doFaultFlicker(textElement, stateId);
     }
@@ -114,12 +121,13 @@ export class TextStateElement {
             this.textElement.setAttribute('pointer-events', 'auto'); // 确保能接收事件
             this._element.appendChild(this.textElement);
         }
+        this.textElement.setAttribute('display', 'block');
         return this.textElement;
     }
     removeForeignObjectlement() {
         if (this.textElement) {
-            this._element.removeChild(this.textElement);
-            delete this.textElement;
+            this.textElement.setAttribute('display', 'none');
+            this.textElement.textContent = '';
         }
     }
     doFaultFlicker(textElement, stateId) {

package/elements/view-operation/view-operation.element.js

@@ -32,10 +32,11 @@ export class ViewOperationElement extends ConditionalEnableElement {
     initElement() {
         const width = this.model.size.width;
         const height = this.model.size.height;
+        // 在 initGraph 之前移除模板原有的 SVG <text>（改用 foreignObject 渲染，支持换行居中）
+        // 必须在 initGraph 前执行，否则会误删图形状态内部后续添加的文字节点
+        this.$element.find('text').remove();
         this.initGraph(width, height);
         this.rootElement.append('rect').attr('id', 'StateFrame').attr('width', width).attr('height', height).attr('fill', 'transparent');
-        // 移除模板中原有的 SVG <text> 元素，改用 TextElementModal（foreignObject）渲染，支持换行
-        this.$element.find('text').last().remove();
         const font = Object.assign(Object.assign({}, this.model.label.font), { fontFamily: this.model.label.font.fontFamily || 'msyh' });
         this.textElementModal = new TextElementModal(this.getDisplayText(), font, width, height);
         this.$element.append(this.textElementModal.Element);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"main": "bundles/fc-gui.umd.js",
-	"version": "3.0.0-alpha.143",
+	"version": "3.0.0-alpha.145",
 	"module": "public_api.js",
 	"typings": "public_api.d.ts",
 	"license": "UNLICENSED",