Flutter -- Filtering a List tile data from API in search bar-CodePudding

i have created a list view builder below the search bar. i wanted the generated API data to be filtered and listed in the search bar. iam a beginner and please help

ListView.builder(
shrinkWrap: true,
itemCount: product?.length,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (context, index) {
  return Padding(
    padding: const EdgeInsets.only(left: 15),
    child: Expanded(
      child: ListTile(
          title: Text(product![index].title.toString()),
          leading: CircleAvatar(
            backgroundImage: NetworkImage(
                product![index].image.toString()),
          )),
    ),
  );
},
),

output of the list view builder

CodePudding user response：

You can checkout this example

https://stackoverflow.com/a/50569613/13078639

https://www.youtube.com/watch?v=ZHdg2kfKmjI&ab_channel=JohannesMilke

https://www.youtube.com/watch?v=kX1BJ3XcXcA&ab_channel=InventorCode

also if you want then you can add a library : Filter List , Search Page

CodePudding user response：

To filter your products you have to perform a search inside the array of products and update the products state, something like:

setState(() {
  products = products.where((product) => product.title.contains('your-search'));
 });