Load More Listview
An Listview with the Load more item and refresh
Getting Started
In the pubspec.yaml
of your flutter project, add the following dependency:
dependencies:
...
loadmore_listview: ^1.0.7
Import it:
import 'package:loadmore_listview/loadmore_listview.dart';
Usage Examples
LoadMoreListView.builder
LoadMoreListView.builder(
//is there more data to load
haveMoreItem: true,
//Trigger the bottom loadMore callback
onLoadMore: () async{
//wait for your api to fetch more items
await Future.delayed(const Duration(seconds: 1));
},
//pull down refresh callback
onRefresh: () async{
//wait for your api to update the list
await Future.delayed(const Duration(seconds: 1));
},
//you can set your loadMore Animation
loadMoreWidget: Container(
margin: const EdgeInsets.all(20.0),
alignment: Alignment.center,
child: const CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation(Colors.blueAccent),
),
),
//ListView
itemCount: 20,
itemBuilder: (context, index) {
return Container(
margin: const EdgeInsets.all(30),
width: double.infinity,
alignment: Alignment.center,
child: Text('$index'),
);
},
);
LoadMoreListView.separated
LoadMoreListView.separated(
//...
separatorBuilder: (context, index) {
return const Divider();
},
);
LoadMoreListView.customScrollView
LoadMoreListView.customScrollView(
//...
slivers: [
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) {
return Container(
margin: const EdgeInsets.all(30),
width: double.infinity,
alignment: Alignment.center,
child: Text(list[index]),
);
},
childCount: list.length,
),
),
],
);