我有一个程序,可以从 Firebase 的云 Firestore 获取用户列表,并使用 Flutter 中的 StreamBuilder 将它们显示在 ListView 中。用户数量会很大,我想在我的流构建器中实现一个搜索字段,它将查询与我的搜索字段匹配的结果。我希望它看起来像这样:
--照片来源:https://blog.usejournal.com/flutter-search-in-listview-1ffa40956685
我的 Streambuilder 如下所示:
StreamBuilder<QuerySnapshot>(
stream: Firestore.instance
.collection('users')
.snapshots(),
builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (snapshot.hasError) return new Text('Error: ${snapshot.error}');
switch (snapshot.connectionState) {
case ConnectionState.waiting:
return Center(
child: Column(
children: <Widget>[
CircularProgressIndicator(),
Text('Loading'),
],
),
);
default:
return Container(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
ListView.separated(
shrinkWrap: true,
padding: EdgeInsets.all(10.0),
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
return buildUserRow(snapshot.data.documents[index]);
},
separatorBuilder: (context, index) {
return Divider();
},
),
],
),
);
}
})
所以我想使用这个 StreamBuilder 作为我的数据源,并通过文档快照的 'name'
属性进行搜索。非常感谢任何帮助。
最佳答案
使用 Firestore 实际上变得很容易
在字符串字段上添加 if 条件。如果包含搜索字符串,则返回小部件。
这不是最终代码,您必须进行许多更改。但这就是可以做到的。
ListView.separated(
shrinkWrap: true,
padding: EdgeInsets.all(10.0),
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
if (snapshot.data.documents[index].contains(youSearchString))
return buildUserRow(snapshot.data.documents[index]);
},
separatorBuilder: (context, index) {
return Divider();
})
关于firebase - 将 SearchField 添加到从 Firestore 读取的 StreamBuilder,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57829119/