HarmonyOS Text 超出限制显示一个更多

通过设置 overflow: TextOverflow.Ellipsis 来控制隐藏超出的文本。参考链接：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-text-V5#textoverflow

参考以下代码实现：

import inspector from '@ohos.ArkUI.inspector';
import componentUtils from '@ohos.ArkUI.componentUtils';
@Entry
@Component
export struct TextButton {
  @State content: string = '#限定的校服，限定的青春！那群陪你度过青涩阳光的人，你还记得他们吗？12月15日中午12点，一起来重拾回忆'
  private measureText = this.content;
  @State maxLines: number = Infinity
  @State isCollapse: boolean = true;
  @State collapseTxt: string = '[更多]';
  private subTxt: string = '';
  build() {
    Row() {
      Column() {
        Text() {
          Span('#亲爱的朋友')
            .fontColor(Color.Blue)
          Span(this.content)
          if (true) {
            Span(this.collapseTxt)
              .onClick(() => {
                if (this.isCollapse) {
                  this.maxLines = Infinity;
                  this.content = this.measureText;
                  this.isCollapse = false;
                  this.collapseTxt = '[收起]';
                } else {
                  this.isCollapse = true;
                  this.collapseTxt = '[更多]';
                  this.content = this.subTxt;
                }
              })
          }
        }
        .textOverflow({ overflow: TextOverflow.Ellipsis })
        .maxLines(this.maxLines)
        .fontSize(24)
        .width(300)
        .backgroundColor(Color.White)
        .key('txt_info')
      }
      .width('100%')
    }
    .height('100%')
  }
  listener: inspector.ComponentObserver = inspector.createComponentObserver('txt_info')
  aboutToAppear() {
    let onLayoutComplete: () => void = (): void => {
      if (this.isCollapse) {
        this.getComponentRect('txt_info');
      }
    }
    let onDrawComplete: () => void = (): void => {
      if (this.isCollapse) {
        this.subTxt = this.content;
      }
    }
    let FuncLayout = onLayoutComplete
    let FuncDraw = onDrawComplete
    this.listener.on('layout', FuncLayout)
    this.listener.on('draw', FuncDraw)
  }
  private getComponentRect(key: string) {
    let modePosition = componentUtils.getRectangleById(key);
    let localOffsetHeight = modePosition.size.height;
    if (localOffsetHeight > 300) {
      this.content = this.content.substring(0, this.content.length - 2);
      this.isCollapse = true;
    }
  }
}