Question

我是Flutter开发的新手，刚开始使用gridViewWidget。在我的gridview中，我有FlashCardList和FlashCards。在最高级别上，它应该在任何对象上显示FlashCardList和onTap，并且应该显示另一个带有与flashCardList类别关联的抽认卡的gridview。我的问题是，我是否仅需要为FlashCard创建一个新的gridViewWidget并重复90％的代码，还是可以重用现有的小部件？我可以在iOS中通过再次调用相同的视图并传递一些值来做到这一点，以便子视图知道提取不同的数据集，但是我不确定如何使用请求该类型的futurebuilder来做到这一点。进行预定义，并且要求项目也进行预定义的gridView Builder。这是我的代码：

 class GridViewWidget extends StatefulWidget{
  @override
  createState() => new GridViewState();

}

class GridViewState extends State<GridViewWidget>{

  List<Sound> sound;
  List<FlashCardList> flashCardList;
  List<FlashCards> flashCards;


  @override
  void initState(){
    debugPrint ('debug main.dart');
    super.initState();

  }

  Future<List<FlashCards>> fetchFlashCards() async{
    final response = await http.get('some url');
    //debugPrint (response.body);
    if (response.statusCode == 200) {
      var data = json.decode(response.body);
      var flashCardsData = data["FlashCards"] as List;
      flashCards = flashCardsData.map<FlashCards>((json) => FlashCards.fromJson(json)).toList();
      debugPrint("Did get data: ${flashCards.first.name}");
    } else {
      throw Exception('Failed to load post');
    }
    //objects = [sound, flashCardList, flashCards].expand((x) => x).toList();
    return flashCards;
  }

  Future<List<FlashCardList>> fetchFlashCardList() async{
    final response = await http.get('some url');
    //debugPrint (response.body);
    if (response.statusCode == 200) {
      var data = json.decode(response.body);
      var flashCardListData = data["FlashCardList"] as List;
      flashCardList = flashCardListData.map<FlashCardList>((json) => FlashCardList.fromJson(json)).toList();
      debugPrint("Did get data: ${flashCardList.first.name}");
    } else {
      throw Exception('Failed to load post');
    }
    //objects = [sound, flashCardList, flashCards].expand((x) => x).toList();
    return flashCardList;
  }

  @override
  Widget build(BuildContext context){
    return new Scaffold(
      appBar: new AppBar(
        centerTitle: true,
        title: new Text(Strings.pageTitle),
      ),
      body: FutureBuilder<List<FlashCardList>>(
        future: fetchFlashCardList(),
        builder: (BuildContext context, AsyncSnapshot<List<Object>> snapshot) {
          if (snapshot.hasError)
            return new Text(
              '${snapshot.error}',
              style: TextStyle(color: Colors.red),
            );
          switch (snapshot.connectionState) {
            case ConnectionState.none:
              return new Text('Input a URL to start');
            case ConnectionState.waiting:
              return new Center(child: new CircularProgressIndicator());
            case ConnectionState.active:
              return new Text('');
            case ConnectionState.done:
                return new GridView.builder(
                  gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
                      maxCrossAxisExtent: 200.0,
                      childAspectRatio: MediaQuery.of(context).size.width/(MediaQuery.of(context).size.height)),
                  itemCount: flashCardList.length,
                  itemBuilder: (BuildContext context, int index) {
                    return _getGridItemUI(context, flashCardList[index]);

                    /*return GridTile(header: Text("FlashCards"),
                        child: Text(
                        flashCards[index].name, textAlign: TextAlign.center));*/

                  },
                );
          }
        }
      ),
    );
  }

  _getGridItemUI(BuildContext context, FlashCardList item){
    return new InkWell(
      onTap: () {
        _showSnackBar(context, item);
      },
      child: new Card(
        child: new Column(
          crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[

              new Image(image: new CachedNetworkImageProvider("some url" + item.image)),
              /*new Expanded(
                child:new Center(
                  child: new Column(
                    children: <Widget>[
                      new SizedBox(height: 8.0),
                      new Expanded(
                        child: AutoSizeText(
                          item.name, maxLines: 1,
                        )
                      )
                    ],
                  ),
                )
              )*/
            ],
        ),
        elevation: 2.0,
        margin: EdgeInsets.all(5.0),
      )
    );
  }

  _showSnackBar(BuildContext context, FlashCardList item){

  }



}

Answer 1

您可以使GridViewWidget通用以解决类型问题，也可以传递参数以区分闪存卡和闪存卡，但这不是理想的解决方案。而且我建议不要将数据获取逻辑放在窗口小部件中。

Flutter重用视图

1 个答案: