Il existe plusieurs héros qui partagent la même balise dans un sous-arbre

Question

J'essaie de naviguer d'un écran à l'autre avec un itinéraire. Lorsque je clique sur le bouton de la page pour passer à l'itinéraire à condition que j'obtienne l'erreur

 I/flutter ( 8790): Another exception was thrown: There are multiple heroes that share the same tag within a subtree.
 

Voici le code:

Itinéraires:

  <String, WidgetBuilder>{
    '/first':(BuildContext context) =>NavigatorOne() ,
    '/second':(BuildContext context) =>NavigatorTwo(),
    '/third':(BuildContext context) =>NavigatorThree(),

  },

Navigator.of(context).pushNamed('/first');
Navigator.of(context).pushNamed('/second');
Navigator.of(context).pushNamed('/third');

class NavigatorOne extends StatefulWidget {
  @override
  _NavigatorOneState createState() =>  _NavigatorOneState();
}

class _NavigatorOneState extends State<NavigatorOne> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(

      appBar: AppBar(),
      body: Container(
      color: Colors.green,
      child: RaisedButton(child: Text(' one 1'),onPressed: (){
        Navigator.of(context).pushNamed('/second');
      },),
    ),
    ); 
  }
}
 

Et l'erreur:

══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY ╞═════════════════════════════════════════════════════════ I/flutter (21786): The following assertion was thrown during a scheduler callback: I/flutter (21786): There are multiple heroes that share the same tag within a subtree. I/flutter (21786): Within each subtree for which heroes are to be animated (typically a PageRoute subtree), each Hero I/flutter (21786): must have a unique non-null tag. I/flutter (21786): In this case, multiple heroes had the following tag: <default FloatingActionButton tag>

Comment résoudre ce problème?

Answer 1

J'ai rencontré cette avant, et c'était parce que j'avais deux FloatingAction boutons sur un écran, j'ai dû ajouter un heroTag propriété + valeur par FloatingActionButton pour l'erreur de s'en aller.

Exemple:

new FloatingActionButton(
    heroTag: "btn1",
    ...
)

new FloatingActionButton(
    heroTag: "btn2",
    ...
)

À partir de l'exemple de code que vous avez fournis, il n'apparaît pas que vous avez un FloatingActionButton, mais à partir de l'erreur, il ne semble pas faire référence:

I/flutter (21786): In this case, multiple heroes had the following tag: default FloatingActionButton tag

Peut-être que vous avez utilisé sur la page que vous naviguiez à qui a ensuite déclenché l'erreur. Notez que si vous utilisez un moyen via un programme de création de tagged héros, vous aurez besoin de trouver un moyen de leur donner des balises différentes. Par exemple, si vous avez un ListView.builder() créer FloatingActionButtons, essayer de passer les balises de mise en forme de chaîne de sorte que chaque bouton a une autre balise, par exemple: heroTag: "btn$index".

En tout cas, l'espoir qui aide quelqu'un.

Answer 2

Vous pouvez définir un identifiant unique ou uniquement définir null:

 new FloatingActionButton(
heroTag: null,
...
)
 

Answer 3

Juste pour les lecteurs à l'avenir:

en appréciant le commentaire de @ m.vincent, la cause de cette erreur pour moi est que j'utilisais Hero dans SliverChildBuilderDelegate qui (évidemment) a un index, donc j'ai utilisé l'index avec la balise comme 'tag$index' aime ça

 SliverChildBuilderDelegate(
    (BuildContext context, int index) {
      return Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Hero(
              tag: 'tagImage$index',
              child: Image.asset(
                'image source here',
              ),
            ),
 

REMARQUE: cela peut se produire avec n'importe quel widget avec des enfants créés par index comme ListView.Builder

Answer 4

Ajoutez autant de widgets que vous le souhaitez avec des balises de héros comme des chaînes

   Widget floatingButt(Function function, IconData icon, String heroTag) {
    return FloatingActionButton(
      onPressed: function,
      heroTag: heroTag,
      materialTapTargetSize: MaterialTapTargetSize.padded,
      backgroundColor: Constants.primaryColor, // from your values file
      child: Icon(
        icon,
        size: 36.0,
      ),
    );
  }
 

Answer 5

J'ai eu le même problème, je l'ai résolu en fermant le code de Visual Studio, puis en l'ouvrant et en exécutant le projet