Firebase 颤振细节搜索功能

我目前有一个Flitter应用程序，它在gridview中显示可点击的图像

选择图像后，将进入详细页面，该页面提供有关所选类别的更多信息：

我现在需要构建搜索功能，它将根据类别详细信息进行过滤。 因此，如果我搜索“钓鱼”，gridview会过滤显示“农业”和任何其他包含该词的类别细节

我目前使用Firebase在用户选择类别时返回类别详细信息，因此我假设搜索必须链接到我的Firebase

我试着在网上寻找答案，但没有一个能满足我的具体要求

更新 包含的Gridview页面代码：

class _LevelPageState extends State<LevelPage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.grey,
          title: Text(widget.level.data["region"]),
          centerTitle: true,
        ),
        body: ListView(shrinkWrap: true, children: <Widget>[
          Container(
            child: ListTile(
              title: Text(
                'Current Level ' + widget.level.data["level"].toString(),
                style: TextStyle(
                     color: widget.level.data["level"] == 5
                         ? Colors.red[900]
                         : widget.level.data["level"] == 4
                             ? Colors.orange[900]
                             : widget.level.data["level"] == 3
                                 ? Colors.brown[300]
                                 : widget.level.data["level"] == 2
                                     ? Colors.blue[300]
                                     : widget.level.data["level"] == 1
                                         ? Colors.green[300]
                                         : Colors.black,
                    fontSize: 25,
                    fontWeight: FontWeight.bold),
                textAlign: TextAlign.center,
              ),
            ),
          ),
          Container(
            height: (MediaQuery.of(context).size.height),
            padding: EdgeInsets.all(10),
            child: GridView.count(
              shrinkWrap: true,
              physics: ScrollPhysics(),
              mainAxisSpacing: 40,
              crossAxisSpacing: 20,
              crossAxisCount: 3,
              childAspectRatio: MediaQuery.of(context).size.height / 400,
              children: <Widget>[
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child: Image.asset('assets/images/mediaicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Media',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        },
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Media',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child: Image.asset('assets/images/mobileanditicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Info and Comms',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        },
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Info and Comms',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child: Image.asset('assets/images/utilitiesicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Utilities',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        }, 
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Utilities',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child: Image.asset('assets/images/educationicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Education',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        },
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Education',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child: Image.asset('assets/images/repairsicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Repairs',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        },
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Repairs',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
                ListTile(
                  title: Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        color: Colors.grey,
                      ),
                      child: InkWell(
                        enableFeedback: true,
                        child:
                            Image.asset('assets/images/domestichelpicon.png'),
                        onTap: () => {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (context) => CategoryPage(
                                  text1: 'Domestic Help',
                                  text2: widget.level.data["region"].toString(),
                                  text3:
                                      widget.level.data["level"].toString())))
                        },
                        splashColor: Colors.white,
                        borderRadius: BorderRadius.circular(20),
                      )),
                  subtitle: Text('Domestic Help',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 10,
                      ),
                      textAlign: TextAlign.center),
                ),
              ],
            ),
          ),
        ]));
  }
}

class\u LevelPageState扩展状态{
@凌驾
小部件构建（构建上下文）{
归还新脚手架(
appBar:appBar(
背景颜色：颜色。灰色，
标题：文本（widget.level.data[“region”]），
标题：对，
),
正文：ListView（包覆面提取：真，子项：[
容器(
孩子：ListTile(
标题：正文(
“当前级别”+widget.Level.data[“级别”].toString（），
样式：TextStyle(
颜色：widget.level.data[“level”]==5
？颜色。红色[900]
：widget.level.data[“level”]==4
？颜色。橙色[900]
：widget.level.data[“level”]==3
？颜色。棕色[300]
：widget.level.data[“level”]==2
？颜色。蓝色[300]
：widget.level.data[“level”]==1
？颜色。绿色[300]
：颜色。黑色，
尺寸：25，
fontWeight:fontWeight.bold），
textAlign:textAlign.center，
),
),
),
容器(
高度：（MediaQuery.of（context.size.height），
填充：边缘设置。全部（10），
子项：GridView.count(
收缩膜：对，
物理：物理（），
平均间距：40，
横轴间距：20，
交叉轴计数：3，
childAspectRatio:MediaQuery.of（context）.size.height/400，
儿童：[
列表砖(
标题：集装箱(
装饰：盒子装饰(
边界半径：边界半径。圆形（30），
颜色：颜色。灰色，
),
孩子：InkWell(
启用反馈：正确，
子级：Image.asset（'assets/images/mediacon.png'），
onTap:（）=>{
导航器.of（上下文）.push（MaterialPageRoute(
生成器：（上下文）=>CategoryPage(
text1:'媒体'，
text2:widget.level.data[“region”].toString（），
文本3：
widget.level.data[“level”].toString（））
},
颜色：颜色。白色，
边界半径：边界半径。圆形（20），
)),
字幕：文本（“媒体”，
样式：TextStyle(
颜色：颜色，白色，
尺寸：10，
),
textAlign:textAlign.center），
),
列表砖(
标题：集装箱(
装饰：盒子装饰(
边界半径：边界半径。圆形（30），
颜色：颜色。灰色，
),
孩子：InkWell(
启用反馈：正确，
子项：Image.asset（'assets/images/mobileanditicon.png'），
onTap:（）=>{
导航器.of（上下文）.push（MaterialPageRoute(
生成器：（上下文）=>CategoryPage(
text1:“信息和通信”，
text2:widget.level.data[“region”].toString（），
文本3：
widget.level.data[“level”].toString（））
},
颜色：颜色。白色，
边界半径：边界半径。圆形（20），
)),
字幕：文本（‘信息和通信’，
样式：TextStyle(
颜色：颜色，白色，
尺寸：10，
),
textAlign:textAlign.center），
),
列表砖(
标题：集装箱(
装饰：盒子装饰(
边界半径：边界半径。圆形（30），
颜色：颜色。灰色，
),
孩子：InkWell(
启用反馈：正确，
子级：Image.asset（'assets/images/utilitiesicon.png'），
onTap:（）=>{
导航器.of（上下文）.push（MaterialPageRoute(
生成器：（上下文）=>CategoryPage(
text1:'实用程序'，
text2:widget.level.data[“region”].toString（），
文本3：
widget.level.data[“level”].toString（））
},
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';

class LevelCategoryMap {
  final String title;
  final String level;
  final String region;

  LevelCategoryMap(this.title, this.level, this.region);

  Map<String, dynamic> toMap() {
    return {
      'title': title,
      'level': level,
      'description': region
    };
  }

  @override
  String toString() {
    return 'LevelCategoryMap{level: $level, description: $region';
  }
}

class _LevelPageState extends State<LevelPage> {
  final String categorySearched = "fishing";
  String level = 1;

  @override
  Widget build(BuildContext context) {
    final dbCollectionSnapshot = Firestore
        .instance
        .collection("Level$level")
        .where('desc', )
        .snapshots(); // retrieve

    return StreamBuilder<QuerySnapshot>(
        stream: dbCollectionSnapshot,
        builder: (context, snapshot) {
          List<LevelCategoryMap> levelCategory;
          if (!snapshot.hasData || snapshot.data == null) return CircularProgressIndicator();
            snapshot.data.documents.forEach((element) {
              levelCategory.add(LevelCategoryMap(element.documentID, level, element.data['desc']));
            })
            final int resultsLen = levelCategory.length;
            return new Scaffold(
                appBar: AppBar(
                  backgroundColor: Colors.grey,
                  title: Text(widget.level.data["region"]),
                  centerTitle: true,
                ),
                body: ListView(shrinkWrap: true, children: <Widget>[
                  Container(
                    child: ListTile(
                      title: Text(
                        'Current Level ' + widget.level.data["level"].toString(),
                        style: TextStyle(
                            color: widget.level.data["level"] == 5
                                ? Colors.red[900]
                                : widget.level.data["level"] == 4
                                ? Colors.orange[900]
                                : widget.level.data["level"] == 3
                                ? Colors.brown[300]
                                : widget.level.data["level"] == 2
                                ? Colors.blue[300]
                                : widget.level.data["level"] == 1
                                ? Colors.green[300]
                                : Colors.black,
                            fontSize: 25,
                            fontWeight: FontWeight.bold),
                        textAlign: TextAlign.center,
                      ),
                    ),
                  ),

                  Center(
                      child: GridView.builder(
                          itemCount: resultsLen,
                          gridDelegate:
                          SliverGridDelegateWithFixedCrossAxisCount(
                              crossAxisCount: 2),
                          itemBuilder: (context, index) {
                            final String description = levelCategory[index].region;
                            if (description.contains(categorySearched))
                              return myGridItem(context, index, levelCategory[index]);
                            //: ClassifiedThumbnail(connection, capitalize(widget.city), snapshot.data[index]);
                          })),
                ]));
          }

          else
            return CircularProgressIndicator();

        });
  }
}


Widget myGridItem(context, index, LevelCategoryMap myLevelCategory) {
  Map<String, String> imageMap = {'Education': 'educationicon', 'Business': 'businessicon'}; // etc.

  return ListTile(
    title: Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(30),
          color: Colors.grey,
        ),
        child: InkWell(
          enableFeedback: true,
          child: Image.asset('assets/images/' + imageMap[myLevelCategory.title]  + '.png'),
          onTap: () => {
            Navigator.of(context).push(MaterialPageRoute(
                builder: (context) => CategoryPage(
                    text1: myLevelCategory.title, // I assume level is the name with education
                    text2: myLevelCategory.region,
                    text3: myLevelCategory.level)))
          },
          splashColor: Colors.white,
          borderRadius: BorderRadius.circular(20),
        )),
    subtitle: Text(myLevelCategory.title,
        style: TextStyle(
          color: Colors.white,
          fontSize: 10,
        ),
        textAlign: TextAlign.center),
  );