1.Text
简介
具有某个单一样式的文本显示widget组件,显示支持一行或者多行。默认样式会继承层级最为接近DefaultStyle,当然你也可以重新定义他的样式将DefaultStytle.inherit 设置为false
基本用法
- data Text显示的文本,必须填参数String
- textAlign 文本的对齐方式,可以选择左对齐、右对齐、居中等
- maxLines 文本显示的最大行数
- overflow 文本显示的截断方式
- textScaleFactor 文本缩放比例
- style 用于制定文本显示的样式如字体、颜色、粗细、背景
代码示例
class TextDemo extends StatefulWidget {
_Demo createState() => _Demo();
}
class _Demo extends State<TextDemo> {
int index = 0;
Duration timer = Duration(minutes: 50);
@override
Widget build(BuildContext context) {
return Text(
'I‘m a text',
style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.w600 , color:Colors.cyan),
);
}
}
2.Rich Text
简介
在富文本使用多个不同风格的widget显示文本。要显示的文本使用TextSpan对象来描述,没个对象都有一个用于该子树的关联样式。文本可能会跨越多行,也可能全部显示在同一行上,具体取决于布局约束。
示例代码
class TextDemo extends StatefulWidget {
_Demo createState() => _Demo();
}
class _Demo extends State<TextDemo> {
int index = 0;
Duration timer = Duration(minutes: 50);
@override
Widget build(BuildContext context) {
return RichText(
text: TextSpan(
text: 'This is ',
style: TextStyle(color: Colors.black, fontSize: 18.0),
children: <TextSpan>[
TextSpan(
text: 'bold',
style: TextStyle(fontWeight: FontWeight.bold, )
),
TextSpan(
text: ' text. '
),
TextSpan(
text: 'This is '
),
TextSpan(
text: 'larger ',
style: TextStyle(fontSize: 22.0)
),
TextSpan(
text: 'font size.',),
TextSpan(
text: 'This is ',
),
TextSpan(
text: 'red ',
style:TextStyle(color: Colors.red)
),
TextSpan(
text: 'color.',
)
],
),
);
}
}