1

I need an example code in which a Flutter Gridview builder streams Firebase data (for example with a single Collection and multiple Documents with multiple fields in each) that can be modified by the user straight from the Gridview

I've watched this tutorial => https://www.youtube.com/watch?v=ErP_xomHKTw Although it shows how to access and modify data from Firebase I still can't wrap my head around the Firebase and Gridview builder interaction.

krishnaacharyaa
  • 14,953
  • 4
  • 49
  • 88

1 Answers1

2

Stream Builder using GridView

StreamBuilder<QuerySnapshot>(
    stream: FirebaseFirestore.instance.collection('products').snapshots(),
    builder: (context, snapshot) {
        if (snapshot.hasData) {
        return  GridView.builder(
            gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
                maxCrossAxisExtent: 200,
                childAspectRatio: 3 / 2,
                crossAxisSpacing: 20,
                mainAxisSpacing: 20),
            itemCount: snapshot.data!.docs.length,
            itemBuilder: (context, index) {
                DocumentSnapshot doc = snapshot.data!.docs[index];
                return Column(
                       children:[
                           Text(doc['name']),
                           Text(doc['price']);
                       );
              );
            }),
        } else {
        return Text("No data");
        }
    },
)

Stream Builder using ListView

StreamBuilder<QuerySnapshot>(
    stream: FirebaseFirestore.instance.collection('products').snapshots(),
    builder: (context, snapshot) {
        if (snapshot.hasData) {
        return ListView.builder(
            itemCount: snapshot.data!.docs.length,
            itemBuilder: (context, index) {
                DocumentSnapshot doc = snapshot.data!.docs[index];
                return Column(
                       children:[
                           Text(doc['name']),
                           Text(doc['price']);
                       );
            });
        } else {
        return Text("No data");
        }
    },
)
krishnaacharyaa
  • 14,953
  • 4
  • 49
  • 88
  • Thanks so much Krishna How about getting data from nested values in the fields? Say the variable "price" has two nested values like price for a single product and a price for package... how do I extract those?! – HG Florence Tours Jan 05 '23 at 19:07
  • Happy to hear it worked . Could you possibly open a new question I'd be happy to help you there, here editing again would be a mess , consider upvoting and accepting the answer if it worked thank you – krishnaacharyaa Jan 06 '23 at 00:40