Flutter - Firestore menu functionality

54 views Asked by At

I want to create an online delivery project in flutter & firebase. For the menu section, each product has different properties, how can i display different screens (or widgets) based on the properties each item has? (ex. when i click on coffee, on the screen about details i want to show size, sugar, while on the burger i want to show toppings, meat type etc) Does anyone have any idea/ advice on how i can do this?example of menu collection in database

1

There are 1 answers

0
Henok On

This is a wide topic, to give you a hint or one way you could do this is make Collection(Products) and each documents represent a unique product, and you can populate the list like below,

class ProductsList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance.collection('Products').snapshots(),
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError)
          return new Text('Error: ${snapshot.error}');
        switch (snapshot.connectionState) {
          case ConnectionState.waiting: return new Text('Loading...');
          default:
            return new ListView(
              children: snapshot.data.documents.map((DocumentSnapshot document) {
                return new ListTile(
                  title: new Text(document['title']),
                  subtitle: new Text(document['description']),
                );
              }).toList(),
            );
        }
      },
    );
  }
}

After that inside your ListTile's onTap navigate to your product page passing the data as a parameter.