Text 属性
new Text(
'You have pushed the button this many times:',
textAlign: TextAlign.center,
textDirection: TextDirection.ltr,
softWrap: false,
overflow: TextOverflow.ellipsis,
textScaleFactor: 2.0,
maxLines: 10,
)
data,Text 控件的第一个属性,指的是 Text 的文本
textAlign:文本对齐方式,分别有:
TextAlign.left 文本左对齐
TextAlign.right 文本右对齐
TextAlign.center 文本居中
TextAlign.justify 文本两端对齐
TextAlign.start 同 TextAlign.left
TextAlign.end 同 TextAlign.righttextDirection 文本方向,分别有
TextDirection.ltr 从左到右
TextDirection.rtl 从右到左softWrap 是否换行处理,如为 false,超出屏幕做截断处理
overflow 文字超出屏幕之后的处理方式
TextOverflow.clip 截断处理
TextOverflow.fade 超出透明化
TextOverflow.ellipsis 省略号处理textScaleFactor 字体缩放大小
maxLines 限制行数
style 属性
style: TextStyle(
inherit: true,
color: const Color(0xff000000),
backgroundColor: Colors.white,
fontSize: 32,
fontWeight: FontWeight.w900,
fontStyle: FontStyle.italic,
letterSpacing: 4.0,
wordSpacing: 6.0,
textBaseline: TextBaseline.ideographic,
height: 1,
locale:const Locale('en', 'US'),
// foreground: paint,
// background:paint,
shadows:[BoxShadow(color: Colors.grey, offset: Offset(-1, -1), blurRadius: 5)],
decoration:TextDecoration.lineThrough,
decorationColor:Colors.blue,
decorationStyle:TextDecorationStyle.double,
decorationThickness:2.0,
debugLabel:"label",
fontFamily:"DIN_Medium.ttf",
//fontFamilyFallback:,
package:"assets/fonts",
),
- inherit 未设置属性是否继承父节点样式
- color 字体颜色
- backgroundColor 背景颜色
- fontSize 字体大小,单位为 pt 或 sp ,默认 14 sp
- fontWeight 字体的粗细,正常 (FontWeight.w400) 和粗体
- fontStyle 字体样式,正常和斜体
- letterSpacing 字符之间的间距倍数
- wordSpacing 单词间隙
- textBaseline 对齐表意文字的水平线
- height 字体的倍数
- locale 多国语言设置
- foreground 通过 Paint 来设置字体的颜色,color 和 foreground 不能同时设置
- background 通过Paint来设置字体的背景颜色,backgroundColor 和 background 不能同时设置
- shadows 文字阴影
- decoration TextDecoration.none 没有 TextDecoration.underline 下划线TextDecoration.overline 上划线TextDecoration.lineThrough 中间的线(删除线)
- decorationColor 划线的颜色
- decorationStyle 划线的样式 TextDecorationStyle.solid 实线 TextDecorationStyle.double 画两条线 TextDecorationStyle.dotted 点线(一个点一个点的)TextDecorationStyle.dashed 虚线(一个长方形一个长方形的线)TextDecorationStyle.wavy 正玄曲线
- decorationThickness 划线粗细的宽度
- debugLabel 调试标签
- fontFamily 字体名称
- fontFamilyFallback 文字字体列表,如果前面的 fontFamily 提供了,以fontFamily 为准,如果没有提供,则使用该列表第一个元素作为字体,都没提供则使用默认字体
- package 文字字体路径
Text.rich 属性
和Text相比多出一个textSpan
new TextSpan(
text: 'Hello Flutter',
style: new TextStyle(
color: Colors.black,
fontSize: 15.0,
decoration: TextDecoration.none,
),
children: <TextSpan>[
new TextSpan(
text: 'TextSpan',
style: new TextStyle(
color: Colors.blue,
),
recognizer:new TapGestureRecognizer()..onTap = () {
//点击具体事件处理
print("TapGestureRecognizer");
}
),
],
),
这里有个 .. 的 Dart 语法,这是以前没见过的,查看文档,这种叫
Cascade notation (..)(级联操作符)
级联操作符 (..) 可以在同一个对象上 连续调用多个函数以及访问成员变量。 使用级联操作符可以避免创建 临时变量。
Text 点击事件
Text 点击事件需要借助 GestureDetector
new GestureDetector(
child: new Text(
'$_counter',
textAlign: TextAlign.justify,//对齐方式
textDirection:TextDirection.ltr,
style: Theme.of(context).textTheme.display1,
),
onTap: () {
print("Text");
},
)
这样在 onTap 里面就可以处理点击事件了,另外还有 onDoubleTap 和 onLongPress 等等手势操作事件。