Flutter Blue示例代码报错：List<dynamic>无法赋值给List<Widget>

问题场景 #

运行Flutter Blue官方示例代码时，出现编译错误：

The argument type 'List' can't be assigned to the parameter type 'List'

涉及两段代码片段：

第一段报错代码 #

StreamBuilder<List<ScanResult>>(
        stream: FlutterBlue.instance.scanResults,
        initialData: [],
        builder: (c, snapshot) => Column(
          children: snapshot.data!
              .map(
                (r) => ScanResultTile(
                  result: r,
                  onTap: () => Navigator.of(context)
                      .push(MaterialPageRoute(builder: (context) {
                    r.device.connect();
                    return DeviceScreen(device: r.device);
                  })),
                ),
              )
              .toList(),
        ),
      )

第二段报错代码 #

List<Widget> _buildServiceTiles(List<BluetoothService> services) {
    return services
        .map(
          (s) => ServiceTile(
            service: s,
            characteristicTiles: s.characteristics
                .map(
                  (c) => CharacteristicTile(
                    characteristic: c,
                    onReadPressed: () => c.read(),
                    onWritePressed: () async {
                      await c.write(_getRandomBytes(), withoutResponse: true);
                      await c.read();
                    },
                    onNotificationPressed: () async {
                      await c.setNotifyValue(!c.isNotifying);
                      await c.read();
                    },
                    descriptorTiles: c.descriptors
                        .map(
                          (d) => DescriptorTile(
                            descriptor: d,
                            onReadPressed: () => d.read(),
                            onWritePressed: () => d.write(_getRandomBytes()),
                          ),
                        )
                        .toList(),
                  ),
                )
                .toList(),
          ),
        )
        .toList();
  }

错误原因 #

Dart中，map()方法未显式指定返回类型时，默认返回Iterable<dynamic>，调用toList()后得到的是List<dynamic>。而Flutter组件的children、characteristicTiles等属性要求传入List<Widget>类型，类型不匹配导致编译报错。

解决方法 #

在所有嵌套的map()操作中显式指定返回Widget类型，或者对生成的列表进行类型转换。

第一段代码修改方案 #

在map()后添加<Widget>指定类型：

StreamBuilder<List<ScanResult>>(
  stream: FlutterBlue.instance.scanResults,
  initialData: [],
  builder: (c, snapshot) => Column(
    children: snapshot.data!
        .map<Widget>(
          (r) => ScanResultTile(
            result: r,
            onTap: () => Navigator.of(context).push(MaterialPageRoute(builder: (context) {
              r.device.connect();
              return DeviceScreen(device: r.device);
            })),
          ),
        )
        .toList(),
  ),
)

也可以用cast<Widget>()转换列表类型：

children: snapshot.data!
    .map((r) => ScanResultTile(...))
    .toList()
    .cast<Widget>(),

第二段代码修改方案 #

在每一层嵌套的map()中都指定<Widget>类型：

List<Widget> _buildServiceTiles(List<BluetoothService> services) {
  return services
      .map<Widget>(
        (s) => ServiceTile(
          service: s,
          characteristicTiles: s.characteristics
              .map<Widget>(
                (c) => CharacteristicTile(
                  characteristic: c,
                  onReadPressed: () => c.read(),
                  onWritePressed: () async {
                    await c.write(_getRandomBytes(), withoutResponse: true);
                    await c.read();
                  },
                  onNotificationPressed: () async {
                    await c.setNotifyValue(!c.isNotifying);
                    await c.read();
                  },
                  descriptorTiles: c.descriptors
                      .map<Widget>(
                        (d) => DescriptorTile(
                          descriptor: d,
                          onReadPressed: () => d.read(),
                          onWritePressed: () => d.write(_getRandomBytes()),
                        ),
                      )
                      .toList(),
                ),
              )
              .toList(),
        ),
      )
      .toList();
}

这样修改后，map()会明确返回Iterable<Widget>，toList()生成的就是符合要求的List<Widget>，编译错误即可解决。

内容的提问来源于stack exchange，提问作者Mussab Mehboob