Flutter Text底部黄色双划线

问题

文字下面出现黄色双划线
没有使用Scaffold脚手架组件,Scaffold是一个Material风格APP的脚手架(包含AppBar、Body、ActionButton),Text不是在Material组件下,但是有些时候我们并不想使用Scaffold嵌套在最外层,比如一个Dialog或者其他的。
只需要将Text放在Material为根的组件中,Text就会继承Material的主题,否则Text会使用默认TextDecoration,默认的TextDecoration会有黄色双下划线。

解决方案

所以我们有几种解决方法:
1.使用Scaffold脚手架组件

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('Sample Code'),
    ),
    body: Center(
      child: Text('You have pressed the button $_count times.')
    ),
    backgroundColor: Colors.blueGrey.shade200,
    floatingActionButton: FloatingActionButton(
      onPressed: () => setState(() => _count++),
      tooltip: 'Increment Counter',
      child: const Icon(Icons.add),
    ),
  );
}

2.修改根组件为Material组件

Widget build(BuildContext context) {
    return Material(
        type: MaterialType.transparency,
        child: Container()
    );
}

3.不使用默认TextDecoration

Text("Text Content",
  style: TextStyle(
    decoration: TextDecoration.none,
  )
);
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容