Text Field 默认自带 下划线 , 然鹅现在UI设计一般做无边框输入框,通过简单 设置 decoration去掉 下划线 border: InputBorder.none, Text Field( style: Text Style(color: Colors.white, fontSize: 16.0), decoration: InputDecoration( border: InputBorder.none, hint Text : '输入提示占位字符', 可以看到数字，汉字和字母(不同的字母所占的高度还不一致) 24呵呵jki这文字 再给出字符的显示规则 针对价格(数字类型的展示) 其实获取的应该是Capheight,所以在 Flutter 中需要根据 Text Painter 来获取相关信息 Capheight = BaseLineHeight - o(字符空白区域到顶部距离)，但Capheigh

目录导航 Text 属性配置 设置 显示的 文本 文本 方向 文本 对齐方式是否支持换行 文本 溢出最大行数限制 文本 风格 设置 文本 垂直方向占据空间的风格配置(行间距、行高等)Rich Text Text Span Text .rich VS Rich Text Default Text Style Text 继承StatelessWidget,用来显示 文本 ,如 Text ("Hello,world!"),完整的构造器如下： con...

Flutter Text Widget是 Flutter Framework中用于呈现 文本 的Widget之一。该Widget可以显示单行或者多行 文本 ，并且支持文字样式、对齐方式、 文本 溢出方式、行间距等多种属性的 设置 。在使用 Text Widget的过程中，我们可能需要自定义 下划线 的样式来美化 文本 。 实现自定义 下划线 有多种方法，下面我们介绍其中一种方法： 在 Text Widget的child组件内添加CustomPaint Widget，通过CustomPainter来绘制 下划线 。 例如，下面的示例演示了如何使用CustomPainter来绘制一条黑色且宽度为2.0的 下划线 。 ```dart Text ( 'Hello, world!', style: Text Style(fontSize: 24), text Align: Text Align.center, text Direction: Text Direction.ltr, maxLines: 1, overflow: Text Overflow.ellipsis, text ScaleFactor: 1.5, // 添加 下划线 child: CustomPaint( painter: LinePainter(), child: Text ('Hello, world!'), // LinePainter绘制 下划线 class LinePainter extends CustomPainter { @override void paint(Canvas canvas, Size size) { final paint = Paint() ..color = Colors.black ..strokeWidth = 2.0; canvas.drawLine(Offset.zero, Offset(size.width, 0), paint); @override bool shouldRepaint(CustomPainter oldDelegate) => false; 通过上面的代码，我们可以看到，在 Text Widget的child组件中添加了一个CustomPaint Widget，并通过LinePainter来绘制了 下划线 。在LinePainter中，我们通过canvas.drawLine方法来画一条宽度为2.0的黑色直 线 。同时，由于CustomPainter是在Widget绘制完成后才执行的，因此 下划线 可以自动适应 Text Widget的宽度。 在实现自定义 下划线 的时候，我们可以根据需求来自定义不同的 下划线 样式。例如，可以通过paint.color、paint.strokeWidth等属性来 设置 下划线 的颜色、宽度等。如果需要实现复杂的 下划线 效果，也可以通过绘制曲 线 、添加阴影、使用渐变色等方式来实现。 总结来说，通过在 Text Widget的child组件中添加CustomPaint Widget，再通过CustomPainter来绘制 下划线 ，是一种简单且灵活的自定义 下划线 的方法。在实际开发中，我们可以根据实际需求来灵活应用，实现不同样式的 下划线 。