如何使 firestore 列表视图在向上滚动时加载更多文档？

Question

我想用 FirestoreListView() 聊天。在此聊天中，我想在向上滚动而不是向下滚动时加载更多消息。

在我的 Firebase Firestore 集合中，我有文档作为消息。

所以我的问题是：如何让 FirestoreListView() 在我向上滚动时加载更多文档？

有人可以给我答案或替代解决方案以在向上滚动时加载更多文档吗？

提前致谢。

Answer 1

实际上您在这里谈论的内容有一个特定的术语分页，这是制作任何提要时高度可扩展的做法。试试这个，一旦用户到达底部就再次刷新屏幕

Widget _buildBody(FeedState state) {
switch (state.status) {
  case FeedStatus.loading:
    return const Center(child: CircularProgressIndicator());
  default:
    return RefreshIndicator(
      onRefresh: () async {
        context.read<FeedBloc>().add(FeedFetchPosts());
      },
      child: ListView.builder(
        controller: _scrollController,
        itemCount: state.posts.length,
        itemBuilder: (BuildContext context, int index) {
          final post = state.posts[index];
          final likedPostsState = context.watch<LikedPostsCubit>().state;
          final isLiked = likedPostsState.likedPostIds.contains(post!.id);
          final recentlyLiked =
              likedPostsState.recentlyLikedPostIds.contains(post.id);
          return PostView(
            post: post,
            isLiked: isLiked,
            recentlyLiked: recentlyLiked,
            onLike: () {
              if (isLiked) {
                context.read<LikedPostsCubit>().unlikePost(post: post);
              } else {
                context.read<LikedPostsCubit>().likePost(post: post);
              }
            },
          );
        },
      ),
    );
}}

Answer 2

我的解决方案不是在向上滚动时加载更多消息。对我来说，解决方案是使用一个按钮来实现它，该按钮使用 .where() 方法和时间戳从 firebase 加载更多数据：

await FirebaseFirestore.instance
  .collection("chats")
  .doc(documentId)
  .collection("messages")
  .where("timestamp", isLessThan: timestamps[0])
  .orderBy("timestamp", descending: true)
  .limit(20)
  .get()
  .then((value) {...});

现在列表视图首先显示最早的消息。

要解决这个问题请看这个视频：https://www.youtube.com/watch?v=VOV2V0asFaE

希望对您有所帮助！

如何使 firestore 列表视图在向上滚动时加载更多文档？

How to make firestore list view loading more documents when scrolling up?

listview

dart

flutter

google-cloud-firestore