如何在Flutter的CustomScrollView中使用带无限滚动的FirestoreListView？

直接使用FirestoreListView无法适配CustomScrollView的原因是它属于普通滚动组件（继承自ListView），自带滚动逻辑，和CustomScrollView的sliver滚动体系冲突。正确的做法是使用firebase_ui_firestore提供的**FirestoreSliverListView**——这是专门为sliver滚动场景设计的组件。

具体实现代码 #

CustomScrollView(
  slivers: [
    // 这里可以添加你需要的顶部组件，比如SliverAppBar或其他sliver组件
    SliverAppBar(
      title: const Text('房源列表'),
      floating: true,
    ),
    // 用FirestoreSliverListView替代原来的FirestoreListView
    FirestoreSliverListView(
      key: UniqueKey(),
      pageSize: 10,
      loadingBuilder: (context) => const Loading(),
      query: FirebaseFirestore.instance
          .collection('houses')
          .orderBy('datecreation', descending: true),
      itemBuilder: (context, snapshot) {
        return MyTile(
          myHouse: House(id: snapshot.id),
        );
      },
    ),
  ],
)

关键说明 #

• FirestoreSliverListView的API和FirestoreListView几乎完全一致，只是它是sliver类型，可以直接放入CustomScrollView的slivers数组中。
• 顶部需要添加的非sliver组件，可以用SliverToBoxAdapter包裹后放入slivers数组，比如：

  SliverToBoxAdapter(
    child: Padding(
      padding: const EdgeInsets.all(16.0),
      child: Text('这是顶部的自定义组件'),
    ),
  ),
  

内容的提问来源于stack exchange，提问作者Ethan_Dev