How can I read add a functional search bar in flutter, reading the results from a JSON File?

Question

I would like to have a working searchbar in my Flutter app. I store the data like name of the breed and the like in a JSON file.

Links: breed_page.dart db.json

I have already considered whether it would be useful to use something external instead of a json file but rewriting everything now would be a lot of work again, so I hope that it works as it is.

Answer 1

here an example for Searching List View with JSON Data by typing anything on the search bar.

onChanged: (searchText) {
          searchText = searchText.toLowerCase();
          setState(() {
            _usersDisplay = _users.where((u) {
              var fName = u.firstName.toLowerCase();
              var lName = u.lastName.toLowerCase();
              var job = u.job.toLowerCase();
              return fName.contains(searchText) || lName.contains(searchText) || job.contains(searchText);
            }).toList();
          });

The searching logic: First, you type anything on the search bar that text converts into lower case. Then also convert user first name, last name, and job fields into lower case. Then check that entered text contains in the user first name or last name or job. Then the matching results are added to the usersDisplay list. Then while typing on the search bar automatically re-render matching results on usersDisplay list.

you could download the project from here