flutter控件之文本控件-Text

Text( 

    '文本是视图系统中的常见控件，用来显示一段特定样式的字符串，就比如Android里的TextView，或是iOS中的UILabel。',

    textAlign: TextAlign.center,//居中显示 

    style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20, color: Colors.red),//20号红色粗体展示

);

Text相关属性如下：

理解了展示单一样式的文本 Text 的使用方法后，我们再来看看如何在一段字符串中支持多种混合展示样式。

混合展示样式与单一样式的关键区别在于分片，即如何把一段字符串分为几个片段来管理，给每个片段单独设置样式。

在 Android 中，我们使用 SpannableString 来实现；

在 iOS 中，我们使用 NSAttributedString 来实现；

在 Flutter 中也有类似的概念，即 TextSpan。

定义变量：

const TextStyle blackStyle =TextStyle(color: Colors.black,fontSize:20,fontWeight: FontWeight.bold);

const TextStyle redStyle =TextStyle(color: Colors.red,fontSize:30,fontWeight:FontWeight.bold);

富文本：

Text.rich( 

    textAlign: TextAlign.center,

   TextSpan( children: [ 

         TextSpan(text:'文本是视图系统中常见的控件，它用来显示一段特定样式的字符串，类似', style: redStyle), //第1个片段，红色样式 

        TextSpan(text:'Android', style: blackStyle), //第1个片段，黑色样式 

        TextSpan(text:'中的', style:redStyle), //第1个片段，红色样式 

        TextSpan(text:'TextView', style: blackStyle) //第1个片段，黑色样式 

    ]), 

);

运行结果：