Lignes jaunes sous les widgets de texte dans Flutter ?

Question

L'écran principal de l'application n'a pas ce problème, tous les textes s'affichent correctement.

Cependant, sur la nouvelle écran, tous les widgets de texte ont une étrange ligne jaune/double ligne en dessous.

Des idées sur la raison de ce problème?

Answer 1

Le problème est d'avoir un Scaffold ou non. Scaffold est un assistant pour les applications Material ( AppBar, Drawer, ce genre de choses). Mais vous n'êtes pas obligé d'utiliser Material.

Ce qui vous manque, c'est une instance de DefaultTextStyle en tant que parent :

DefaultTextStyle(
  style: TextStyle(...),
  child: Text('Bonjour le monde'),
)

Divers widgets en ajoutent un pour modifier le thème de texte par défaut, tels que Scaffold, Dialog, AppBar, ListTile, ...

C'est DefaultTextStyle qui permet par exemple à votre titre de barre d'applications d'être gras par défaut.

Answer 2

Ajouter le widget Material en tant qu'élément racine.

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

Answer 3

Tout ce que vous avez à faire est de fournir un widget Material, ou un Scaffold qui couvre internment ce widget. Vous pouvez le faire de plusieurs manières :

• Utiliser Material (simple et meilleur) :

  Material(
    color: Colors.transparent, // <-- Ajoutez ceci, si nécessaire
    child: Text('Bonjour'),
  )

• Définir la propriété Text.style :

  Text(
    'Bonjour',
    style: TextStyle(decoration: TextDecoration.none), // Définissez ceci
  )

• Fournir Scaffold :

  Scaffold(body: Text('Bonjour'))

---

Résoudre les problèmes de texte jaune lors de l'utilisation de Hero :

Comme l'a mentionné aaronvargas, vous pouvez envelopper votre child dans Material lors de l'utilisation de Hero des deux côtés. Par exemple :

Hero(
  tag: 'fooTag',
  child: Material( // <--- Fournir Material
    type: MaterialType.transparency,
    child: VotreWidget(),
  ),
);

Answer 4

Vous pouvez également utiliser decoration: TextDecoration.none pour supprimer le soulignement

Answer 5

Vous devriez ajouter les widgets Material et Scaffold dans le fichier main.dart

 MaterialApp(
  home: Scaffold(
    body: Text('Bonjour le monde'),
  ),
);