Implementing pull-to-refresh in Flutter with Riverpod

Viewed 1909

I am new to Riverpod and trying to implement pull to refresh with Riverpod in my Flutter app and can't seem to find any good tutorial online. Has anyone implemented pull-to-refresh in their Flutter app while using Riverpod. I have looked for tutorials everywhere, but most I found was simple network request on app load. Thanks in advance!

using these dependencies for riverpod and network requests. flutter_riverpod: ^0.12.1 dio: ^3.0.10

3 Answers

You can use context.refresh(yourProvider) in your refresh action. Works great.

In Riverpod 1.0.0 and above, you can use ref.refresh(yourProvider)

Turned out the working way of pull-to-refresh the UI using Riverpod (^1.0.0) is this:

Provider:

final yourFutureProvider = FutureProvider<T>(....);

Inside the Build method:

                  return RefreshIndicator(
                    onRefresh: () async {
                      return await ref.refresh(yourFutureProvider);
                    },

THIS WORKED FOR ME

Declare the provider

final sessionsProvider = FutureProvider<List<Session>>((ref) async {
  final sessionServices = ref.read(sessionsServiesProvider);
  return await sessionServices.getSessions();
});

add refresh indicator

RefreshIndicator(
        onRefresh: () async => ref.refresh(sessionsProvider),
        child: ...)

Related