如何在搜索结果页面后添加特定的文本和图像

Question

下面的代码是我迄今为止获得的最新代码。搜索功能起作用，当点击时；谷歌"您将进入特定于"；谷歌"；。

但我现在不确定如何在页面中添加特定的文本和图像。例如，我不希望Facebook的信息被放在谷歌页面上。制定一份新的名单明智吗？还有什么其他选择？我该如何做？

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Search Example"),
actions: [
IconButton(
icon: Icon(Icons.search),
onPressed: () {
showSearch(context: context, delegate: SearchItem());
}),
],
),
);
}
}
final List<String> myList = [
"google",
"IOS",
"Android",
"Linux",
"MacOS",
"Windows"
];
class SearchItem extends SearchDelegate<String> {
@override
List<Widget> buildActions(BuildContext context) {
return [
IconButton(
icon: Icon(Icons.clear),
onPressed: () {
query = "";
})
];
}
@override
Widget buildLeading(BuildContext context) {
return IconButton(
icon: AnimatedIcon(
icon: AnimatedIcons.menu_arrow,
progress: transitionAnimation,
),
onPressed: () {
close(context, null);
});
}
@override
Widget buildResults(BuildContext context) {}
@override
Widget buildSuggestions(BuildContext context) {
final suggestionsList = query.isEmpty
? myList
: myList
.where((p) => p.toLowerCase().contains(query.toLowerCase()))
.toList();
return ListView.builder(
itemBuilder: (context, index) => ListTile(
onTap: () {
close(context, suggestionsList[index]);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => DetailScreen(myList
.indexWhere((item) => item == suggestionsList[index]))));
},
title: Text(suggestionsList[index]),
),
itemCount: suggestionsList.length,
);
}
}
class DetailScreen extends StatelessWidget {
final int index;
DetailScreen(this.index);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("${myList[index]}"),),
body: Center(
child: Text(
"${myList[index]}",style: TextStyle(fontSize: 22),
),
));
}
} 

Answer 1

不确定你想说什么，但如果你想在Details Page上显示更多数量的items，那么在这种情况下，你可以创建一个class，它可以包含所有的items，你想要在detailsclass中显示

这是工作的Code对于相同的，请检查

import 'package:flutter/material.dart';
//Below it the new Class you Will Need, or We can say a Modal You Need to have all your properties of the class,
//Which you wanna show in details page
class MyPlatforms {
String name;
String image;
MyPlatforms({this.image, this.name});
}
//A MyPlatforms list created using that modal
final List<MyPlatforms> myPlatformsList = [
MyPlatforms(image: "assets/images/google.png", name: "Google"),
MyPlatforms(image: "assets/images/ios.png", name: "IOS"),
MyPlatforms(image: "assets/images/linux.png", name: "Linux"),
MyPlatforms(image: "assets/images/android.png", name: "Android"),
MyPlatforms(image: "assets/images/mac.png", name: "MacOS"),
MyPlatforms(image: "assets/images/windows.png", name: "Windows"),
];
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Search Example"),
actions: [
IconButton(
icon: Icon(Icons.search),
onPressed: () {
showSearch(context: context, delegate: SearchItem());
}),
],
),
);
}
}
final List<String> myList = [
"google",
"IOS",
"Android",
"Linux",
"MacOS",
"Windows"
];
class SearchItem extends SearchDelegate<String> {
@override
List<Widget> buildActions(BuildContext context) {
return [
IconButton(
icon: Icon(Icons.clear),
onPressed: () {
query = "";
})
];
}
@override
Widget buildLeading(BuildContext context) {
return IconButton(
icon: AnimatedIcon(
icon: AnimatedIcons.menu_arrow,
progress: transitionAnimation,
),
onPressed: () {
close(context, null);
});
}
@override
Widget buildResults(BuildContext context) {}
@override
Widget buildSuggestions(BuildContext context) {
final suggestionsList = query.isEmpty
? myList
: myList
.where((p) => p.toLowerCase().contains(query.toLowerCase()))
.toList();
return ListView.builder(
itemBuilder: (context, index) => ListTile(
onTap: () {
close(context, suggestionsList[index]);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => DetailScreen(
item: myPlatformsList[
index], //pass the index of the MyPlatforms list
)));
},
title: Text(suggestionsList[index]),
),
itemCount: suggestionsList.length,
);
}
}
class DetailScreen extends StatelessWidget {
final MyPlatforms
item; //Get the item, as a object of MyPlatforms class so the we can acess its all properties like image and name;
DetailScreen({this.item});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("${item.name}"),
),
body: Center(
child: new Column(
children: [
Text(
"${item.name}", //acessing the name property of the  MyPlatforms class
style: TextStyle(fontSize: 22),
),
SizedBox(
height: 20.0,
),
Image.asset(
"${item.image}"), //acessing the image property of the  MyPlatforms class
],
),
));
}
}