Scroll end detect to many times in flutter-CodePudding

I uses Listview.builder. it detect scroll end to many time that is why API call to many times and add duplicate Data in Listview.

Code:-

ListView.builder(
                                      controller: _scrollController
                                        ..addListener(() async {
                                          if (_scrollController
                                                          .position.pixels -
                                                      10 ==
                                                  _scrollController.position
                                                          .maxScrollExtent -
                                                      10 &&
                                              !state.isPaginationLoading) {
                                            print("Scroll End TEst Screen");
                                            await ctx
                                                .read<ProfileCubit>()
                                                .getProfiles(
                                                    context, true, null);
                                          }
                                        }),

CodePudding user response：

You can add a condition to check if API call is happening or not and based on it you can you can call the API. You would also need to handle pagination logic if all info is loaded.

CodePudding user response：

Dont put logic code inside build. In your case _scrollController will addListener every times widget build called, cause multiple handle will trigger.

Advice for you is create and put handle logic to a function, put addListener/removeListener in initState/dispose because they was called only once.

With your problem, you can create a variale to check api was called yet and prevent other call.


class AppState extends State<App> {
  var scroll = ScrollController();
  var preventCall = false;

  @override
  initState() {
    scroll.addListener(onScroll);
    super.initState();
  }

  @override
  void dispose() {
    scroll.removeListener(onScroll);
    super.dispose();
  }

  Future yourFuture() async {}

  void onScroll() {
    var position = scroll.position.pixels;
    if (position >= scroll.position.maxScrollExtent - 10) {
      if (!preventCall) {
        yourFuture().then((_) => preventCall = false);
        preventCall = true;
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return ...
  }
}