Screenshot_1589034997.png

import 'package:flutter/material.dart';

void main () {
  runApp(myApp()); // 主入口
}

class myApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      title:'Text Widget', 
      // 腳手架
      home:Scaffold( 
        body:Center(
          // Text Widgit
          child:Text(
          'hello xzp! 一起來學(xué)習(xí)這個Flutter吧', // 文本內(nèi)容
          textAlign: TextAlign.center, // 文本對齊方式
          maxLines: 1, // 文本最大展示行數(shù)
          overflow: TextOverflow.ellipsis, // 文本溢出處理方式
          style: TextStyle(
           fontSize: 20.0,  // 文本字體大小
           color: Color.fromARGB(255,255, 120, 30), // 文本顏色
           decoration: TextDecoration.underline, // 線條
           decorationStyle: TextDecorationStyle.dashed // 線條類型
          )),
        )
      )
    );
  }
}

Text Widget

是我學(xué)習(xí)的第一個組件，記錄一下吧

textAlign 文本的對齊方式

例：TextAlign.center 

center:   文本居中對齊
left:     文本左對齊
right :   文本右對齊
start:    以文本開始位置進行對齊，類似于左對齊
end:      以文本結(jié)尾處進行對齊，類似右對齊

maxLines 文本最大行數(shù)

例：maxLines: 1

overflow 文本溢出時的處理方式

例：TextOverflow.ellipsis
clip：      直接切斷，剩下的文字就沒有了。
ellipsis：  在后邊顯示省略號。
fade：      溢出的部分會進行一個漸變消失的效果。

style 文本屬性 （設(shè)置文本的顏色，字號，字體等屬性）

例：
    fontSize: 20.0,  // 文本字體大小
    color: Color.fromARGB(255,255, 120, 30), // 文本顏色
    decoration: TextDecoration.underline, // 線條
    decorationStyle: TextDecorationStyle.dashed // 線條類型