效果图
1 下划线、 删除线
TextStyle 中有4个属性
decoration
:TextDecoration可在文字上 中 下方添加直线decorationStyle
:extDecorationStyle 可指定线条样式,如直线、虚线、波浪线、双实线、点线decorationThickness
:设置线条的宽度decorationColor
:设置线条的颜色
下方波浪线
Text(
'下划波浪线',
style: TextStyle(
fontSize: 24,
decoration: TextDecoration.underline,
decorationStyle: TextDecorationStyle.wavy,
decorationThickness: 1,
),
),
中间红色删除线
Text(
'中间删除线',
style: TextStyle(
fontSize: 24,
decoration: TextDecoration.lineThrough,
decorationStyle: TextDecorationStyle.solid,
decorationColor: Colors.red
),
),
2 文字背景色 & 渐变色文字
TextStyle 的backgroundColor可为文字添加背景色
Text(
'文字添加背景色',
style: TextStyle(
fontSize: 24,
color: Colors.white,
fontWeight: FontWeight.bold,
backgroundColor: Colors.red,