Flutter常用組件之Text

Flutter常用組件之Text

最近在學習flutter,就在CSDN買了一個課程學習。網上也有好多免費的教程，
有點學不進去，花錢買完了就能看進去了。花完錢不學習感覺就有點罪惡感。
哈哈  真香。下面對Text簡單的介紹一下 。

樣式

style: TextStyle(
    //字體顏色
    color: const Color(0xffff0000),
    // 刪除線  none 不顯示裝飾線條 underline 字體下方 overline 字體上方 lineThrough 穿過文字
    decoration: TextDecoration.underline,
    // solid 直線 double 雙下劃線 dotted 虛線 dashed 點下劃線 wavy 波浪線
    decorationStyle: TextDecorationStyle.double,
    decorationColor: const Color(0xff00ff00),
    //decorationColor: Colors.red,
    //字體大小
    fontSize: 25.0,
    // normal 正常 italic 斜體
    fontStyle: FontStyle.normal,
    // monospace  serif 字體
    fontFamily: 'serif',
    // 字體粗細  w100 - w900  normal(w400) bold(w700)
    fontWeight: FontWeight.bold,
    //字間距
    letterSpacing: 5.0,
    //高度
    height: 2,
  )

段落的間距樣式

在這strutStyle: StrutStyle(
    //字體
    fontFamily: 'serif',
    //字體集合 如果fontFamily未設置 會在結合裏面尋找
    fontFamilyFallback: ['monospace', 'serif'],
    //大小
    fontSize: 25.0,
    //高度
    height: 2,
    //首字母和後面字母背書關係
    leading: 2.0,
    fontWeight: FontWeight.w200,
    fontStyle: FontStyle.normal,
    //是否強制設置間距高度
    forceStrutHeight: true,
    debugLabel: 'text demo',
  )裏插入代碼片

文本對齊方式

可以選擇左對齊、右對齊還是居中。

textAlign: TextAlign.left,

文字方向

  textDirection: TextDirection.ltr,

文本的最大顯示行數

//clip 裁剪  fade 淡入   ellipsis 省略號   visible 容器外也會渲染組件
  overflow: TextOverflow.ellipsis,,
  maxLines: 3,