根据对象列表生成新卡片

Generating new Cards based on List of Objects

我有一个对象列表,有没有一种方法可以遍历 Card 小部件,以便针对此列表中的每个对象,使用该感兴趣的小部件的属性创建一张新卡片。

下面的代码肯定是行不通的,它只是为了说明我要实现的目标背后的逻辑

//function declaration and body...
List<CardInfo> list = new List();
for (var i in cardInfo){ //cardInfo is a list of json created previously.
list.add(new CardInfo.fromJson(i));
    print (list); }//tested the list and it contains the objects I want
 return list;
}

...

//my widget{
    @override
      Widget build(BuildContext context) {
        return new Dismissible(
for (i in list){
            child:  new Card(
              child:
              new ListTile(leading: new Icon(Icons.star, color: Colors.yellowAccent,),
                title: new Text(list(i).field1),//field1 is a string in CardInfo
                subtitle: new Text(list(i).field2),//field2 is a string in CardInfo

这是否可行?

更新

我想出了将每个 JSON 转换为对象然后直接使用对象的方法,现在 _loadData() 函数 returns 每次迭代都是一个对象

_loadData() async {
  var url = 'myurl';
  var httpClient  = createHttpClient();
  var response =await httpClient.get(url);
  List cardInfo = JSON.decode(response.body);
  List<CardInfo> list = new List();
  for ( var i in cardInfo){
    var ci = new CardInfo.fromJson(i);

    list.add(new CardInfo.fromJson(i));

  return ci;
  }
  //return list;

}


....

那么有没有办法设置我的 class 构造函数,以便它允许我访问返回对象的字段?像这样:

title: new Text(new CardInfo(_loadData()).field)

更新 2:

@override
    Widget build(BuildContext context) {
      return new FutureBuilder(
          future: _loadData(),
          builder: (BuildContext context, AsyncSnapshot<List> jsonList){
            if (jsonList.hasData==true){
              var cardInfo = jsonList.data[0];//is this right ?
              print (cardInfo); 
              return new Dismissible(
                child: new Column(
                  children:
                  cardInfo.map(
                          (CardInfo info)=>
                      new Card(
                          child: new ListTile(leading: new Icon(Icons.star, color: Colors.yellowAccent,),
                            title: new Text(info.field),
                            subtitle: new Text("Subtitle"),)

                      ) ), ),....

我的函数在顶部如下:

  _loadData() async {
var url = 'myurl';
var httpClient = createHttpClient();
var response = await httpClient.get(url);
List cardInfo = JSON.decode(response.body);


List<CardInfo> list = new List();
for (var i in cardInfo) {


list.add(new CardInfo.fromJson(i));
}


return list;
}

我收到以下错误:

Class 'CardInfo' has no instance method 'map'.

您可以使用 Iterable.map 方法来完成此操作。例如:

new Column(
  children: list.map(
    (CardInfo info) => new Card(child: new Text(info.field1)),
  ).toList()
)