Home > Mobile >  custom_refresh_indicator package, programmatically trigger refresh
custom_refresh_indicator package, programmatically trigger refresh

Time:08-16

I'm using a package in my app, custom_refresh_indicator. It allows you to add scroll-to-refresh functionality to your app. However, I'd like to be able to press a button, and trigger the refresh programmatically, instead of via a user scrolling down from the top. Is this possible?

My current code looks like so (inside body of Scaffold):

CustomRefreshIndicator(
        onRefresh: () async { <--- I WANT TO TRIGGER THIS PROGRAMMATICALLY
          await Future.delayed(const Duration(milliseconds: 400));
        },
        builder: (BuildContext context, Widget child,
            IndicatorController controller) {
          return AnimatedBuilder(
            animation: controller,
            builder: (BuildContext context, _) {
              return Stack(
                clipBehavior: Clip.hardEdge,
                children: <Widget>[
                  AnimatedBuilder(
                    animation: controller,
                    builder: (BuildContext context, _) {
                      return Container(
                        color: Colors.white,
                        width: double.infinity,
                        height: controller.value * 80,
                        child: const FittedBox(
                          alignment: Alignment.center,
                          fit: BoxFit.scaleDown,
                          child: Padding(
                            padding: EdgeInsets.symmetric(vertical: 8),
                            child: CupertinoActivityIndicator(
                              radius: 12,
                              color: Colors.black,
                            ),
                          ),
                        ),
                      );
                    },
                  ),
                  Transform.translate(
                    offset: Offset(0, controller.value * 80),
                    child: child,
                  ),
                ],
              );
            },
          );
        },
        child: ScrollablePositionedList.builder(
          physics: const ClampingScrollPhysics(
            parent: AlwaysScrollableScrollPhysics(),
          ),
          itemCount: posts.length   1,
          itemBuilder: (context, index) {
            if (index == 0) {
              return Container(
                height: 200,
                color: Colors.green,
                child: const Center(
                  child: Text('post content'),
                ),
              );
            } else if (posts[index - 1].isRoot) {
              return Container(
                padding: const EdgeInsets.symmetric(vertical: 15),
                margin: const EdgeInsets.symmetric(vertical: 5),
                color: Colors.redAccent,
                child: Text('ROOT COMMENT, index: ${index - 1}'),
              );
            } else {
              return Container(
                padding: const EdgeInsets.symmetric(vertical: 15),
                margin: const EdgeInsets.symmetric(vertical: 5),
                color: Colors.lightBlueAccent,
                child: Text('Threaded comment, index: ${index - 1}'),
              );
            }
          },
          itemScrollController: itemScrollController,
          itemPositionsListener: itemPositionsListener,
        ),
      ),

CodePudding user response:

Create a future method and include on onRefresh like

 Future<void> onRefresh() async{}
CustomRefreshIndicator(
  onRefresh: onRefresh,
  builder: (context, child, controller) {

And when you like to recall inside any method/button pressed do

await onRefresh();

CodePudding user response:

@David Sedlar's comment led me to a quick answer:

I referred to the docs for the Flutter RefreshIndicator:

https://api.flutter.dev/flutter/material/RefreshIndicator-class.html

Then did what they did in their example by creating a Global key, setting that key value as the key property in the CustomRefreshIndicator and then calling show() from the CustomRefreshindicator's state via the key.

  • Related