flutter - 在 DropDown 小部件中添加带有 API 货币文本的图像

Question

我正在使用来自 free.currconv.com 的 API 创建一个货币转换器。我试图弄清楚如何在 DropDown 小部件中放置带有货币文本的国家标志。这是我的问题的一个例子（来自 YouTube）。

这是我在customwidgets.dart.

import 'package:flutter/material.dart';

Widget customizedDropDown(
    List<String> items,
    String value,
    void onChange(val)
    ){
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 18.0, vertical: 4.0),
      decoration: BoxDecoration(
        color:  Colors.white,
        borderRadius: BorderRadius.circular(16.0),
      ),
      child: DropdownButton<String>(
        value: value,
        onChanged: (String val){
          onChange(val);
        },
        items: items.map<DropdownMenuItem<String>>((String val){
          return DropdownMenuItem(
            child: Text(val),
            value: val,
          );
    }).toList(),
      ),
    );
}

我有assets/images33 面国旗中的一面。

标签： flutterdart

Answer 1

将子级更改为DropdownMenuItem带有图像和文本的行，如下所示：

      DropdownMenuItem(
        child: Row(
          children: [
            Image.network('https://picsum.photos/250?image=9', width: 20),
            SizedBox(width: 20),
            Text('hi'),
          ],
        ),
        value: val,
      )

但是，当然，用您的本地图像替换图像。