flutter GridView causes Navigator.push error

Question

My flutter app has a button to go to a contact page. It is working well when the GridView has only one floatingButton. But it will have error when the GridView has more than one floatingButton. Please help to solve this issue.

Error:

flutter: The following assertion was thrown during a scheduler callback:
flutter: There are multiple heroes that share the same tag within a subtree.
flutter: Within each subtree for which heroes are to be animated (typically a PageRoute subtree), each Hero
flutter: must have a unique non-null tag.
flutter: In this case, multiple heroes had the following tag:
flutter: Here is the subtree for one of the offending heroes:
flutter: # Hero(tag: , state: _HeroState#232b6)

class _DatabasePageState extends State<DatabasePage> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          backgroundColor: Colors.black,
          appBar: AppBar(
            title: Text('DB'),
            centerTitle: true,
            backgroundColor: Colors.black,
          ),
          body: _showOrderdatabase(),

        );
      }

      Widget _showOrderdatabase() {

        return Column(
          children: <Widget>[
            Container(
              height: 220.0,
              color: Colors.transparent,
              child: new Container(
                  padding: EdgeInsets.all(40.0),
                  decoration: new BoxDecoration(
                    color: Colors.green,
                    borderRadius: BorderRadius.all(const Radius.circular(40.0)),
                  ),
                  child: new Column(
                    children: <Widget>[
                      Text(
                        "vds",
                        style: TextStyle(fontSize: 16.0),
                      ),
                      IconButton(
                        icon: Icon(
                          Icons.email,
                          color: Colors.blueAccent,
                        ),
                        iconSize: 50.0,
                        onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (c) => new ContactUs())),
                      ),
                    ],
                  )),
            ),
            Expanded(
              child: GridView.count(
                primary: false,
                padding: const EdgeInsets.all(20.0),
                crossAxisSpacing: 30.0,
                mainAxisSpacing: 30.0,
                crossAxisCount: 4,
                children: <Widget>[
                  FloatingActionButton(
                    onPressed: null,
                    backgroundColor: Colors.orange,
                    child: Text('今天'),
                    foregroundColor: Colors.black,
                  ),
                  FloatingActionButton(
                    onPressed: null,
                    backgroundColor: Colors.yellow,
                    child: Text('年'),
                    foregroundColor: Colors.black,
                  ),

                ],
              ),
            )
          ],
        );
      }
    }

chemamolins chemamolins · Accepted Answer · 2018-11-12T16:39:11

FloatingActionButton has a heroTag property with the default value const _DefaultHeroTag(),.

Since you have two FloatingActionButtons, you should assign a different tag for each of them:

   children: <Widget>[
      FloatingActionButton(
        onPressed: null,
        heroTag: 'Tag1',
        backgroundColor: Colors.orange,
        child: Text('今天'),
        foregroundColor: Colors.black,
      ),
      FloatingActionButton(
        onPressed: null,
        heroTag: 'Tag2',
        backgroundColor: Colors.yellow,
        child: Text('年'),
        foregroundColor: Colors.black,
      ),
    ],

Or you could set both to null so no Hero widget is added to the tree.

flutter GridView causes Navigator.push error

1 Answers