微信交流群

老孟公众号

# TextSpan

文本片段,html里有个span这里有个TextSpan,作用基本相同,文字放一行,text与children任选一样填写。

TextSpan与RichText配合使用可以实现不同样式文字布局。

TextSpan({
    this.text,
    this.children,//是一个TextSpan的数组,也就是说TextSpan可以包括其他TextSpan
    TextStyle style,
    this.recognizer,//它是点击链接后的一个处理器,用于对该文本片段上用于手势进行识别处理,设定手势识别器
    this.semanticsLabel,
})
1
2
3
4
5
6
7

案例:

RichText(
  text: TextSpan(
      style: DefaultTextStyle.of(context).style,
      children: <InlineSpan>[
        TextSpan(text: '登录即视为同意'),
        TextSpan(
          text: '《xxx服务协议》',
          style: TextStyle(color: Colors.red),
        ),
      ]),
)
1
2
3
4
5
6
7
8
9
10
11

image-20200513184054173

还可以给一部分文字添加点击效果:

TextSpan(
  text: '《xxx服务协议》',
  style: TextStyle(color: Colors.red),
  recognizer: TapGestureRecognizer()..onTap = () {},
),
1
2
3
4
5

本文由Rock提供。