flutter - 有什么方法可以在 Flutter 中使 Text 和 Underline 不同的颜色？

Question

有没有办法让文本颜色为白色而下划线为黄色？

RichText、TextSpan 或 Text 似乎没有机会这样做。

这就是我要找的。

标签： flutteruser-interface

Answer 1

您可以在 Text 属性中使用 decorationColor: yourColor 来更改下划线的颜色。例如，如果您想为所有文本添加下划线：

Text("Your text",
      style: TextStyle(
             color: Colors.white
             decoration: TextDecoration.underline,
             decorationColor: Colors.yellow,
          ))

如果您只想在文本的一部分下划线，则必须将 RichText 与 TextSpan 一起使用。例如：

RichText(
   text: TextSpan(
   children: [
         TextSpan(
             text: "NOT UNDERLINED TEXT",
             style: TextStyle(
             color: Colors.white)
         ),
         TextSpan(
             text: "UNDERLINED TEXT",
             style: TextStyle(
             color: Colors.white
             decoration: TextDecoration.underline,
             decorationThickness: 2,
             decorationStyle: TextDecorationStyle.wavy))
              ], 
     style: TextStyle(color: Colors.yellow)
  ))