How to inherit to another page from cloud firestore?

Viewed 70

I have page with cards, fill out cloud firestore:

child: StreamBuilder(
            stream:
                FirebaseFirestore.instance.collection('Items').snapshots(),
            builder: (context, snapshot) {
              if (!snapshot.hasData) return const Text('Loading...');
              return GridView.count(
                crossAxisCount: 2,
                shrinkWrap: true,
                mainAxisSpacing: 15.0,
                crossAxisSpacing: 20.0,
                childAspectRatio:
                    (SizeConfig.itemWidth / SizeConfig.itemHeight),
                children: [
                  ...List.generate(snapshot.data.docs.length, (index) {
                    return buildItemCard(
                        context, snapshot.data.docs[index]);
                  })
                ],
              );
            },
          ),

how to make the info from the card to another page (page with description) to be displayed by clicking on the card?

1 Answers

First of all, this does not have anything to do with Firestore at this point in your app's execution, since you will only operate your GridViewItems.

What you need to do is create a onTap action in you items like this community answer, applying that to your code you could do something like:

children: [
    ...List.generate(snapshot.data.docs.length, (index) {
        return buildItemCard(
            context, 
            snapshot.data.docs[index],
            onTap: doSomething(snapshot.data.docs[index])
        );
    })
],

void _onTileClicked(DocumentSnapshot doc){
     //do something here
}
Related