Implementing Search in ListView builder - flutter

Question

I'm new to coding and I'm trying to make my own app. I'm trying to have a search feature for my listview building but I am having trouble implementing the search. I've tried different tutorials and youtube videos but I can't seem to implement it correctly.
here's the dummy data i'm using
class.dart
class Disease {
String id, title;
List<String> diagnostics;
List<String> management;
Disease({this.id, this.title, this.diagnostics, this.management});
}
data.dart
import 'class.dart';
class Data {
static List<Disease> disease = [
Disease(
id: '1',
title: 'Dengue',
diagnostics: [
'CBC, Plt',
'Dengue NS1 if less than 4 days',
'Dengue Duo if more than 4 days from onset of symptoms',
], management: [
'Hydration',
'No Dark Colored Foods',
'aoiushdioaushd',
]),
Disease(
id: '1',
title: 'Typhoid Fever',
diagnostics: [
'CBC, Plt',
'Dengue NS1 if less than 4 days',
'Dengue Duo if more than 4 days from onset of symptoms',
],
management: [
'Hydration',
'No Dark Colored Foods',
'aoiushdioaushd',
],
)
];
}
and my home page where search is implemented
import 'package:flutter/material.dart';
import 'package:yellow_book/utils/class.dart';
import 'package:yellow_book/utils/data.dart';
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title = ''}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var disease = Data.disease;
TextEditingController editingController = TextEditingController();
final duplicateItems = List<String>.generate(10000, (i) => "Item $i");
var items = List<String>();
#override
void initState() {
items.addAll(duplicateItems);
super.initState();
}
void filterSearchResults(String query) {
List<String> dummySearchList = List<String>();
dummySearchList.addAll(duplicateItems);
if (query.isNotEmpty) {
List<String> dummyListData = List<String>();
dummySearchList.forEach((item) {
if (item.contains(query)) {
dummyListData.add(item);
}
});
setState(() {
items.clear();
items.addAll(dummyListData);
});
return;
} else {
setState(() {
items.clear();
items.addAll(duplicateItems);
});
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Column(
children: [
TextField(
onChanged: (value) {
filterSearchResults(value);
},
controller: editingController,
decoration: InputDecoration(
hintText: "Search",
prefixIcon: Icon(Icons.search),
border: OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(0.0),
),
),
),
),
Expanded(
child: ListView.builder(
itemCount: disease.length,
itemBuilder: (context, index) {
return Card(
child: ListTile(
onTap: () {},
title: Text(disease[index].title),
),
);
},
),
)
],
),
);
}
}
please help. Thank you

Answer 1

Currently your ListView is based on the disease property in your StatefulWidget and you don't change this list in any way (add or remove entries). Your filterSearchResults function as well as in initState you work with your items property so you should reference this one in your ListView or change your overall logic to work on your disease property.
So for now you can change your ListView to:
ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
return Card(
child: ListTile(
onTap: () {},
title: Text(items[index]),
),
);
},
),
This will show all items entries as ListTile and you should be able to search them. If you want to make this work on your disease property, you need to change your functions to make use of the disease property instead of items.