如何解决Text组件文本为内容中文、数字、英文混合时显示省略号截断异常

在使用text文本组件时,若text组件中文本为内容中文、数字、英文混合时,TextOverFlow设置文本超长时显示省略号出现截断异常。

HarmonyOS
2024-07-22 12:10:06
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
vclearner

text组件设置wordBreak(WordBreak.BREAK_ALL)属性时,对于Non-CJK的文本,可在任意2个字符间断行即可正常截断。

参考代码:

@Entry 
@Component 
struct Index { 
  @State text: string = '2年·VIP会员 3个月期·8GB·230mm·花漾粉' 
 
  build() { 
    Column() { 
      Text(this.text) 
        .width(200)//设置最大行数 
        .maxLines(1)//文本超长显示 
        .textOverflow({ overflow: TextOverflow.Ellipsis })//文本超长显示省略号 
        .ellipsisMode(EllipsisMode.END)//设置断行规则WordBreak.BREAK_ALL后 
        .wordBreak(WordBreak.BREAK_ALL) 
        .textAlign(TextAlign.JUSTIFY) 
        .backgroundColor(Color.Green) 
        .fontSize(16) 
        .fontColor(Color.Red) 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-07-22 19:56:18
提问
该提问已有0人参与 ,帮助了0人