Flutter中Text Widgets下的黄线？

Question

在我的第一个扑动应用程序上工作.主应用程序屏幕没有此问题,所有文本都显示为应该.

然而,在我正在开发的这个新屏幕中,所有文本小部件都有一些奇怪的黄线/双线.

有关为什么会发生这种情况的任何想法？

Answer 1

问题不在于Scaffold没有. Scaffold是Material应用程序的助手(AppBar,Drawer那种东西).但你不是被迫使用Material.

你缺少的是Theme作为父母的实例.

知道为什么这很重要？因为当你开发一个模态(showDialog例如使用)时,你将面临同样的问题.但是脚手架是一个不透明的全屏小部件!你显然不希望你的模态.

有很多方法可以引入Theme实例.在Material App中,这通常通过实例化MaterialWidget 来实现.你猜怎么着？Scaffold为你创造一个.但是Dialog呢!

Answer 2

添加Material小部件作为根元素.

@override
  Widget build(BuildContext context) {
    return Material(
        type: MaterialType.transparency,
        child: new Container(

Answer 3

文本样式有一个装饰参数，可以设置为 none

Text("My Text",
  style: TextStyle(
    decoration: TextDecoration.none,
  )
);

此外，正如其他人所提到的，如果您的 Text 小部件位于 Scaffold 或 Material 小部件的树中，您将不需要装饰文本样式。

Answer 4

只是在这些答案中添加我遇到的另一种方式。

将根 Widget 包裹在DefaultTextStyle小部件周围。改变每个文本小部件在这里不是必需的。

DefaultTextStyle(
    style: TextStyle(decoration: TextDecoration.none), 
    child : Your_RootWidget
)

希望它可以帮助某人。

Answer 5

您应该在 main.dart 文件中添加 Material 和 Scaffold 小部件

 MaterialApp(
  home: Scaffold(
    body: Text('Hello world'),
  ),
);

Answer 6

在您的 中Text Widget，使用该style属性并设置decoration为null如下所示：

Text( 
   "hello world",
   style: TextStyle(
       decoration: TextDecoration.none
   ),
)

这将删除文本下方的黄线。

Answer 7

您可以使用Scaffold（通常更好），也可以使用其他提供材料主题的组件，例如简单的Material小部件。

这是示例，使用其中任何一个：

var text = Scaffold(body: Text("Hi"),);
var text2 = Material(child: Text("Hi"),);

作为解决方法，您可以使用：

Text(
  'Your text',
  style: TextStyle(decoration: TextDecoration.none), // removes yellow line
)

Answer 8

您也可以使用修饰：TextDecoration.none删除下划线

Answer 9

前

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Center(
          child: Text(
            "21:34",
            style: TextStyle(fontSize: 50),
          ),
        ),
        Center(
          child: Text(
            "Wakey - wakey",
            style: TextStyle(fontSize: 20),
          ),
        )
      ],
    );
  }

之后（解决方案）：

Scaffold这里用widget包裹当前的顶部或父级 widget

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Center(
            child: Text(
              "21:34",
              style: TextStyle(fontSize: 50),
            ),
          ),
          Center(
            child: Text(
              "Wakey - wakey",
              style: TextStyle(fontSize: 20),
            ),
          )
        ],
      ),
    );
  }

完整代码：Dartpad 或 Live 代码

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: sta()));

class sta extends StatefulWidget {
  const sta({Key? key}) : super(key: key);

  @override
  State<sta> createState() => _staState();
}

var isShow = false;


class _staState extends State<sta> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Center(
            child: Text(
              "21:34",
              style: TextStyle(fontSize: 50),
            ),
          ),
          Center(
            child: Text(
              "Wakey - wakey",
              style: TextStyle(fontSize: 20),
            ),
          )
        ],
      ),
    );
  }
}