Text

属性

 textAlign: TextAlign.left,                           -----文本对齐方式
 maxLines: 1,                                            -----显示最大行
 overflow: TextOverflow.clip,                 -----文本溢出的处理方式
  • clip：直接切断溢出的文字。
  • ellipsis:在后边显示省略号（...）  常用
  • fade: 渐变消失效果

style文字的样式

 1 body: new Center(
 2           child: new Text('非淡泊无以明志，非宁静无以致远。(诸葛亮)',
 3               textAlign: TextAlign.left,
 4               maxLines: 1,
 5               overflow: TextOverflow.ellipsis,
 6               style: TextStyle(
 7                 fontSize: 20,
 8                 color: Color.fromARGB(255, 0, 0, 255),
 9                 decoration: TextDecoration.underline,
10                 decorationStyle: TextDecorationStyle.solid,
11                 fontStyle: FontStyle.italic,
12               )),
13         ),

 案例

Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  textAlign: TextAlign.center, // 文本对齐方式
),
Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  softWrap: false, // true时会自动换行处理；false时会判定为有无限的水平空间，不会换行
),
Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  maxLines: 1, //最大行数
  style: TextStyle(
    color: Colors.blue,
  ),
),
Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  overflow: TextOverflow.ellipsis, //溢出处理，这里ellipsis将多余的内容设置为...
),
Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  style: TextStyle( // 文本样式
    color: Colors.red, // 文本颜色
    fontSize: 14, // 字体大小
    fontWeight: FontWeight.w600, // 字体粗细程度
    fontStyle: FontStyle.normal, // 字体样式
    letterSpacing: 2, // 字母或字间距
    wordSpacing: 5, // 单词间距
    height: 2, // 行高，值为字体大小的倍数
    shadows: [Shadow(color: Colors.red, offset: Offset(1, 1), blurRadius: 5)], // 阴影
  ),
),
Text(
  'Flutter allows you to build beautiful native apps on iOS and Android from a single codebase.',
  style: TextStyle(
    decoration: TextDecoration.underline, // 文本装饰，此处设置下划线
    decorationColor: Colors.blue, // 文本装饰颜色
    decorationStyle: TextDecorationStyle.dotted, // 文本装饰样式
  ),
),

 

posted @ 2020-03-13 14:57  lai1322  阅读(366)  评论(0)  编辑  收藏  举报