Flutter - ListView.builder: Initial scroll position

南楼画角 提交于 2020-05-29 17:13:02

问题


I want to setup the initial scroll position of a ListView.builder, I want the list to start at the bottom 0.0

If I setup reverse on the listView of course I get the initial scroll position to be the desired one, but what I need is to have the last children on the bottom, is a chat app.

This is the list builder, MessageItem() is the chat message

ListView.builder(
                    shrinkWrap: true,
                    controller: _scrollController,
                    itemCount: snapshot.data.documents.length,
                    padding: EdgeInsets.all(10.0),
                    itemBuilder: (BuildContext context, int index) =>
                        MessageItem(
                            index: index,
                            document: snapshot.data.documents[index],
                            myId: myId));

This is the animation I have when someone send the message


_scrollController.animateTo(
                _scrollController.position.maxScrollExtent,
                duration: const Duration(milliseconds: 500),
                curve: Curves.easeOut);

the animation works okay.


What I want is the list scroll position to be already at the bottom when the user enters the chat room.


回答1:


You can set one of ScrollController's property: initialScrollOffset

But on the condition that you know the offset position of the target item/index.

ScrollController _controller = ScrollController(initialScrollOffset: itemHeight * index)

(note that this example assumes that the sizes of your list's widgets are of constant size, but if you don't have constant widget sizes in your list, then you must be able to calculate the final offset position of your target item - and that is a whole other issue)

Or, if you want it to always be the last item/index, then it's much easier:

ScrollController _controller = ScrollController(initialScrollOffset: _controller.position.maxScrollExtent)



回答2:


The solution for me was:

SingleChildScrollView(
                reverse: true,
                child: Container(),
              ),

ListView has also reverse property.



来源:https://stackoverflow.com/questions/57504040/flutter-listview-builder-initial-scroll-position

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!