fix: fix computeRowsHeight() error about icon

VisActor · Jul 7, 2023 · 383b461 · 383b461
1 parent a465fcf
commit 383b461
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 40 deletions.
diff --git a/packages/vtable/examples/icon/icon-register.ts b/packages/vtable/examples/icon/icon-register.ts
@@ -345,6 +345,12 @@ export function createTable() {
             }
           }
         ]
+        // style: {
+        //   autoWrapText: true
+        // },
+        // headerStyle: {
+        //   autoWrapText: true
+        // }
       },
       {
         field: 'id',

diff --git a/packages/vtable/src/scenegraph/layout/compute-row-height.ts b/packages/vtable/src/scenegraph/layout/compute-row-height.ts
@@ -9,6 +9,7 @@ import { WrapText } from '../graphic/text';
 import { getProp } from '../utils/get-prop';
 import { getQuadProps } from '../utils/padding';
 import { getCellRect } from './compute-col-width';
+import { dealWithRichTextIcon } from '../utils/text-icon-layout';
 
 const utilTextMark = new WrapText({
   autoWrapText: true
@@ -203,7 +204,7 @@ function computeTextHeight(col: number, row: number, table: BaseTableAPI): numbe
         icon.positionType !== IconPosition.inlineEnd
       ) {
         iconWidth += (icon.width ?? 0) + (icon.marginLeft ?? 0) + (icon.marginRight ?? 0);
-        iconHeight = Math.max(iconHeight, (icon.height ?? 0) + (icon.marginLeft ?? 0) + (icon.marginRight ?? 0));
+        iconHeight = Math.max(iconHeight, icon.height ?? 0);
       } else if (icon.positionType === IconPosition.inlineFront) {
         iconInlineFront.push(icon);
         iconInlineFrontHeight = Math.max(
@@ -233,37 +234,37 @@ function computeTextHeight(col: number, row: number, table: BaseTableAPI): numbe
   const lines = validToString(cellValue).split('\n') || [];
 
   if (iconInlineFront.length || iconInlineEnd.length) {
-    if (autoWrapText) {
-      const textOption = Object.assign({
-        text: cellValue?.toString(),
-        fontFamily,
-        fontSize,
-        lineHeight
-      });
-      textOption.textBaseline = 'middle';
-      const textConfig = [
-        ...iconInlineFront.map(icon => dealWithRichTextIcon(icon)),
-        textOption,
-        ...iconInlineEnd.map(icon => dealWithRichTextIcon(icon))
-      ];
-      utilRichTextMark.setAttributes({
-        width: table.getColWidth(col) - (padding[1] + padding[3]) - iconWidth,
-        height: 0,
-        textConfig
-      });
-      maxHeight = utilRichTextMark.AABBBounds.height();
-    } else {
-      maxHeight = 0;
-      lines.forEach((line: string, index: number) => {
-        if (index === 0 && iconInlineFront.length) {
-          maxHeight += Math.max(lineHeight, iconInlineFrontHeight);
-        } else if (index === lines.length - 1 && iconInlineEnd.length) {
-          maxHeight += Math.max(lineHeight, iconInlineEndHeight);
-        } else {
-          maxHeight += lineHeight;
-        }
-      });
-    }
+    // if (autoWrapText) {
+    const textOption = Object.assign({
+      text: cellValue?.toString(),
+      fontFamily,
+      fontSize,
+      lineHeight
+    });
+    textOption.textBaseline = 'middle';
+    const textConfig = [
+      ...iconInlineFront.map(icon => dealWithRichTextIcon(icon)),
+      textOption,
+      ...iconInlineEnd.map(icon => dealWithRichTextIcon(icon))
+    ];
+    utilRichTextMark.setAttributes({
+      width: table.getColWidth(col) - (padding[1] + padding[3]) - iconWidth,
+      height: 0,
+      textConfig
+    });
+    maxHeight = utilRichTextMark.AABBBounds.height();
+    // } else {
+    //   maxHeight = 0;
+    //   lines.forEach((line: string, index: number) => {
+    //     if (index === 0 && iconInlineFront.length) {
+    //       maxHeight += Math.max(lineHeight, iconInlineFrontHeight);
+    //     } else if (index === lines.length - 1 && iconInlineEnd.length) {
+    //       maxHeight += Math.max(lineHeight, iconInlineEndHeight);
+    //     } else {
+    //       maxHeight += lineHeight;
+    //     }
+    //   });
+    // }
   } else if (autoWrapText) {
     const maxLineWidth = table.getColWidth(col) - (padding[1] + padding[3]) - iconWidth;
     utilTextMark.setAttributes({
@@ -280,10 +281,3 @@ function computeTextHeight(col: number, row: number, table: BaseTableAPI): numbe
 
   return (Math.max(maxHeight, iconHeight) + padding[0] + padding[2]) / spanRow;
 }
-
-function dealWithRichTextIcon(iconConfig: ColumnIconOption) {
-  return {
-    width: iconConfig.width,
-    height: iconConfig.height
-  };
-}
diff --git a/packages/vtable/src/scenegraph/utils/text-icon-layout.ts b/packages/vtable/src/scenegraph/utils/text-icon-layout.ts
@@ -403,7 +403,7 @@ export function dealWithIcon(
  * @param {ColumnIconOption} icon
  * @return {*}
  */
-function dealWithRichTextIcon(icon: ColumnIconOption) {
+export function dealWithRichTextIcon(icon: ColumnIconOption) {
   // positionType在外部处理
   const config = {} as any;