Flutter - ListView 可以包含静态小部件和流吗

Posted 2023-02-23

【中文标题】Flutter - ListView 可以包含静态小部件和流吗

【英文标题】：Flutter - Can a ListView contain a static widget and a stream

【发布时间】：2019-03-12 04:10:39

【问题描述】：

目前我有一个由 StreamBuilder 扭曲的 ListView，它从 firebase firestore 获取数据（例如用户列表）。看起来是这样的：

Widget UsersList = new StreamBuilder(
  stream: Firestore.instance
    .collection('users')
    .snapshots(),
  builder: (context, snapshot) 
    if (!snapshot.hasData) return const Text("loading");
    return new ListView.builder(
      itemCount: snapshot.data.documents.length,
      itemBuilder: (context, index) =>
        _buildItem(context, snapshot.data.documents[index]),
    );
  
);

问题是如何在 ListView 的顶部添加一个静态小部件（例如创建新用户的按钮），我不希望按钮一直停留在页面顶部，它应该使用 ListView 滚动。

一种解决方法：在 _buildItem() 函数中，如果它是第一个文档（通过传递给函数 index==0），我可以接收一个布尔值，如果为 true，则首先构建静态小部件（例如添加用户按钮） .但我能想到三个问题：

如果 firestore 集合中没有任何文档，则不会呈现静态小部件。 如果 Internet 连接速度较慢，则在下载第一个文档之前，它不会呈现静态小部件。 这是一种解决方法...

【参考方案1】：

您可以检查ListView.builder 中的长度并始终为按钮添加一个项目。

Widget UsersList = new StreamBuilder(
  stream: Firestore.instance.collection('users').snapshots(),
  builder: (context, snapshot) 
    return new ListView.builder(
      itemCount: (snapshot?.data?.documents?.length ?? 0) + 1,
      itemBuilder: (context, index) 
        if (index == 0)
          return FlatButton(child: Text("Add"));
        else
          _buildItem(context, snapshot.data.documents[index-1]);
      ,
    );
  ,
),