lazy_loading_list_view 0.0.7
lazy_loading_list_view: ^0.0.7 copied to clipboard
A package for creating a ListView that handles lazy loading, pagination, pull-to-refresh, and a custom empty state.
A package for creating a ListView that handles lazy loading, pagination, pull-to-refresh, and a custom empty state.
![]() |
![]() |
Features #
Add this to your Flutter app to:
- Create all ListView's throughout your project using a single reusable widget.
- Handle pagination within ListView's by simply calling a function to load more data.
- Provides a default loading state when fetching more data. User can override this by providing there own loadingStateBuilder.
- Provides a default empty state when no data is returned. User can override this by providing there own emptyState Widget.
- Automatically handles pull-to-refresh functionality.
Usage #
Install the LazyLoadingListView package by adding the following to your project dependencies within the pubspec.yaml file:
lazy_loading_list_view: ^0.0.7
Add the following to the top of your file:
import 'package:lazy_loading_list_view/lazy_loading_list_view.dart';
Create a LazyLoadingListView using the example below:
LazyLoadingListView<MyData>(
loadItems: (int page) async {
// your function to load data for the given page
return await getData(page: page);
},
buildItem: (BuildContext context, MyData item, int index) {
// your function to build list item
return MyCustomListItem(item: item);
},
)
You can also customize the LazyLoadingListView further by overriding the separatorBuilder, loadingStateBuilder, emptyState, pageSize and refresh indicator color:
LazyLoadingListView<MyData>(
loadItems: (int page) async {
// your function to load data for the given page
return await getData(page: page);
},
buildItem: (BuildContext context, MyData item, int index) {
// your function to build list item
return MyCustomListItem(item: item);
},
separatorBuilder: (context, index) {
// define your own separator
return const SizedBox(height: 10);
},
loadingStateBuilder: (context) {
// your function to build a custom loading state
return const MyCustomLoadingState();
},
// provide your custom empty state widget
emptyState: MyEmptyState(),
// define your preferred page size
pageSize: 10,
// define your preferred refresh indicator color
refreshColor: Colors.deepPurple,
)
You can also access all the normal properties that a ListView has such as physics, padding, etc:
LazyLoadingListView<MyData>(
loadItems: (int page) async {
// your function to load data for the given page
return await getData(page: page);
},
buildItem: (BuildContext context, MyData item, int index) {
// your function to build list item
return MyCustomListItem(item: item);
},
separatorBuilder: (context, index) {
// define your own separator
return const SizedBox(height: 10);
},
loadingStateBuilder: (context) {
// your function to build a custom loading state
return const MyCustomLoadingState();
},
// provide your custom empty state widget
emptyState: MyEmptyState(),
// define your preferred page size
pageSize: 10,
// define your preferred refresh indicator color
refreshColor: Colors.deepPurple,
// provide your own scroll controller
scrollController: ScrollController(),
// provide your own scroll direction
scrollDirection: Axis.horizontal,
// provide your own reverse
reverse: false,
// provide your own physics
physics: const BouncingScrollPhysics(),
// provide your own shrinkWrap
shrinkWrap: true,
// define your own custom padding
padding: const EdgeInsets.all(12),
)
Bugs or Feature Requests #
If you encounter any problems feel free to open an issue.
If you feel the library is missing a feature that would be helpful, please raise a ticket on GitHub and we will look into it.
Additional information #
This package was created by Caffeinated Code Ltd. If you find this package useful, you can support it for free by giving it a thumbs up at the top of this page. Here's another option to support the package: