0

グリッドビューでjsonオブジェクトをリッスンして、ナビゲーションロジックに使用できるようにする方法を知りたいです.たとえば、グリッドビューアイテムのカテゴリIDを選択し、それを使用して次のページにそれぞれのデータまたはアイテムを表示します.

4

2 に答える 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 に答える