在下拉值中显示图像

Question

我尝试创建一个 Dart 多页面应用程序。

我创建了一个从包含表单的抽屉中导航的页面。它有一个容器，用于从下拉按钮获取用户选择的项目。 在此下拉列表中，我需要在每个项目中提供图像。如何通过自定义下拉按钮来做到这一点？这可能吗？

我已附上我的应用程序中所需内容的示例图片。

Answer 1

这是一个简单的示例，展示如何开始：

import 'package:flutter/material.dart';

class Test extends StatefulWidget {
  @override
  _TestState createState() => new _TestState();
}

class _TestState extends State<Test> {
  var _img = new Image.network("https://upload.wikimedia.org/wikipedia/commons/thumb/8/89/TUCPamplona10.svg/500px-TUCPamplona10.svg.png");
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(title: new Text("Test Drop"),),
      body: new Center(
        child: new Container (
            height: 50.0,
            child:new DropdownButton(
            items: new List.generate(10, (int index){
          return new DropdownMenuItem(child: new Container(
            padding: const EdgeInsets.only(bottom: 5.0),
            height: 100.0,
              child: new Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                _img,
                new Text("Under 10")
              ],
            ),
          ));
        }) 
        , onChanged: null),),
      ),
    );
  }
}

Answer 2

铝 就走吧...

这里...

类 _AddNewBoxState 扩展状态 {

地图？便利设施；

@覆盖 小部件构建（BuildContext上下文）{ 返回脚手架（ // ... 主体：SingleChildScrollView（ 子项：列（ 孩子们： [ // ... 容器（ 身高：40， 填充：EdgeInsets.对称（水平：10）， 装饰：BoxDecoration( 边框：Border.all（颜色：hintTextColor.withOpacity（0.5））， borderRadius: BorderRadius.circular(5), ), 宽度：双无穷大， 子项：DropdownButtonFormField>( value: FacilitiesList.first, // 设置初始值 装饰：输入装饰（ hintText: '选择便利设施', 提示样式：inputFormTextStyle（字体大小：12，字体权重：FontWeight.w400，颜色：提示文本颜色）， 边框：InputBorder.none， ), 样式：inputFormTextStyle（fontSize：15，fontWeight：FontWeight.w400，颜色：blackColor）， 图标：SvgPicture.asset( 资产.arrowDown, 高度：12， ), 项目：设施清单.地图（（设施）{ 返回下拉菜单项>( 价值： 便利设施， 孩子：行（ 孩子们： [ 图片.asset( 便利设施['图像'], 身高：15， ), 大小框（宽度：8）， 文本（便利设施['文本']）， ], ), ）； }).toList(), onChanged: (selectAmenity) { 设置状态（（）{ 便利设施=选定的便利设施； }); }, ), ),

      ],
    ),
  ),
);

} }