Is Not A Subtype Of Type Widget""> Is Not A Subtype Of Type Widget"">
Ad

Flutter GridView "type 'List Is Not A Subtype Of Type Widget"

- 1 answer

it feels like I am doing something out of the ordinary!

I have 2 sub collections (subColl1 and subColl2) within 1 Collection in firebase firestore. I get access to them with CollectionGroup

children: [
          FutureBuilder<List<dynamic>>(
            //<QuerySnapshot>(
            future: Future.wait([
              FirebaseFirestore.instance.collectionGroup('subColl1').get(),
              FirebaseFirestore.instance.collectionGroup('subColl2').get(),
            ]),

Now I want to display both collections into a GridView.count() here:

return GridView.count(
                  restorationId: 'dashboardGridView',
                  crossAxisCount: 2,
                  mainAxisSpacing: 8,
                  crossAxisSpacing: 8,
                  padding: const EdgeInsets.all(8),
                  childAspectRatio: 1,
                  children: <Widget>[
                    snapshot.data[0].docs.map<Widget>((document) {
                      return _DashboardGridViewItem(
                        document: document,
                      );
                    }).toList(),
                    snapshot.data[1].docs.map<Widget>((document) {
                      return _DashboardGridViewItem(
                        document: document,
                      );
                    }).toList(),
                  ],
                );

I tried individually snapshot.data[0].... and snapshot.data[1].... and they worked. But doing it like the above (which is both at the same time) throws an error type 'List<Widget>' is not a subtype of type 'Widget'

I understand the error but there must be a way to display both collections in the same gridview...

you will notice that I pass a document to a private method _DashboardGridViewItem(document: document), which is used to display information from the document. The other way I was thinking is to use a for loop surrounding the gridview and use the index i inside the snapshot.data[i]..... but then am I not returning 2 Gridviews???

need direction..

Ad

Answer

It is expecting a [Widget, Widget, Widget ..], you are instead giving [[Widgets], [Widgets]]

Simplest way to solve is to use the spread operator '...' as in below:

children: <Widget>[
                   ...snapshot.data[0].docs.map<Widget>((document) {
                      return _DashboardGridViewItem(
                        document: document,
                      );
                    }).toList(),
                    ...snapshot.data[1].docs.map<Widget>((document) {
                      return _DashboardGridViewItem(
                        document: document,
                      );
                    }).toList(),
                  ],
Ad
source: stackoverflow.com
Ad