Желтые линии под текстовыми виджетами во Flutter?

Работаю над своим первым приложением для флаттера. На главном экране приложения этой проблемы нет, все тексты отображаются так, как должны.

Однако на этом новом экране, который я разрабатываю, у всех текстовых виджетов есть какая-то странная желтая линия / двойная линия внизу.

Есть идеи, почему это происходит?

Проблема не в том, есть Scaffoldили нет. Scaffoldявляется помощником для Materialприложений ( AppBar, Drawerи тому подобного). Но вас не заставляют использовать Material.

Вам не хватает экземпляра Themeродительского элемента .

Почему это важно знать? Потому что, когда вы будете разрабатывать модальное окно ( showDialogнапример, используя ), вы столкнетесь с той же проблемой. НО Scaffold - это непрозрачный полноэкранный виджет! И вы, очевидно, не хотите этого в вашем модальном окне.

Есть много способов представить экземпляр темы. В приложении Material это обычно достигается путем создания экземпляра Materialвиджета. И угадайте, что? Scaffoldсоздает для вас. Но Dialogтоже!

Добавить Materialвиджет как корневой элемент.

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

Вы можете использовать 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
)

У стиля текста есть аргумент оформления, которому можно присвоить значение none

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

Кроме того, как уже упоминалось, если ваш виджет Text находится в дереве виджета Scaffold или Material, вам не понадобится стиль текста оформления.

Также вы можете использовать украшение: TextDecoration.none, чтобы удалить подчеркивание

Просто добавляю еще один способ, с которым я сталкиваюсь, к этим ответам.

Оберните корневой виджет вокруг виджета DefaultTextStyle . Здесь нет необходимости изменять каждый текстовый виджет.

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

Надеюсь, это кому-то поможет.

Вы должны добавить виджеты Material и Scaffold в файл main.dart.

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

Для этого есть другое решение, особенно если вы используете несколько страниц, заключенных в файл main.dart. Вы можете сделать что-то вроде этого:

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

Это удалит желтые линии под текстом, который присутствует на всех страницах, на которые есть ссылки / которые используются в оболочке.

Вам просто нужно добавить корневой виджет Material.

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

Доступны 2 способа:

использовать scaffuld в родительском элементе экрана

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

использовать материал для родительского элемента виджета

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