flutter_stream_paging 1.0.18 copy "flutter_stream_paging: ^1.0.18" to clipboard
flutter_stream_paging: ^1.0.18 copied to clipboard

Support paging using stream & datasource

Flutter Stream Paging #

Pub Package
style: effective dart MIT License


A Flutter package that supports pagination(load infinite) for ListView, GridView

Demo #

Example Project Example Project

DataSource #

To create a PagingListView or PagingGridView you will need create class which extended from DataSource.

When extended from DataSource, you will need override 2 methods is loadInitial and loadPageAfter.

Output of those function is a Tuple2 with item1 is List

Example: if your list start with page index is 0. -> on loadInitial output is Tuple2([...], 1) 1 is next page when load more item.

Example:

class ListViewDataSource extends DataSource<int, Note> {
  NoteRepository noteRepository;

  ListViewDataSource(this.noteRepository);

  @override
  FutureOr<Tuple2<List<Note>, int>> loadInitial(int pageSize) async {
    return Tuple2(await noteRepository.getNotes(0), 1);
  }

  @override
  FutureOr<Tuple2<List<Note>, int>> loadPageAfter(int params, int pageSize) async {
    if (params == 4) {
      return Tuple2([], params + 1);
    } else {
      return Tuple2(await noteRepository.getNotes(params), params + 1);
    }
  }
}

Display on UI #

To display on UI, currently you can use PagingListView or PagingGridView.

Example:

      ListViewDataSource dataSource = ListViewDataSource(NoteRepository());

      PagingListView<int, Note>.separated(
      key: key,
      builderDelegate: PagedChildBuilderDelegate<Note>(itemBuilder: (context, data, child) {
        return NoteWidget(data);
      },),
      pageDataSource: dataSource,
      separatorBuilder: (_, index) => const SizedBox(height: 20,),
    ),