SearchDelegate, how to open/start a StatelessWidget from buildResults? - flutter

Question

I'm quite new in programming. I have watched/read quite a lot of videos about SearchDelegate on YT and blogs but I don't understand how to get into the buildResult that it opens existing statelessWidgets.
Here is my SearchDelegate as it is now:
class Search extends SearchDelegate<String> {
final allSearch = [
"Humpback Whale",
"Fin Whale",
"Blue Whale",
];
#override
List<Widget> buildActions(BuildContext context) {
return [
IconButton(
icon: Icon(Icons.clear),
onPressed: () {
query = "";
})
];
}
#override
Widget buildLeading(BuildContext context) {
return IconButton(
icon: Icon(Icons.arrow_back),
onPressed: () {
close(context, null);
});
}
#override
Widget buildResults(BuildContext context) {
return Container(
color: Colors.red,
child: Center(
child: Text(query),
),
);
}
#override
Widget buildSuggestions(BuildContext context) {
final suggestionList = query.isEmpty
? allSearch
: allSearch.where((p) => p.contains(query)).toList();
return ListView.builder(
itemBuilder: (context, index) => ListTile(
onTap: () {
showResults(context);
},
leading: Icon(Icons.search_rounded),
title: RichText(
text: TextSpan(
text: suggestionList[index].substring(0, query.length),
style:
TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
children: [
TextSpan(
text: suggestionList[index].substring(query.length),
style: TextStyle(color: Colors.grey))
])),
),
itemCount: suggestionList.length,
);
These three "Humpback Whale", "Fin Whale", and "Blue Whale" are just examples what to search for. I was hoping that if you search for Humpback Whale and press on the result:
Search of "Humpback Whale"
to be directed to this page I already created:
Humpback Whale page
The route is already set up for all the animals I want e.g.
'/texthumpbackwhale': (context) => TextHumpbackWhale().
Thank you for any kind of help.
UPDATE
here my solution that I figured out now:
I have added this to build results
return ListTile(
onTap: () {
Navigator.pushNamed(context, listitem.route);
enter code here
and attached in a list of all my pages a string with the route.
All in all the build Results looks like this:
#override
Widget buildResults(BuildContext context) {
final suggestionList = query.isEmpty
? loadAllAnimals()
: loadAllAnimals()
.where((p) => p.title.toLowerCase().contains(query.toLowerCase()))
.toList();
return suggestionList.isEmpty
? Text(
"No Results Found...",
style: TextStyle(fontSize: 20),
)
: ListView.builder(
itemCount: suggestionList.length,
itemBuilder: (context, index) {
final AllAnimals listitem = suggestionList[index];
return ListTile(
onTap: () {
Navigator.pushNamed(context, listitem.route);
},
title: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
listitem.title,
style: TextStyle(fontSize: 20),
),
Text(
listitem.type,
style: TextStyle(color: Colors.grey),
),
Divider()
],
),
);
});
}
and my List like this:
class AllAnimals {
const AllAnimals(this.title, this.type, this.route);
final String title;
final String type;
final String route;
}
List<AllAnimals> loadAllAnimals() {
var fi = <AllAnimals>[
AllAnimals("Atlantic Puffin", "Auks", '/atlanticpuffin'),
//and the other items
];
return fi;
}