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 限制行數(shù)
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 未設(shè)置屬性是否繼承父節(jié)點樣式
- color 字體顏色
- backgroundColor 背景顏色
- fontSize 字體大小,單位為 pt 或 sp ,默認(rèn) 14 sp
- fontWeight 字體的粗細(xì),正常 (FontWeight.w400) 和粗體
- fontStyle 字體樣式,正常和斜體
- letterSpacing 字符之間的間距倍數(shù)
- wordSpacing 單詞間隙
- textBaseline 對齊表意文字的水平線
- height 字體的倍數(shù)
- locale 多國語言設(shè)置
- foreground 通過 Paint 來設(shè)置字體的顏色,color 和 foreground 不能同時設(shè)置
- background 通過Paint來設(shè)置字體的背景顏色,backgroundColor 和 background 不能同時設(shè)置
- shadows 文字陰影
- decoration TextDecoration.none 沒有 TextDecoration.underline 下劃線TextDecoration.overline 上劃線TextDecoration.lineThrough 中間的線(刪除線)
- decorationColor 劃線的顏色
- decorationStyle 劃線的樣式 TextDecorationStyle.solid 實線 TextDecorationStyle.double 畫兩條線 TextDecorationStyle.dotted 點線(一個點一個點的)TextDecorationStyle.dashed 虛線(一個長方形一個長方形的線)TextDecorationStyle.wavy 正玄曲線
- decorationThickness 劃線粗細(xì)的寬度
- debugLabel 調(diào)試標(biāo)簽
- fontFamily 字體名稱
- fontFamilyFallback 文字字體列表,如果前面的 fontFamily 提供了,以fontFamily 為準(zhǔn),如果沒有提供,則使用該列表第一個元素作為字體,都沒提供則使用默認(rèn)字體
- 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 (..)(級聯(lián)操作符)
級聯(lián)操作符 (..) 可以在同一個對象上 連續(xù)調(diào)用多個函數(shù)以及訪問成員變量。 使用級聯(lián)操作符可以避免創(chuàng)建 臨時變量。
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 等等手勢操作事件。