search

Dimibe / grouped_list

A Flutter ListView in which items can be grouped into sections.
https://pub.dev/packages/grouped_list
MIT License
395 stars 106 forks source link

create infinite scroll #119

Open yogaxv opened 3 years ago

yogaxv commented 3 years ago

Is there any example i can apply to create infinite scroll?

Usually I make condition if there still have data left, I added +1 to the listview length also create loading at the end of listview. Then I call fetch function using scroll controller.

How can I applied that method in grouped list?

reihnagm commented 2 years ago

I have an idea, if you are using a provider.

  1. Wrap GroupedListView use NotificationListeners

    NotificationListener( onNotification: (ScrollNotification notification) { if (notification is ScrollEndNotification) { if (notification.metrics.pixels == notification.metrics.maxScrollExtent) { chatProvider.fetchMessages(20); } } return false; }

  2. Fetch data when scroll reach to bottom

    _messages!.insert(0, ChatMessage( uid: "", content: "", senderId: "", senderName: "", receiverId: "", isRead: false, softDelete: false, type: MessageType.unknown, sentTime: DateTime.now(), readers: [], readerCountIds: [] ));

  3. Make a loading when scroll reach to bottom

    indexedItemBuilder: (BuildContext context, ChatMessage message, int i) { if(i == 0 && context.watch().fetchMessageStatus == FetchMessageStatus.loading) { return const Padding( padding: EdgeInsets.all(8.0), child: Center( child: SizedBox( width: 16.0, height: 16.0, child: CircularProgressIndicator( color: ColorResources.loaderBluePrimary, ), ), ), ); }