如何创建从多个列表中获取属性的小部件列表？答案

【问题标题】：How do I create a List of Widgets taking properties from multiple lists?如何创建从多个列表中获取属性的小部件列表？
【发布时间】：2021-03-26 09:57:25
【问题描述】：

我想根据两个或三个动态生成的列表的内容创建一个小部件列表。

List<String> Sound = ['A','B','C'];
List<String> Number = ['1','2','3'];
List<int> vertical = [10,20,30];
List<int> horizontal = [20,30,40];

 Widget build(BuildContext context) {
      return MaterialApp(
        home: Scaffold(
          body: Row(
            children:  Sounds.map((sound) {
              return FloatingActionButton(
                  onPressed: () => _audioCache.play(Sound),
                  child: Text(Number),
              );
            }).toList(),
          ),
        ),
      );
    }
  }

使用地图功能，我似乎只能构建一个具有一个属性的浮动操作按钮列表。我想从多个不同的列表中给出由地图函数属性创建的每个按钮。我怎样才能做到这一点？此构建函数位于有状态小部件的状态类中。

【问题讨论】：

使用 List.generate 并在此处返回 Widget 而不是 int：api.flutter.dev/flutter/dart-core/List/List.generate.html
children: [for(int i=0; i<Sound.length; i++) SomeWidget(Sound[i], Number[i], vertical[i], horizontal[i])]

标签： android flutter

【解决方案1】：

为了扩展 Uni 的评论，这里是一个简单的 Dart 程序，它显示了使用 List.generate 从两个列表创建地图列表 - 您的代码将创建您的小部件：

void main() {
  List<String> Sound = ['A', 'B', 'C'];
  List<String> Number = ['1', '2', '3'];
  var list = List.generate(
      Sound.length, 
      (i) => {'Sound': Sound[i], 'Number': Number[i]},
  );
  print(list);
}

顺便说一句，建议使用 lowerCamelCase 命名非常量标识符，因此 Sound 应该是 sound。

【讨论】：

【解决方案2】：

我会亲自改造数据。

如果您总是使用每个列表的相同索引来构建小部件，为什么不使用声音和数字作为属性创建一个类，然后拥有这些对象的一个列表。

那么你所拥有的地图就在这些对象之上

【讨论】：