L. Gangemi
L. Gangemi

Reputation: 3300

Flutter and Firestore, handle data from StreamBuilder

I'm right now trying to make a Quiz like application in flutter for learning this Framework.

I've implemented Firebase Firestore to manage the application data. From this flutter plugin documentations I read about binding a CollectionReference to a ListView and it was pretty easy.

My problem is the following. I've got some categories to display in the Home page, I want the user to be able to select which one he wants and then store this information in a List.

With this code I can display the list:

@override


Widget build(BuildContext context) {
    return StreamBuilder<QuerySnapshot>(
      stream: Firestore.instance.collection('Categorie').snapshots(),
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) return new Text('Error: ${snapshot.error}');
        switch (snapshot.connectionState) {
          case ConnectionState.waiting:
            return new Center(
              child: Column(
                children: <Widget>[
                  SizedBox(
                    child: CircularProgressIndicator(),
                    height: 50.0,
                    width: 50.0,
                  ),
                  Text('Dowload delle categorie...')
                ],
              ),
            );
          default:
            _loadListOfCategories(snapshot);
            return new ListView(
              children:
                  snapshot.data.documents.map((DocumentSnapshot document) {
                var nome = document['Nome'];
                print('doc: $nome');
                return new CategoryWidget(
                  id: document.documentID,
                  tap: onCategoryTap,
                  nome: document['Nome'],
                  count: document['Count'],
                  checked: false,
                );
              }).toList(),
            );
        }
      },
    );
  }

CategoryWidget is just a simple stateless widget which act as a ListTile.

The result is the following:

Home page

Now, how can I save a List full of Category models, which one implementing a "checked/unchecked" property, and how can I keep this List updated?

I tried using "_loadListOfCategories()" method exacly inside the builder:

  void _loadListOfCategories(AsyncSnapshot<QuerySnapshot> snapshot) {
    var temporalList = new List<CategoryModel>();
    for (DocumentSnapshot doc in snapshot.data.documents) {
      temporalList.add(new CategoryModel(
          id: doc.documentID,
          count: doc['Count'],
          nome: doc['Nome']));
    }
    setState(() {
      _listOfCategories = temporalList;
    });
  }

But I couldn't call setState() here becouse I'm actually inside the building method.

Upvotes: 0

Views: 2794

Answers (1)

user3907398
user3907398

Reputation: 14

use a map, your key will be 'document.documentID' and the value a boolean.

Map map = Map() // assuming this a string document.documentID

checked: map.get(document.documentID), in your checkbox you call setState()=> map.put(document.documentID, !map.get(document.documentID));

Upvotes: 1

Related Questions