
目录:
- 文本样式的参数
- 默认文本样式
- 文字加波浪线
- 文字加横线
- 文字加阴影
- 文字加背景框
- 文字加渐变色
- 文字风格属性
- 文字加双下划线
一、文本样式的参数
下面列出了 TextStyle widget 的全部参数:
bool? inherit,
Color? color,
Color? backgroundColor,
String? fontFamily,
List<String>? fontFamilyFallback,
double? fontSize,
FontWeight? fontWeight,
FontStyle? fontStyle,
double? letterSpacing,
double? wordSpacing,
TextBaseline? textBaseline,
double? height,
Locale? locale,
Paint? foreground,
Paint? background,
List<ui.Shadow>? shadows,
List<ui.FontFeature>? fontFeatures,
TextDecoration? decoration,
Color? decorationColor,
TextDecorationStyle? decorationStyle,
double? decorationThickness,
String? debugLabel
二、默认文本样式
return Material(
child: Center(
child: Text(
'好好学习,努力赚钱',
//style: textStyle,
),
),
);

三、文字加波浪线
return const Material(
child: Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(
fontSize: 20,
decoration: TextDecoration.lineThrough,
decorationStyle: TextDecorationStyle.wavy,
),
),
),
);

四、字体加横线
return const Material(
child: Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(
fontSize: 20,
decoration: TextDecoration.lineThrough,
decorationThickness: 4,
),
),
),
);

五、文字加阴影
return const Material(
child: Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(
fontSize: 36,
shadows: [
Shadow(
color: Colors.blue,
blurRadius: 1,
offset: Offset(1, 1),
),
Shadow(
color: Colors.red,
blurRadius: 10,
offset: Offset(-5, 5),
),
],
),
),
),
);

六、文字加背景框
return Material(
child: Center(
child: Text('好好学习,努力挣钱',
style: TextStyle(
background: Paint()
..strokeWidth = 30.0
..color = Colors.blue
..style = PaintingStyle.stroke
..strokeJoin = StrokeJoin.round)),
),
);

七、文字加渐变颜色
return Material(
child: Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(
fontSize: 36,
fontWeight: FontWeight.bold,
foreground: Paint()
..shader = linearGradient),
),
));

八、文字风格的属性:字体大小、颜色、高度、词间距、字母间距、字体加粗、字体。
return const Material(
child: Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(fontSize: 32,color: Colors.black38,height: 6,wordSpacing: 12,letterSpacing: 2,fontWeight: FontWeight.bold,fontStyle: FontStyle.italic),
),
));

九、文字加双下划线
return const Center(
child: Text(
'好好学习,努力挣钱',
style: TextStyle(fontSize: 32),
),
);

网友评论