微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何使用文本字段过滤我的 StreamBuilder 列表?

如何解决如何使用文本字段过滤我的 StreamBuilder 列表?

我正在制作一个关于希腊克里特岛的应用,其中包含岛上的所有景点。 在我的底部导航上,我有一个选项卡,它可以转到一个新屏幕,应用栏中有一个 TextField,在正文中我有我的完整列表(Firestore > Streambuilder > Listviewbuilder)。当我点击其中一项时,它会重定向到详细信息页面

为了更容易搜索,我希望能够在用户开始在文本字段中输入时过滤列表。

我似乎无法理解它,因为我也在使用详细信息页面...这是我目前所拥有的:

StreamBuilder(
                stream: FirebaseFirestore.instance.collection('Crete').orderBy('name',descending: false).snapshots(),builder: (context,snapshot) {
                  if (!snapshot.hasData) return const Center(child: CircularProgressIndicator(),);
                  return Container(
                    child: ListView.builder(
                      shrinkWrap: true,clipBehavior: Clip.none,physics: NeverScrollableScrollPhysics(),scrollDirection: Axis.vertical,itemCount: snapshot.data.docs.length,itemBuilder: (BuildContext context,index) => _buildListItemCrete(context,snapshot.data.docs[index]),),);
                },

然后是 TextField:

TextField(
            onChanged: (String value) {
              setState(() {
                searchResult = value;
              });
            },

还有这个:

TextEditingController _searchController = TextEditingController();

  String searchResult = '';

  @override
  void initState(){
    super.initState();
    _searchController.addListener(_onSearchChanged);
  }

  @override
  void dispose(){
    _searchController.removeListener(_onSearchChanged);
    _searchController.dispose();
    super.dispose();
  }

  _onSearchChanged(){
    print(_searchController.text);
  }

如何通过在文本字段中输入来过滤列表?

解决方法

我终于在 this fantastic tutorial 中找到了解决方案。

诀窍是将流构建器更改为 listview.builder 并从我的快照集合创建一个列表。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。