A flutter package to simplify pagination with firestore data πŸ—ƒ

Overview

Pagination in Firestore

All Contributors

pub package style: effective dart License: MIT

Setup

Use the same setup used for cloud_firestore package (or follow this).

Usage

In your pubspec.yaml

dependencies:
  paginate_firestore: # latest version

Import it

import 'package:paginate_firestore/paginate_firestore.dart';

Implement it

      PaginateFirestore(
        //item builder type is compulsory.
        itemBuilder: (context, documentSnapshots, index) {
          final data = documentSnapshots[index].data() as Map?;
          return ListTile(
            leading: CircleAvatar(child: Icon(Icons.person)),
            title: data == null ? Text('Error in data') : Text(data['name']),
            subtitle: Text(documentSnapshots[index].id),
          );
        },
        // orderBy is compulsory to enable pagination
        query: FirebaseFirestore.instance.collection('users').orderBy('name'),
        //Change types accordingly
        itemBuilderType: PaginateBuilderType.listView,
        // to fetch real-time data
        isLive: true,
      ),

To use with listeners:

      PaginateRefreshedChangeListener refreshChangeListener = PaginateRefreshedChangeListener();

      RefreshIndicator(
        child: PaginateFirestore(
          itemBuilder: (context, documentSnapshots, index) => ListTile(
            leading: CircleAvatar(child: Icon(Icons.person)),
            title: Text(documentSnapshots[index].data()['name']),
            subtitle: Text(documentSnapshots[index].id),
          ),
          // orderBy is compulsary to enable pagination
          query: Firestore.instance.collection('users').orderBy('name'),
          listeners: [
            refreshChangeListener,
          ],
        ),
        onRefresh: () async {
          refreshChangeListener.refreshed = true;
        },
      )

Contributions

Feel free to contribute to this project.

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue. If you fixed a bug or implemented a feature, please send a pull request.

Getting Started

This project is a starting point for a Dart package, a library module containing code that can be shared easily across multiple Flutter or Dart projects.

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

Contributors ✨

Thanks goes to these wonderful people:


Adam Dupuis

πŸ’»

Gautham

πŸ’»

Hafeez Ahmed

πŸ’»

Claudemir Casa

πŸ’»

Nikhil27bYt

πŸ“–

Ferri Sutanto

πŸ’»

jslattery26

πŸ’»

garrettApproachableGeek

πŸ’»

Sua MΓΊsica

πŸ’»

Austin Nelson

πŸ’»

This project follows the all-contributors specification. Contributions of any kind welcome!

Comments
  • Feature Request

    Feature Request

    Hi, your package is very useful and awesome. I'm wondering if you could add ability to add a widget in between the listviews after certain number of items. Thanks.

    opened by waletoyo1 15
  • Instead of 15 it is Fetching all the documents from the collection

    Instead of 15 it is Fetching all the documents from the collection

    return PaginateFirestore( //item builder type is compulsory. itemBuilder: (context, documentSnapshots, index) { final data = documentSnapshots[index].data() as Map; print("index $index"); return Expanded( child: ListTile( leading: CircleAvatar(child: Icon(Icons.person)), title: data == null ? Text('Error in data') : Text(""), subtitle: Text(""), ), ); }, // orderBy is compulsory to enable pagination query: FirebaseFirestore.instance.collection('users').orderBy('name'), //Change types accordingly itemBuilderType: PaginateBuilderType.listView, shrinkWrap: false, // to fetch real-time data isLive: true, );

    opened by narimetisaigopi 9
  • Work with Sliver(NestedScrollView) scroll with SliverAppBar not working

    Work with Sliver(NestedScrollView) scroll with SliverAppBar not working

    hello .. I love your packages but my project need to tab . when I use this package on NestedScrollView but scroll with SliverAppBar not working . if I fixed that by SliverChildListDelegate or any widget has scroll I have another problem with paginate firestore it's get all document in once . how I fixed that ? thank u ...

    opened by Pro-A 9
  • Updating the query of the paginated list

    Updating the query of the paginated list

    Hi,

    a really useful feature would be the ability to modify the query, e.g. when the user picks a different sort or where condition.

    Right now the paginator sticks to the original query even if you update the query and setState() or use the PaginateRefreshedChangeListener, which makes it impossible to use in more complex scenarios.

    opened by Aurangseb 8
  • Empty display taking full height

    Empty display taking full height

    I think the empty display shouldn't take full height and be scrollable by default. I am trying to center my empty display widget at the center of the screen but it's not fully centered because it's being wrapped by the libraries' container which has a full screen height along with a scroll widget.

    opened by frhnfrq 7
  • Duplication of document snapshot

    Duplication of document snapshot

    Due to this line in the PaginationCubit file, there are certain cases where the same document is included twice in the list.

    emit(PaginationLoaded( documentSnapshots: previousList + newList, hasReachedEnd: newList.isEmpty, ));

    opened by itssidhere 6
  • Feature Request/Bug: Initial Index

    Feature Request/Bug: Initial Index

    Is it possible to have an initial index? For ex. I have a list of docs, but In my application I'm not always starting at 0. The user can actually click a certain object to start the list at any index.

    So If I have the itemsPerPage set to 10. and the user clicks the item at index 12. The list scrolls to 12 at first and then bounces back up to 10 because its the documentsLoaded limit. I'm assuming it's due to the bottom loader interfering.

    Thanks

    opened by jslattery26 5
  • cache query

    cache query

    Hi, any plan to support cache query ? as you know we cannot imagine usage of firestore without caching for most of use case, just close and open the app will trigger new docs read if no local cache configured

    opened by azazadev 5
  • Limit items per page and know when is fetching more documents

    Limit items per page and know when is fetching more documents

    Can we control the limit of items per page? if so, how?

    How to know when is fetching more documents, like a bool variable, to show some CircularProgressIndicator with "loading more data" to the user?

    opened by d-apps 5
  • Adding option for PageView + Discussion about initial index

    Adding option for PageView + Discussion about initial index

    Here is a class you can use that I set up to test the issue that I'm talking about. The initialPage in the initState simulates if someone was clicking the index of 15. Note the itemsPerPage is less at only 10.

    class ProfileFeed extends StatefulWidget {
      @override
      _ProfileFeedState createState() => _ProfileFeedState();
    }
    
    class _ProfileFeedState extends State<ProfileFeed> {
      late PreloadPageController pageController;
      late DocumentSnapshot initialDocument;
      @override
      void initState() {
        //Here's where you can mess with the initial page to see the problem
        pageController = PreloadPageController(initialPage: 15);
        super.initState();
      }
    
      @override
      Widget build(BuildContext context) {
        return PaginateFirestore(
          itemsPerPage: 10,
          onLoaded: (PaginationLoaded) {},
          itemBuilderType: PaginateBuilderType.pageView,
          pageController: pageController,
          emptyDisplay: const Center(child: Text('No posts..')),
          onError: (dynamic error) => Center(
            child: Text('Some error occured'),
          ),
          bottomLoader: Center(
            // optional
            child: CircularProgressIndicator(),
          ),
          itemBuilder: (
            index,
            context,
            documentSnapshot,
          ) {
            return Container(
              width: MediaQuery.of(context).size.width,
              height: MediaQuery.of(context).size.width,
              child: Center(
                child: Text(
                  index.toString(),
                  style: TextStyle(fontSize: 50),
                ),
              ),
            );
          },
          // orderBy is compulsary to enable pagination
          query: FirebaseFirestore.instance
              .collection('posts')
              .orderBy('dateAdded', descending: true),
        );
      }
    }
    
    opened by jslattery26 4
  • Listener example is not working

    Listener example is not working

    Listener example is not working I am receiving syntax errors in Android Studio and will it be able to update whenever a collection changes with pulling a loader

    opened by Samson11 4
  • Live data makes listview jump on it own with new data added

    Live data makes listview jump on it own with new data added

    Hi I am using this package in a project of mine which shows realtime feeds and allows users to like/comment. Whenever I am using the package to pull data in Live mode everything works fine. But whenever there is new data added to the firestore, the listview position scrolls on its own due to the new data added on top. This is because my query fetches data ordered in descending order.

    Any idea how this can be resolved?

    opened by arindammitra06 0
  • Not compatible with cloud_firestore's latest version

    Not compatible with cloud_firestore's latest version

    Hi, I've been using this package for quite a while. And recently, a new feature from Firestore just got launched, which is count(). I wanted to use that feature, but the problem is, I have to upgrade my cloud_firestore package to the latest version, which paginate_firestore doesn't support and results in a version conflict. Is there any chance you can make it so that paginate_firestore is compatible with cloud_firestore's latest version? Or can I do it by myself by forking the package? Any help would be greatly appreciated.

    opened by herryelbert 6
  • Limit total items to be loaded

    Limit total items to be loaded

    First of all this package is very handy and I use it in several projects, so I appreciate it.

    My intention is to load 5 new documents each time user swipes the first 5 documents, so I have this attribute on my widget itemsPerPage: 5,. But my main goal is to restrict some users the maximum amount of documents they can load. Like in a query you would normally use in a FutureBuilder;

    child: FutureBuilder<QuerySnapshot>(
              future: FirebaseFirestore.instance
                  .collection('Upcoming')
                  .orderBy('ReleaseTimestamp')
                  .where('ReleaseTimestamp', isGreaterThan: Timestamp.now())
                  .limit(3) // This actually only loads 3 documents totally
                  .get(),
    

    But when trying to do the exact same procedure with this package the limit method used in the query is ignored;

    class ExampleWidget extends StatelessWidget {
      const ExampleWidget ({Key? key}) : super(key: key);
    
      @override
      Widget build(BuildContext context) {
        return PaginateFirestore(
          pageController: PageController(viewportFraction: 0.85),
          scrollDirection: Axis.horizontal,
          itemsPerPage: 5,
          itemBuilderType: PaginateBuilderType.pageView,
          query: FirebaseFirestore.instance
              .collection('Menu')
              .orderBy('Timestamp', descending: true)
              .limit(10), // ! THIS DOESN'T WORK
          itemBuilder: (context, snapshot, index) {
            return Text(snapshot.toString());
          },
        );
      }
    }
    

    Any idea how can I limit the total queried documents while also using the pagination? Like I want some users to load max 100 documents but paginate these 100 documents 20 by 20.

    opened by appleist-a 1
  • Define maximum number of items or number of pages

    Define maximum number of items or number of pages

    Is it possible to not just limit the number of items per page but limit the total number of items or the number pages. For example, i only want for some cases to display 3 items and stop the pagination no matter how many items are left in the collection. Is this behavior possible?

    Thank you.

    opened by Hassico 1
Owner
Venkatesh Prasad
Flutter Developer
Venkatesh Prasad
Flutter package to simplify pagination of list of items from the internet.

PaginationView Installing In your pubspec.yaml dependencies: pagination_view: ^2.0.0-nullsafety.0 import 'package:pagination_view/pagination_view.da

Venkatesh Prasad 151 Dec 29, 2022
A basic boilerplate template for starting a Flutter GetX project. GetX, Dio, MVVM, get CLI, Localization, Pagination etc are implemented.

Flutter GetX Template (GetX, Dio, MVVM) This Flutter Template using GetX package for State management, routing and Dependency Injection (bindings). We

Hasan Abdullah 214 Jan 9, 2023
Flutterlistpaginationstacked - Pagination in flutter using Stacked Architecture

Pagination in flutter using Stacked Architecture. Link to Readable Tutorial on H

Ademola Babs 0 May 5, 2022
GetX Architecture for large scale project, This project include - pagination, pull to refresh, localization, network call and advance error handling

GetX Architecture for large scale project, This project include - pagination, pull to refresh, localization, network call and advance error handling

Wai Han Ko 5 Nov 29, 2022
This a library to simplify isolate thread communication.

This a library to simplify islate thread communication. It abstracts the data transfer between islate and the main thread into a simple channel, and t

吴ζ₯šθ‘‘ 3 Oct 31, 2022
Another breakpoint framework. Aims to simplify as much as possible building adaptive layouts.

Another breakpoint framework. Aims to simplify as much as possible building adaptive layouts. Features Really simple implementation Works with and wit

null 3 Sep 26, 2022
Data Migrator - provide a universal translator for data by being portable, diverse, and efficient in migrating and converting data across discrete schemas

Data Migrator - provide a universal translator for data by being portable, diverse, and efficient in migrating and converting data across discrete schemas

Tanner Meade 77 Jan 2, 2023
Functioning Doctor/Healthcare Catalog App created using Dart with Flutter. Stores and loads data from Firebase Firestore DB.

flutter_medical Functioning Doctor/Healthcare Catalog & Scheduling App created using Dart with Flutter. Stores and loads data from noSQL Firebase. Ins

John Uberbacher 209 Dec 19, 2022
Nimbostratus is a reactive data-fetching and client-side cache management library built on top of Cloud Firestore.

Nimbostratus ?? Nimbostratus is a reactive data-fetching and client-side cache management library built on top of Cloud Firestore. The Cloud Firestore

Dan Reynolds 13 Dec 15, 2022
House Record manager application, cloud firestore will manage the data

house_record A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if

kyle reginaldo 3 Aug 29, 2022
Dart package for Async Data Loading and Caching. Combine local (DB, cache) and network data simply and safely.

Stock is a dart package for loading data from both remote and local sources. It is inspired by the Store Kotlin library.

xmartlabs 59 Dec 24, 2022
Local data hive - Local data hive for flutter

local_data_hive A new Flutter application. ScreenShot

Mehmet Emre Γ–Z 0 Jan 8, 2022
Codeflow 19 Sep 29, 2022
State Persistence - Persist state across app launches. By default this library store state as a local JSON file called `data.json` in the applications data directory. Maintainer: @slightfoot

State Persistence Persist state across app launches. By default this library store state as a local JSON file called data.json in the applications dat

Flutter Community 70 Sep 28, 2022
Coffee flutter - A coffee app Used Firestore, GetX, flutter hooks, Provider

coffee_flutter A Coffee Flutter project. Used Firestore, GetX, flutter_hooks, Pr

deargo 4 Oct 26, 2022
Full Feature Todos Flutter Mobile app with fireStore integration.

IONICFIREBASEAPP DOWNLOAD TODO APP Marketplace for Mobile app and Backend that developed on leading Enterprise Technologies with as well as with your

Ionicfirebaseapp 138 Nov 4, 2022
Flutter + Firestore --> home io app

homeio A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this i

Hunter Hartline 1 Dec 18, 2021
Flutter web example with Firebase Authentication, Firestore Collection, BloC Pattern

flutter_auth_web Flutter Firebase auth. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

null 1 Feb 26, 2022
[Flutter Library] Flamingo is a firebase firestore model framework library. 🐀

Flamingo Flamingo is a firebase firestore model framework library. https://pub.dev/packages/flamingo ζ—₯本θͺžγƒ‰γ‚­γƒ₯γƒ‘γƒ³γƒˆ Example code See the example directory

shohei 117 Sep 22, 2022