Flutter-ListView.builder:初始滚动位置 [英] Flutter - ListView.builder: Initial scroll position

问题描述

我想设置ListView.builder的初始滚动位置，我希望列表从底部0.0

开始

如果我在listView上设置reverse，我当然会将初始滚动位置设为所需的滚动位置，但是我需要的是让最后一个孩子位于底部，这是一个聊天应用程序.

这是列表生成器，MessageItem()是聊天消息

 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));

 

这是当某人send消息

时我所拥有的动画

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

动画工作正常.

---

我想要的是当用户进入聊天室时列表滚动位置已经在底部.

解决方案

您可以设置 initialScrollOffset

但是在您知道目标项目/索引的偏移位置的情况下.

ScrollController _controller = ScrollController(initialScrollOffset: itemHeight * index)

(请注意，此示例假定列表的窗口小部件的大小是恒定大小，但是如果列表中没有恒定的窗口小部件大小，那么您必须能够计算的最终偏移位置您的目标商品-这是另外一个问题)

或者，如果您希望它始终是最后一项/索引，那么它会容易得多:

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

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.

解决方案

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)

这篇关于Flutter-ListView.builder:初始滚动位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！