HarmonyOS鸿蒙Next中字符串长度超出限制，显示...

HarmonyOS鸿蒙Next中字符串长度超出限制，显示…

比如字符串是“创建者：阿尔薇拉星光玫瑰安娜斯塔西娅晨曦之歌莉莲娜海洋之风芙洛瑞丝”

可以按照预期显示“创建者：阿尔薇拉…"

换成英文之后，只显示“创建者：…"

@Entry
@Component
struct demo {
  @State name1:string = "阿尔薇拉星光玫瑰安娜斯塔西娅晨曦之歌莉莲娜海洋之风芙洛瑞丝"
  @State name2:string = "AlviraStarlightRoseAnastasiaDawnsongLilianaOceangraceFloris"

  build() {
    Column() {
      Text("创建者：" + this.name1).width(150).maxLines(1).textOverflow({overflow: TextOverflow.Ellipsis})
      Text("创建者：" + this.name2).width(150).maxLines(1).textOverflow({overflow: TextOverflow.Ellipsis})
    }.padding(100)
  }
}

更多关于HarmonyOS鸿蒙Next中字符串长度超出限制，显示...的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

加上 .wordBreak(WordBreak.BREAK_ALL) 就可以了

https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-basic-components-text#wordbreak11

更多关于HarmonyOS鸿蒙Next中字符串长度超出限制，显示...的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


文本截断是按字截断，中英文混合时，连续的英文在默认情况下不截断，整体放不下就换成…。

在HarmonyOS鸿蒙Next中，若字符串长度超出限制，系统默认会截断并显示省略号（…）。开发者可通过设置Text组件的maxLines和ellipsis属性来控制显示行为。例如，maxLines指定最大行数，ellipsis决定是否显示省略号。此外，可使用TextOverflow枚举值进一步定制截断方式。

在HarmonyOS Next中，Text组件的文本截断行为与字符类型有关。对于中文等CJK字符，系统会将每个字符视为等宽处理，因此能够正确显示部分字符后跟省略号。而英文字符是变宽的，当超出宽度限制时会直接显示省略号。

要解决英文显示问题，可以尝试以下方法：

  1. 使用固定宽度字体：
Text("创建者："+this.name2)
  .width(150)
  .maxLines(1)
  .fontFamily("monospace")
  .textOverflow({overflow:TextOverflow.Ellipsis})
  1. 调整布局宽度或使用百分比宽度：
Text("创建者："+this.name2)
  .width('80%')
  .maxLines(1)
  .textOverflow({overflow:TextOverflow.Ellipsis})
  1. 对于特别长的英文单词，可以考虑手动截断或添加连字符：
Text("创建者："+this.name2.substring(0,10)+"...")

这些方法可以根据实际UI需求选择使用。

回到顶部