flutter的Text内容自动换行导致留白问题

本文介绍了一种解决Flutter应用中中文与英文混排时文本自动换行导致的布局问题的方法。通过在每个字符间插入不可见的零宽度字符来避免不希望出现的换行现象。

flutter的文本内容在中英文混排,或中文与数字或特殊符号或英文字母时,文本会被自动换行,这样会导致,换行后上一行末尾留出很大的空白区域。
解决思路:

1、把每个字符插入一个0宽的字符, \u{200B}

import 'package:characters/characters.dart';

class Strings {
  ///防止文字自动换行
  static String autoLineString(String str){
    if(checkStrNoEmpty(str)){
      return str.fixAutoLines();
    }
    return "";
  }
}

/// 防止文字自动换行
/// 当中英文混合,或者中文与数字或者特殊符号,或则英文单词时,文本会被自动换行,
/// 这样会导致,换行时上一行可能会留很大的空白区域
/// 把每个字符插入一个0宽的字符, \u{200B}
extension _FixAutoLines on String {
  String fixAutoLines() {
    return Characters(this).join('\u{200B}');
  }
}

2、
 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值