Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/xsahil03x/super_paging
Add pagination or load more or infinite scrolling functionality to your flutter list view with ease.
https://github.com/xsahil03x/super_paging
bi-directional endless-scroll endless-scrolling endless-scrolling-flutter flutter infinite-scroll infinite-scrolling load-more load-more-flutter pagination paging-library paging-library-in-android paging2 paging3
Last synced: 1 day ago
JSON representation
Add pagination or load more or infinite scrolling functionality to your flutter list view with ease.
- Host: GitHub
- URL: https://github.com/xsahil03x/super_paging
- Owner: xsahil03x
- License: mit
- Created: 2023-07-14T08:37:34.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-09-26T10:16:51.000Z (3 months ago)
- Last Synced: 2024-10-09T13:11:20.178Z (2 months ago)
- Topics: bi-directional, endless-scroll, endless-scrolling, endless-scrolling-flutter, flutter, infinite-scroll, infinite-scrolling, load-more, load-more-flutter, pagination, paging-library, paging-library-in-android, paging2, paging3
- Language: Dart
- Homepage: https://pub.dev/packages/super_paging
- Size: 12.2 MB
- Stars: 32
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Super Paging
[](https://opensource.org/licenses/MIT)
[](https://github.com/xsahil03x/multi_trigger_autocomplete/blob/master/LICENSE)
[](https://github.com/xsahil03x/super_paging/actions)
[](https://pub.dartlang.org/packages/super_paging)
Simplify Flutter pagination with Super Paging — A super package providing efficient data management, in-memory caching,
configurable widgets and built-in error handling for a seamless pagination experience.
Live Demo: https://xsahil03x.github.io/super_paging
**Show some ❤️ and star the repo to support the project**
## Features
- **In-memory Caching**: Intelligently caches frequently accessed data, minimizing network requests and significantly
improving performance.
- **Configurable Widgets**: Customize the look and feel of your pagination with a variety of built-in widgets,
like `PagingListView` and `BidirectionalPagingListView`.
- **Error Handling**: Gracefully handles potential errors during data loading and retrieval, ensuring a smooth user
experience even in unexpected situations.
- **Flexible Configuration**: Tailor Pager's behavior to your specific needs by adjusting parameters like initial
keys, page sizes, and caching strategies.
- **Extensive Documentation**: Clear and comprehensive documentation, making it easy for developers of all levels to
understand and implement effectively.
## Installation
Add the following to your `pubspec.yaml` and replace `[version]` with the latest version:
```yaml
dependencies:
super_paging: ^[version]
```
## Usage
To get started, import the package:
```dart
import 'package:super_paging/super_paging.dart';
```
Create a `PagingSource`:
```dart
class RickAndMortySource extends PagingSource {
final RickAndMortyApi api;
RickAndMortySource({required this.api});
@override
Future> load(LoadParams params) async {
try {
final characters = await api.getCharacters(page: key);
return LoadResult.page(nextKey: key + 1, items: characters);
} catch (e) {
return LoadResult.error(e);
}
}
}
```
Create a `Pager` Instance:
```dart
final pager = Pager(
initialKey: 1,
config: const PagingConfig(pageSize: 20, initialLoadSize: 60),
pagingSourceFactory: () => RickAndMortySource(api: RickAndMortyApi()),
);
```
Integrate with UI:
```dart
PagingListView(
pager: pager,
itemBuilder: (BuildContext context, int index) {
final item = pager.items.elementAt(index);
return ListTile(
title: Text(item.name),
subtitle: Text(item.species),
trailing: Text('# ${item.id}'),
leading: CircleAvatar(backgroundImage: NetworkImage(item.image)),
);
},
emptyBuilder: (BuildContext context) {
return const Center(
child: Text('No characters found'),
);
},
errorBuilder: (BuildContext context, Object? error) {
return Center(child: Text('$error'));
},
loadingBuilder: (BuildContext context) {
return const Center(
child: CircularProgressIndicator.adaptive(),
);
},
);
```
Handle Refresh and Retry:
```dart
// Refresh the data
await pager.refresh();
// Retry failed loads
await pager.retry();
```
Dispose Resources:
```dart
@override
void dispose() {
pager.dispose();
super.dispose();
}
```
## Customization
### Pager
```dart
Pager(
// Defines the initial key to use for the first load.
//
// By default, the initial key is null.
initialKey: null,
// Configuration for pagination behavior.
config: PagingConfig(
// Defines the number of items to load in a single page.
pageSize: 20,
// Defines the number of items to load in the first page.
//
// By default, the initial load size is 3 times the page size.
initialLoadSize: 60,
// Defines how far from the edge of loaded content an access
// must be to trigger further loading.
//
// By default, the pager will start loading when the user scrolls
// within 3 items of the end of the loaded content.
//
// If set to null, the pager will not start loading more content until
// they are specifically requested by the user.
prefetchIndex: 3,
// @Experimental
//
// Defines the maximum number of items to keep in memory before
// pages should be dropped.
//
// If set to null (Default), pages will never be dropped.
maxSize: null,
),
// Defines the initial state to use for the first load.
//
// By default, [PagingState.initial()] state is used.
initialState: PagingState.initial(),
// Defines the source from which to load the paginated data.
pagingSourceFactory: () => MyPagingSource(),
);
```
### PagingListView
```dart
PagingListView(
// Defines the pager to use for loading data.
pager: myPager,
// Defines the builder that is called to build items in the ListView.
//
// The builder is called once for each item in the list.
itemBuilder: (context, index) {
final item = myPager.valueList.elementAt(index);
return ListTile(
title: Text(item),
);
},
// Defines the builder that is called to build the empty state of the list.
emptyBuilder: (context) {
return const Center(
child: Text('No items found'),
);
},
// Defines the builder that is called to build the error state of the list.
//
// [error] is the error that caused the state to be built.
errorBuilder: (context, error) {
return Center(child: Text('Error: $error'));
},
// Defines the builder that is called to build the loading state of the list.
loadingBuilder: (context) {
return const Center(
child: CircularProgressIndicator.adaptive(),
);
},
// Defines the builder that is called to build the prepend state of the list.
//
// [state] is the current state of the pager and [pager] is the pager instance.
//
// Optional. If not provided, the list will show the default prepend loading state.
prependStateBuilder: (context, state, pager) {
// Return a widget based on the state. For example, a button to load the previous page.
// Use the [pager] instance to call [pager.load()] or [pager.retry] based on the state.
},
// Defines the builder that is called to build the append state of the list.
//
// [state] is the current state of the pager and [pager] is the pager instance.
//
// Optional. If not provided, the list will show the default append loading state.
appendStateBuilder: (context, state, pager) {
// Return a widget based on the state. For example, a button to load the next page.
// Use the [pager] instance to call [pager.load()] or [pager.retry] based on the state.
},
);
```
## License
[MIT License](LICENSE)