如何在颤振文本小部件内下划线文本?

我似乎无法在TextStyle的fontStyle属性内找到下划线


当前回答

最自定义的方法是将文本包装在容器中,并给出底部边框。你也可以根据你的设计给文本和下划线之间的空格。请参考乔·穆勒,最后一个选择。

Container(
 padding: const EdgeInsets.only(
   bottom: 5, // Space between underline and text
 ),
 decoration: BoxDecoration(
     border: Border(bottom: BorderSide(
     color: Colors.amber, 
     width: 2.0, // Underline thickness
    ))
  ),
 child: Text(
    "Forgot Password?",
    style: TextStyle(
    color: Colors.black,
    ),
   ),
  )

其他回答

例如

Text(
  "Terms and Condition",
  style: TextStyle(
    decoration:
        TextDecoration.underline,
    height: 1.5,
    fontSize: 15,
    fontWeight: FontWeight.bold,
    fontFamily: 'Roboto-Regular',
  ),
),

下面是一个简单的代码

Text(
  'Welcome to Flutter',
  style: TextStyle(decoration:TextDecoration.underline,),
),

您可以使用decorationStyle来定制它

Text(
  'Welcome to Flutter',
  style: TextStyle(
  fontSize: 24,
  decoration: TextDecoration.underline,
  decorationStyle: TextDecorationStyle.double,
  ),
),

以下是其他TextDecorationStyle值:

TextDecorationStyle.dashed TextDecorationStyle.dotted TextDecorationStyle.double TextDecorationStyle.wavy

最自定义的方法是将文本包装在容器中,并给出底部边框。你也可以根据你的设计给文本和下划线之间的空格。请参考乔·穆勒,最后一个选择。

Container(
 padding: const EdgeInsets.only(
   bottom: 5, // Space between underline and text
 ),
 decoration: BoxDecoration(
     border: Border(bottom: BorderSide(
     color: Colors.amber, 
     width: 2.0, // Underline thickness
    ))
  ),
 child: Text(
    "Forgot Password?",
    style: TextStyle(
    color: Colors.black,
    ),
   ),
  )

或者,为了防止复杂性,您也可以使用Flutter Markdown https://pub.dev/packages/flutter_markdown

你可以在样式中使用TextDecoration来强调给定的文本。

例如

Text(
    "Your text here",
    style: TextStyle(
        decoration: TextDecoration.underline),
    )
)