fix: richtext support globalLineHeight support

packages/vrender-core/src/graphic/config.ts

@@ -345,6 +345,7 @@ export const DefaultTextAttribute: Required<ITextGraphicAttribute> = {
 export const DefaultRichTextAttribute: Required<IRichTextGraphicAttribute> = {
   ...DefaultAttribute,
   ...DefaultTextStyle,
+  upgradeAttrs: null,
   editable: false,
   editOptions: null,
   ascentDescentMode: 'actual',

packages/vrender-core/src/graphic/richtext.ts

@@ -370,9 +370,11 @@ export class RichText extends Graphic<IRichTextGraphicAttribute> implements IRic
       lineWidth,
       opacity,
       fillOpacity,
-      strokeOpacity
+      lineHeight,
+      strokeOpacity,
+      upgradeAttrs
     } = this.attribute;
-    return {
+    const out = {
       fill,
       stroke,
       fontSize,
@@ -385,6 +387,10 @@ export class RichText extends Graphic<IRichTextGraphicAttribute> implements IRic
       strokeOpacity,
       ...config
     };
+    if (upgradeAttrs?.lineHeight) {
+      out.lineHeight = lineHeight;
+    }
+    return out;
   }
   doUpdateFrameCache(tc?: IRichTextCharacter[]) {
     // 1. 测量，生成paragraph
@@ -402,9 +408,12 @@ export class RichText extends Graphic<IRichTextGraphicAttribute> implements IRic
       singleLine,
       disableAutoWrapLine,
       editable,
-      ascentDescentMode
+      ascentDescentMode,
+      upgradeAttrs
     } = this.attribute;
 
+    const enableMultiBreakLine = upgradeAttrs && upgradeAttrs.multiBreakLine;
+
     let { textConfig: _tc = [] } = this.attribute;
 
     // 预处理editable，将textConfig中的text转换为单个字符
@@ -519,7 +528,7 @@ export class RichText extends Graphic<IRichTextGraphicAttribute> implements IRic
     const wrapper = new Wrapper(frame);
     // @since 0.22.0
     // 如果可编辑的话，则支持多换行符
-    wrapper.newLine = editable;
+    wrapper.newLine = enableMultiBreakLine;
     if (disableAutoWrapLine) {
       let lineCount = 0;
       let skip = false;
@@ -579,7 +588,7 @@ export class RichText extends Graphic<IRichTextGraphicAttribute> implements IRic
     }
 
     // 处理空行
-    if (editable) {
+    if (enableMultiBreakLine) {
       frame.lines.forEach(item => {
         const lastParagraphs = item.paragraphs;
         item.paragraphs = item.paragraphs.filter(p => (p as any).text !== '');

packages/vrender-core/src/graphic/richtext/paragraph.ts

@@ -175,7 +175,14 @@ export default class Paragraph {
     textAlign: string,
     lineHeight: number
   ) {
-    if (!(this.character.background && (!this.character.backgroundOpacity || this.character.backgroundOpacity > 0))) {
+    if (
+      !(
+        this.text !== '' &&
+        this.text !== '\n' &&
+        this.character.background &&
+        (!this.character.backgroundOpacity || this.character.backgroundOpacity > 0)
+      )
+    ) {
       return;
     }
     let baseline = top + ascent;

packages/vrender-core/src/interface/graphic/richText.ts

@@ -19,6 +19,14 @@ export type IRichTextEditOptionsType = {
 };
 
 export type IRichTextAttribute = {
+  /**
+   * @since 0.22.1
+   * 升级后避免break change，通过开关来控制
+   */
+  upgradeAttrs: {
+    lineHeight: true;
+    multiBreakLine: true;
+  } | null;
   /**
    * 富文本的总宽度
    */

packages/vrender-core/src/plugins/builtin-plugin/edit-module.ts

@@ -18,7 +18,7 @@ import type {
 // }
 
 export function getDefaultCharacterConfig(attribute: IRichTextGraphicAttribute) {
-  const { fill = 'black', stroke = false, fontWeight = 'normal', fontFamily = 'Arial' } = attribute;
+  const { fill = 'black', stroke = false, fontWeight = 'normal', lineHeight, fontFamily = 'Arial' } = attribute;
   let { fontSize = 12 } = attribute;
   if (!isFinite(fontSize)) {
     fontSize = 12;
@@ -28,7 +28,8 @@ export function getDefaultCharacterConfig(attribute: IRichTextGraphicAttribute)
     stroke,
     fontSize,
     fontWeight,
-    fontFamily
+    fontFamily,
+    lineHeight
   } as any;
 }