【发布时间】：2020-10-24 12:03:48
【问题描述】：
我的 JSON 数据文件看起来像这样，您可以看到“景点”本身就是每个城市下的列表：
[
{
"city": "text text text",
"attractions": [
"text text ",
"text text"
],
},
{
"city": "text text text",
"attractions": [
"text text",
"text text",
],
},
]
以下代码基本上是一个从上述 JSON 获取数据的列表视图构建器。现在，当单击该城市时，它会导航到下一页，其中会显示该城市的景点列表。正如您在代码中看到的那样，有一个选项可以将另一个页面中的城市保存为收藏夹，该收藏夹可以显示在另一个收藏夹列表中：
class Index extends StatefulWidget {
@override
_IndexState createState() => _IndexState();
}
List data;
List<Cities> citylist = List();
List<Cities> citysavedlist = List();
int index;
class _IndexState extends State<Index> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: listView(),
);
}
Future<String> fetchData() async {
String data =
await DefaultAssetBundle.of(context).loadString("assets/data.json");
final jsonResult = json.decode(data);
this.setState(() {
jsonResult
.forEach((element) => citylist.add(new Cities.fromJson(element)));
});
return "Success!";
}
@override
void initState() {
super.initState();
fetchData();
}
listView() {
return ListView.builder(
itemCount: citylist == null ? 0 : citylist.length,
itemBuilder: (context, index) {
return Column(
children: <Widget>[_buildRow(index, citylist)],
);
},
);
}
Widget _buildRow(index, citylist) {
final bool alreadySaved = citysavedlist.contains(citylist[index]);
return Padding(
padding: const EdgeInsets.only(top: 5.0, left: 5.0, right: 5.0),
child: Card(
child: ListTile(
title:
Text(citylist[index].title, style: TextStyle(fontSize: 22.0)),
trailing: IconButton(
icon: Icon(
alreadySaved ? Icons.star : Icons.star_border,
color: alreadySaved ? Colors.blue : Colors.blue,
),
onPressed: () {
setState(() {
if (alreadySaved) {
citysavedlist.remove(citylist[index]);
} else {
citysavedlist.add(citylist[index]);
}
});
},
), //subtitle: Text(subtitle),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Detail(citylist[index])));
}),
),
);
}
void _pushSaved() {
Navigator.of(context).push(
MaterialPageRoute<void>(
builder: (BuildContext context) {
final Iterable<ListTile> tiles = citysavedlist.map(
(Cities pair) {
return ListTile(
title: Text(
pair.city,
),
onTap: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) => Detail(pair)));
});
},
);
final List<Widget> divided = ListTile.divideTiles(
context: context,
tiles: tiles,
).toList();
return Scaffold(
appBar: AppBar(
title: const Text('Saved Suggestions'),
),
body: ListView(children: divided),
);
},
),
);
}
}
这是模型类：
List<Cities> citiesFromJson(String str) =>
List<Cities>.from(json.decode(str).map((x) => Cities.fromJson(x)));
String citiesToJson(List<Cities> data) =>
json.encode(List<dynamic>.from(data.map((x) => x.toJson())));
class Cities {
Cities({
this.city,
this.attractions,
});
String city;
List<String> attractions;
factory Cities.fromJson(Map<String, dynamic> json) => Cities(
city: json["city"],
attractions: List<String>.from(json["attractions"].map((x) => x)),
);
Map<String, dynamic> toJson() => {
"city": city,
"attractions": List<dynamic>.from(attractions.map((x) => x)),
};
}
下面的代码是我需要你帮助的地方，它是用于详细页面，当有人点击一个城市时，这个页面会以列表的形式显示每个城市的景点。在此页面中，我希望能够将景点保存为收藏夹，以便在其他页面中显示。
class Detail extends StatefulWidget {
final Cities cities;
Detail(this.cities);
@override
_DetailState createState() => _DetailState();
}
class _DetailState extends State<Detail> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.cities.city),
),
body: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
widget.cities.city,
style: TextStyle(fontSize: 20),
),
),
Expanded(
child: ListView.builder(
itemCount: widget.cities.attractions.length,
itemBuilder: (BuildContext context, int index) {
return Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(widget.cities.attractions[index]),
));
},
),
),
],
),
),
);
}
}
我需要您的帮助，请添加此功能“将景点保存为收藏”。我需要在一个“已保存的景点页面”中显示所有已保存的景点，无论它属于哪个城市。
有人可以帮忙吗
【问题讨论】：
标签： flutter dart flutter-listview