Want to create infinite list with Cloud Firestore in flutter? I am not sure whether it is possible or not with Streambuilder. I have integrated the similar functionality in my App using the startAfter method as shown in below example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 | class Feed extends StatefulWidget { Feed({this.firestore}); final Firestore firestore; @override _FeedState createState() => _FeedState(); } class _FeedState extends State<Feed> { ScrollController controller; DocumentSnapshot _lastVisible; bool _isLoading; CollectionReference get homeFeeds => widget.firestore.collection('homefeed'); List<DocumentSnapshot> _data = new List<DocumentSnapshot>(); final scaffoldKey = GlobalKey<ScaffoldState>(); @override void initState() { controller = new ScrollController()..addListener(_scrollListener); super.initState(); _isLoading = true; _getData(); } Future<Null> _getData() async { // await new Future.delayed(new Duration(seconds: 5)); QuerySnapshot data; if (_lastVisible == null) data = await widget.firestore .collection('homefeed') .orderBy('created_at', descending: true) .limit(3) .getDocuments(); else data = await widget.firestore .collection('homefeed') .orderBy('created_at', descending: true) .startAfter([_lastVisible['created_at']]) .limit(3) .getDocuments(); if (data != null && data.documents.length > 0) { _lastVisible = data.documents[data.documents.length - 1]; if (mounted) { setState(() { _isLoading = false; _data.addAll(data.documents); }); } } else { setState(() => _isLoading = false); scaffoldKey.currentState?.showSnackBar( SnackBar( content: Text('No more posts!'), ), ); } return null; } @override Widget build(BuildContext context) { return Scaffold( key: scaffoldKey, appBar: new AppBar(), body: RefreshIndicator( child: ListView.builder( controller: controller, itemCount: _data.length + 1, itemBuilder: (_, int index) { if (index < _data.length) { final DocumentSnapshot document = _data[index]; return new Container( height: 200.0, child: new Text(document['question']), ); } return Center( child: new Opacity( opacity: _isLoading ? 1.0 : 0.0, child: new SizedBox( width: 32.0, height: 32.0, child: new CircularProgressIndicator()), ), ); }, ), onRefresh: ()async{ _data.clear(); _lastVisible=null; await _getData(); }, ), ); } @override void dispose() { controller.removeListener(_scrollListener); super.dispose(); } void _scrollListener() { if (!_isLoading) { if (controller.position.pixels == controller.position.maxScrollExtent) { setState(() => _isLoading = true); _getData(); } } } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
