Question

使用我的第一个扑动应用程序。主应用程序屏幕没有这个问题，所有文本都显示出来。

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

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

Answer 1

问题是没有Scaffold。 Scaffold是Material个应用（AppBar，Drawer的帮手，这类东西。但是你并没有被迫使用Material。

您缺少的是Theme作为父母的实例。

为什么知道这一点很重要？因为当您开发模态时（例如使用showDialog），您将面临同样的问题。但是脚手架是一个不透明的全屏小部件！而你显然不想在你的模态中使用它。

有很多方法可以引入Theme实例。在Material App中，这通常通过实例化Material Widget来实现。你猜怎么着？ Scaffold为您创建一个。但Dialog也是如此！

Answer 2

将Material小部件添加为根元素。

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

Answer 3

只需添加我遇到这些答案的另一种方式即可。

将根小部件包装在DefaultTextStyle小部件周围。这里不需要更改每个“文本”小部件。

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

希望它对某人有帮助。

Answer 4

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

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

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

Answer 5

文字样式的修饰参数可以设置为无

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

Answer 6

还有另一种解决方案，特别是如果您使用包裹在 main.dart 文件下的多个页面，则可以执行以下操作：

  child: MaterialApp(
    home: Material(child: Wrapper()),
  ),

这将删除在包装器下引用/使用的任何页面中存在的文本下的黄线。

Answer 7

有2种方法：

在屏幕的父级中使用scaffuld

Scaffold(body: Container(child:Text("My Text")))

为小部件的父项使用材料

Material(child: Text("My Text"))

Answer 8

您只需要添加Material根小部件。

      @override
       Widget build(BuildContext context) {
      return Material(
         child: new Container(),
        );
       }

Answer 9

在Text Widget内，使用style属性，并将decoration设置为null，如下所示：

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

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

Answer 10

在我们的 DefaultTextStyle 的 builder 下添加 MaterialApp，如下所示：

child: MaterialApp(      
  ...
  ...
  theme: yourThemeData,
  builder: (context, child) => DefaultTextStyle(
    style: yourThemeData.textTheme.bodyText1,
    child: child,
  ),
),

通过这样做，我们不需要在每次要使用 style 或 DefaultTextTheme 时指定 showDialog 或具有 Overlay。

Answer 11

问题：您的小部件没有默认文本样式，

解决方案：合二为一！

DefaultTextStyle(
    style: TextStyle(),
    child: yourWidget,
  );

记住如果你没有设置任何颜色，默认文本颜色是白色！

Answer 12

黄线来自_errorTextStyle。该文档指出您应该定义一个 DefaultTextStyle 父级（或使用 Material，它为您执行此操作）：

<块引用>

MaterialApp 使用这个 TextStyle 作为它的 DefaultTextStyle 来鼓励开发者有意识地使用他们的 DefaultTextStyle。

在 Material Design 中，大多数 Text 小部件都包含在 Material 小部件中，它设置了特定的 DefaultTextStyle。如果您看到使用此文本样式的文本，请考虑将文本放入 Material 小部件（或其他设置 DefaultTextStyle 的小部件）中。

开发没有材料的 Flutter 应用程序不是大多数人会做的事情，但如果这是您的用例，您应该使用 DefaultTextStyle。

与接受的答案相反，Theme 没有设置 DefaultTextStyle，因此它不能解决您的问题。 Scaffold 确实解决了这个问题，因为它包含 Material，它反过来定义了 DefaultTextStyle，但是 Scaffold 比您需要的 Dialog 多一点， Hero 等

要为整个应用程序永久解决此问题，您可以在 DefaultTextStyle MaterialApp 中设置 builder。这解决了您应用的所有组件的问题，而不仅仅是您正在处理的当前屏幕。

Answer 13

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

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

Answer 14

还可以使用修饰符：TextDecoration.none删除下划线

Flutter中Text Widgets下的黄线？

14 个答案: