グリッドビューでjsonオブジェクトをリッスンして、ナビゲーションロジックに使用できるようにする方法を知りたいです.たとえば、グリッドビューアイテムのカテゴリIDを選択し、それを使用して次のページにそれぞれのデータまたはアイテムを表示します.
質問する
484 次
2 に答える
1
GridView に表示するリストをネットワークから取得できます。
getTags() async {
var res = await Client().getAsync("yourURL");
var decodedJson = jsonDecode(res.body);
setState(() {
tagList = decodedJson;
});
}
これで、GridView.builder と InkWell を使用して別の画面に移動できるようになりました。
GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
childAspectRatio: MediaQuery.of(context).size.width /
((MediaQuery.of(context).size.height) / 2),
),
itemCount: tagList.length,
itemBuilder: (BuildContext context, int index) {
Tag tag = (tagList)[index];
return InkWell(
onTap:(){
Navigator.push(
context,
MaterialPageRoute(builder: (context) =>
YourPageClass(yourId: tag.id)),
);
},
child: Container()
)
},
),
Tag クラスのコードは次のとおりです。
class Tag {
int id;
Tag({this.id,});
Tag.fromJson(Map<String, dynamic> json) {
id = json['id'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['id'] = this.id;
return data;
}
}
于 2020-12-11T14:12:21.043 に答える