在Flutter中保持滚动视图偏移的同时添加列表视图项

Question

我正在寻找一种将新项目插入列表视图的方法，同时保持用户的滚动偏移量。基本上像拉动刷新后的Twitter提要：将新项目添加到顶部，同时保持滚动位置。然后，用户可以向上滚动以查看新添加的项目。

如果我只是在开始时用几个新项重建列表/滚动小部件，则它当然会跳转，因为滚动视图内容的高度增加了。不能估计这些新项目的高度来纠正跳跃，因为新项目的内容是可变的。即使在提供索引以在任意位置动态插入项目的AnimatedList小部件，在插入索引0时也会跳转。

关于如何解决这个问题的任何想法？也许使用Offstage小部件预先计算新物品的高度？

Answer 1

最近遇到了这个问题：我有一个聊天滚动条，它根据滚动条的方向异步加载上一条或下一条消息。这个解决方案对我有用。
解决思路如下。您创建了两个 SliverList 并将它们放在 CustomScrollView 中。

CustomScrollView(
  center: centerKey,
  slivers: <Widget>[
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (BuildContext context, int index) {
            return Container(
              // Here we render elements from the upper group
              child: top[index]
            )
        }
    ),
    SliverList(
      // Key parameter makes this list grow bottom
      key: centerKey,
      delegate: SliverChildBuilderDelegate(
        (BuildContext context, int index) {
            return Container(
              // Here we render elements from the bottom group
              child: bottom[index]
            )
        }
    ),
)

第一个列表向上滚动，而第二个列表向下滚动。它们的偏移零点固定在同一点上，永不移动。如果您需要预先添加一个项目，则将其推送到顶部列表，否则，将其推送到底部列表。这样他们的偏移量就不会改变，你的滚动视图也不会跳转。
您可以在以下dartpad 示例中找到解决方案原型。

Answer 2

我认为反向+lazyLoading会对你有所帮助。

反转列表：

ListView.builder(reverse: true, ...);

对于lazyLoading请参考这里。