flutter - 如何在前面插入项目时保持 ScrollPosition？

Question

我想要什么

我想创建一个类似 Twitter App 的行为。所以我滚动到我的列表的顶部，我使用 CupertinoSliverRefreshControl 加载新帖子，并希望将它们放在我当前显示的列表的顶部，同时保持我的 ScrollPosition。

我的代码是什么样的

要使用 CupertinoSliverRefreshControl，我需要在 CustomScrollView 中使用 slivers。 onRefresh 我加载新帖子并将旧帖子添加到其中:

final _scrollController = ScrollController(keepScrollOffset: true);


return CustomScrollView(
  controller: _scrollController
  physics: const BouncingScrollPhysics(parent: AlwaysScrollableScrollPhysics()),
  slivers: <Widget>[
    CupertinoSliverRefreshControl(
      onRefresh: () {
        // loading new posts. I set state with blocBuilder but for easiness I show it with setState here:
        setState(() { posts = List.from(newPosts..addAll(posts)); })
      }
    ),
    SliverList(
      delegate: SliverChildBuilderDelegate((context, index) {
        return PostCard(posts[index]);
      },
      childCount: posts.length)
    )
  ]
);

我的问题是什么

用 ScrollController 保存 ScrollPosition 不起作用，因为它总是将偏移量保存到顶部而不是底部。在我的例子中，到顶部的偏移量将随着加载新帖子而改变。

我尝试过的

我还尝试在两个不同的 SliverLists 中构建旧帖子和新帖子。对于包含旧帖子的 SliverList，我添加了一个键并将我的 CustomScrollView 的 center 设置为此键。这样做会使我的 CupertinoSliverRefreshControl 崩溃。

此外，我不能只使用颠倒的列表，因为我想在进一步的开发状态下加载到另一个方向。

Answer 1

您可以使用 ScrollController.position为此:

// You will need to place the following code snippets in appropriate locations.
double extentAfter;

// Save the current offset from the bottom:
extentAfter = _scrollController.position.extentAfter;


// After your loading is done, you can apply the saved extentAfter:
_scrollController.jumpTo(_scrollController.position.maxScrollExtent - extentAfter);

我不完全知道你的设置是如何工作的，但我可以想象保存 extentAfter 可以在你的 ScrollController 的监听器中完成(因为你想要插入新项目之前的最新 extentAfter)并在重建 ScrollView 时跳转到"new"位置。

在通过提供新的 ScrollController 重建时，您不能调用 jumpTo:

// Update your scroll controller with the new position.
_scrollController = ScrollController(
  initialScrollOffset: _scrollController.position.maxScrollExtent - extentAfter
);