Flutter Scrollcontroller maxScrollExtent doesn't go till the end of list

Question

it stops before last element in list. Is there a way to go till the end container of the last element

        controller
          ..animateTo(
            controller.position.maxScrollExtent,
            curve: Curves.easeIn,
            duration: const Duration(milliseconds: 300),
          );
      });```

may be helpful https://stackoverflow.com/questions/57645089/flutter-listview-get-full-size-of-scrollcontroller-after-adding-item-to-list/57645944#57645944 — Spatz, Dec 12 '19 at 16:12
Experiencing same issue: If scrolling animation is performed from addPostFrameCallback sometimes the ListView isn't scrolled exactly to the bottom. The following sometimes doesn't scroll fully a list to the end: `SchedulerBinding.instance.addPostFrameCallback ((_) { _scrollController.animateTo (_scrollController.position.maxScrollExtent, duration: const Duration (milliseconds: chatTimeForScrollingAnimation), curve: Curves.easeOut); });` But if we add some time delay before animation/jump call (as proposed by @LIONELVSV) the issue is gone. — hellobody, Oct 30 '20 at 13:01

score 7 · Accepted Answer · answered Dec 12 '19 at 16:56

7

Using Without Animation Solved the Problem

Timer(Duration(milliseconds: 500), () {
        controller.jumpTo(controller.position.maxScrollExtent);
      });

answered Dec 12 '19 at 16:56

LIONEL VSV

471
6
12

1

Also works with 'animateTo'. The time delay itself solves this problem which seems to be a bug in Flutter. – hellobody Oct 30 '20 at 13:10

score 4 · Answer 2 · answered Mar 04 '22 at 13:27

In my case the problem was that the elements were not equal in size and the size was not known until rendered. So, the ListView scrolled to its initial estimated maxScrollExtent but while scrolling the elements were rendered and the new maxScrollExtent was bigger. I hacked it by giving it a much bigger value initially:

attachmentsScrollController.animateTo(
  attachmentsScrollController.position.maxScrollExtent * 2,
  duration: Duration(milliseconds: 300),
  curve: Curves.easeInOut);

score 1 · Answer 3 · answered Jan 28 '22 at 14:41

I think this is the best function to scroll to bottom with a good animation

scrollToBottom() {
if (_chatController.hasClients) {
      Future.delayed(const Duration(milliseconds: 500)).then((value) {
        _chatController.animateTo(
          _chatController.position.maxScrollExtent,
          duration: const Duration(milliseconds: 200),
          curve: Curves.fastOutSlowIn,
        );
      });
    }
}

score 1 · Answer 4 · answered Feb 02 '22 at 01:33

I had same problem with CustomeScrollView widget, and I solved with this.

CustomScrollView(
                  controller: Get.find<ChatController>(tag: 'chatDetail')
                      .scrollController
                      .value,
                  reverse: true,
                  keyboardDismissBehavior:
                      ScrollViewKeyboardDismissBehavior.onDrag,
                  physics: ClampingScrollPhysics(),
                  cacheExtent: 99999, // <-- here !!! ADD THIS CODE
                  slivers: [
                    ChatList(
                      isQuestion: isQuestion,
                      postCreatedAt: postCreatedAt,
                      title: title,
                    ),
                  ],
                ),

my scroll function was normal as we talked before.

 void chatScrollUp() async {
await scrollController.value.animateTo(
    scrollController.value.position.maxScrollExtent,
    duration: Duration(
        milliseconds:
            (scrollController.value.position.maxScrollExtent / 2).round()),
    curve: Curves.easeOutCirc);}

score 0 · Answer 5 · answered Jan 11 '22 at 10:57

What worked with me is this:

 void scrollAnimateToEnd(ScrollController controller) {
Future.delayed(const Duration(milliseconds: 400)).then((_) {
  try {
    controller
        .animateTo(
      controller.position.maxScrollExtent,
      duration: const Duration(seconds: 1),
      curve: Curves.fastOutSlowIn,
    )
        .then((value) {
      controller.animateTo(
        controller.position.maxScrollExtent,
        duration: const Duration(milliseconds: 200),
        curve: Curves.easeInOut,
      );
    });
  } catch (e) {
    print('error on scroll $e');
  }
});

}

Juarez Schulz · Answer 6 · 2023-05-04T04:52:38.030

-1

I solved this issue by using SingleChildScrollView instead of ListView.

edited May 04 '23 at 04:52

answered May 04 '23 at 00:57

Juarez Schulz

124
1
6

Flutter Scrollcontroller maxScrollExtent doesn't go till the end of list

6 Answers6