如何解决在下划线上方显示带有填充的文本
有没有办法在 Flutter 中实现以下结果,其中文本下方的下划线将被溢出它的字母周围的填充很好地隐藏,例如“g”、“q”、“y”等?
>模拟器(当前):
设计(期望):
字体:斯巴达
解决方法
我发现实现这一目标的最佳方法是使用文本笔触和堆栈来创建下划线效果。代码如下:
print("\n".join(map(str,my_list)))
以及结果截图
,编辑
第一个看起来工作但不好看,第二个工作正常但p字不太好。 当您不想添加下划线时,只需编写decoration:TextDecoration.none。
Text.rich(
TextSpan(
text: 'For ',style: TextStyle(decoration: TextDecoration.underline,fontSize: 25),children: <TextSpan>[
TextSpan(text: 'g',style:TextStyle(decoration: TextDecoration.none)),TextSpan( text: ' ',style:TextStyle(decoration: TextDecoration.underline,decorationThickness: 1)),TextSpan( text: ' p',style:TextStyle(decoration: TextDecoration.none,)),TextSpan( text: 'assword?',style:TextStyle(decoration: TextDecoration.underline)),//you can add more text span here
],),Row(
children: <Widget>[
Text('For',fontSize: 25)),Text('g',style: TextStyle(decoration: TextDecoration.none,Text('ot',Text(' ',Text('p',Text('assword',],)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。