美文网首页
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