美文网首页
Flutter 解决TextOverflow.ellipsis

Flutter 解决TextOverflow.ellipsis

作者: 一个奴隶搬砖的程序媛 | 来源:发表于2021-03-22 20:50 被阅读0次

Text想要展示一行,显示不下展示省略号,通常使用overflow: TextOverflow.ellipsis,
缺陷: 会将长字母或者数字串整体显示省略
例子: 分组YD-YXTJA-2102217-001113123123123123123,可能会显示成:分组YD-…

解决方案:将每个字符串之间插入零宽空格

String breakWord(String word) {
    if (word == null || word.isEmpty) {
      return word;
    }
    String breakWord = ' ';
    word.runes.forEach((element) {
      breakWord += String.fromCharCode(element);
      breakWord += '\u200B';
    });
    return breakWord;
  }

调用

Text(
    breakWord("YD-YXTJA-2102217-001113123123123123123"),
    maxLines: 1,
    overflow: TextOverflow.ellipsis,
   )

相关文章

网友评论

      本文标题:Flutter 解决TextOverflow.ellipsis

      本文链接:https://www.haomeiwen.com/subject/olythltx.html