Question

所以我想创建一个以Map<String, int>作为值列表的对象，其中String是菜单中显示的内容，而int被存储在类中，以供选择后使用。

我不确定该怎么做。涉及返回int值的部分使我难以理解。

地图结构是这样写的：

  final Map<String, int> discBasis = {
    'Age': 1,
    'Ancestry': 2,
    'Color': 3,
    'Disability': 4,
    'Race': 5,
    'Religion': 6,
    'Sex': 7,
    'Familial Status': 8,
    'National Origin': 9
  };

＆我当前正在使用的班级：

final double formMarginHoriz = 10.0;
final double formMarginVert = 5.0;

class DropDownFromMap extends StatefulWidget {
  Map<String, int> kv;
  DropDownFromMap(this.kv);

  @override
  DropDownFromMapState createState() => new DropDownFromMapState(kv);
}

class DropDownFromMapState extends State<DropDownFromMap> {
  Map<String, int> kv;
  DropDownFromMapState(this.kv);

  int selectedVal;

  @override
  Widget build(BuildContext context) {
    return new Container(
        margin: EdgeInsets.only(
            top: formMarginVert,
            bottom: formMarginVert,
            left: formMarginVert,
            right: formMarginHoriz),
        child: new DropdownButton<int>(
          hint: new Text("Select an option"),
          value: selectedVal,
          onChanged: (String newVal) {
            setState(() {
              selectedVal = kv[newVal];
            });
          },
          items: kv.map((String k, _) {
            return new DropdownMenuItem<String>(
              value: k,
              child: new Text(k),
            );
          }).toList(),
        ));
  }
}

并以这种方式实例化（这可能是错误的）：

  @override
  Widget build(BuildContext context) {
    return new Material(
        color: Colors.blueAccent,
        child: new Container(
            child: new Form(
                key: _formKey,
                child: new Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    new DropDownFromMap(data.offenderType),
...

更多上下文可以在github项目：https://github.com/chscodeforchange/icrc-app的相关文件中找到：dropdown.dart，off_page_one.dart和form_data.dart。

提前谢谢！

Answer 1

static const Map<String, Duration> frequencyOptions = {
    "30 seconds": Duration(seconds: 30),
    "1 minute": Duration(minutes: 1),
    "2 minutes": Duration(minutes: 2),
  };

Duration _frequencyValue = Duration(seconds: 30);

@override
  Widget build(BuildContext context) {
    return DropdownButton<Duration>(
          items: frequencyOptions
              .map((description, value) {
                return MapEntry(
                    description,
                    DropdownMenuItem<Duration>(
                      value: value,
                      child: Text(description),
                    ));
              })
              .values
              .toList(),
          value: _frequencyValue,
          onChanged: (newValue) {
             setState(() {
                _frequencyValue = newValue;
             });
          },

        );
}

Answer 2

除了您需要删除State对象中的构造函数和映射，而仅将其保留在StatefulWidget本身之外，我的代码没有发现任何问题。您可以使用widget.kv

来访问地图

Answer 3

代替使用Map，

final List<DropdownMenuItem> list = [
DropdownMenuItem(value: "", child: Container((...your widget style), child: Text("Select"))),
DropdownMenuItem(value: "value1", child: Container((...your widget style), child: Text("title1"))),
DropdownMenuItem(value: "value2", child: Container((...your widget style), child: Text("title2")))
];

DropdownButton(
              value: "",
              items: list,
              onChanged: (value) {},
            ),

您可以使用自己的变体。我认为这对我来说是最好的方法，因为我只需要硬编码两个或三个项目即可显示在下拉菜单中。您可以创建一个单独的模型，并使用此思路来生成带有map的任何类型的下拉列表。

在Flutter with Map中制作下拉菜单

3 个答案: