我如何在颤动的扩展图块中搜索和显示

时间:2019-08-31 06:21:59

标签: search flutter autocomplete flutter-layout

我想使用此文本框搜索数据。这是到目前为止我已经尝试过的一些代码,但是我不知道如何搜索复选框列表数据。我真正想要的是,当我在此搜索中键入某些内容时,它将在此UI中呈现所有服务。希望你能理解。您的帮助将不胜感激。

In this images output of what I've tried

class _MyHomePageState extends State<MyHomePage> {
  var lovCountryServices = [
    {
      "services": [

        {
          "service_group_id": 19,
          "service_category": "B",
          "name": "Hindu Temples",
          "id": 194
        }
      ],
      "name": "Religious",
      "is_active": true,
      "id": 19
    },
    {
      "services": [
        {
          "service_group_id": 19,
          "service_category": "B",
          "name": "Food",
          "id": 194
        }
      ],
      "name": "Catering",
      "is_active": true,
      "id": 19
    }
  ];

  @override
  void initState() {
    super.initState();
  }

  Map<String, bool> _selection = {};
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dummy'),
      ),
      body: Center(
          child: Column(
        children: <Widget>[
          Padding(
            padding: EdgeInsets.fromLTRB(20, 10, 20, 0),
          ),
          TextField(
            style: TextStyle(
              fontSize: 15.0,
              color: Colors.black,
            ),
            decoration: InputDecoration(
              contentPadding: EdgeInsets.all(15.0),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(5.0),
                borderSide: BorderSide(
                  color: Colors.amber,
                ),
              ),
              enabledBorder: OutlineInputBorder(
                borderSide: BorderSide(
                  color: Colors.amber,
                ),
                borderRadius: BorderRadius.circular(5.0),
              ),
              hintText: "Search..",
              prefixIcon: Icon(
                Icons.search,
                color: Colors.black,
              ),
              hintStyle: TextStyle(
                fontSize: 15.0,
                color: Colors.black,
              ),
            ),
            maxLines: 1,
            //  controller: _searchControl,
          ),
          ListView.builder(
            shrinkWrap: true,
            padding: const EdgeInsets.all(8.0),
            itemCount: lovCountryServices.length,
            itemBuilder: (BuildContext context, int index) {
              var item =
                  lovCountryServices[index]; // should be outside build function
              List items = item['services']; // should be outside build function
              return ExpansionTile(
                title: Text(item['name']),
                children: List.generate(items.length, (i) {
                  _selection[items[i]['name']] =
                      _selection[items[i]['name']] ?? item['is_active'];
                  return CheckboxListTile(
                    title: Text(items[i]['name']),
                    value: _selection[items[i]['name']],
                    onChanged: (val) {
                      setState(() {
                        _selection[items[i]['name']] = val;
                      });
                    },
                  );
                }),
              );
            },
          ),
        ],
      )),
    );
  }
}

0 个答案:

没有答案