Flutter: Pre-load data into Firestore local cache on the first load

Question

I've implemented Cloud Firestore into my Flutter app and encountered this problem: if there's no network connection on the very first load of the app (after installation), no data is shown. My question is: How to make so that the data from Firestore is shown on the first load (after installation) even without internet connection? My code for fetching data is this:

class QuestionsListState extends State<QuestionsList> {
  @override
  Widget build(BuildContext context) {

    return new StreamBuilder<QuerySnapshot>(
      stream: _questionsCollectionReference
          .where("category", isEqualTo: _chosenCategory).orderBy("order").snapshots,
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (!snapshot.hasData) return const Text('');
        final int messageCount = snapshot.data.documents.length;
        return new ListView.builder(
          itemCount: messageCount,
          itemBuilder: (_, int index) {
            final DocumentSnapshot document = snapshot.data.documents[index];
            return new ListTile(
              title: new FlatButton(
                  onPressed: () {
                    Navigator.push(context, new MaterialPageRoute(
                      builder: (BuildContext context) => new AddAnswerDialog(),
                      fullscreenDialog: true,
                    ));
                  },
                  child: new Text(
                    document['text'],
                    style: new TextStyle(fontSize: 18.0, color: Colors.blue),
                  )),
            );
          },
        );
      },
    );
  }
}

Atheism

Answer 1

I ran into a similar situation. The solution for me was to load that data from disk, by using a FutureBuilder instead of const Text('')

In other words, your structure would be:

• StreamBuilder
  • when hasData is false
    • FutureBuilder
      • when hasData is false
        • show a CircularProgress
      • when hasData is true
        • show disk data
  • when hasData is true
    • show online data

For a first-time user, this will show a CircularProgress, followed by data from disk, followed by online data. If the online data does not load (no network), the user keeps seeing the disk data.

Gertrude

Answer 2

Could just check whether any data is already cached before adding again.

Have also found this flutter info YouTube video by Tensor Programming useful Making Use of Utility Plugins for Dart's Flutter Framework especially the connectivity status part.

Worley

Answer 3

Would this do it? Haven't tried yet but looking at doing similar for an offline initially National Park app next month.

Firestore.instance.collection('<collection>').document().setData(
        {
          '<field>': '<data>',
        },
      );

uses cloud firestore plugin > https://github.com/flutter/plugins/tree/master/packages/cloud_firestore

Worley

Yes it does, but I need to do it only once - on the very first load after installation. So I'll think about placing the code in the right place or trying to put cache along with app files in apk. Thanks! – Atheism

I really dont see what it has to do with the question – Giuliana