Flutter：下拉列表中的选定值答案

【问题标题】：Flutter: Selected value in dropdown listFlutter：下拉列表中的选定值
【发布时间】：2018-07-24 03:01:32
【问题描述】：

当我选择一个项目时，对话框中的初始值不会改变。这是下拉列表的代码：

void _buildStatusDialog(String documentID) {
String _selectedText = "SDD";
showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      return AlertDialog(
        title: Text("Status Update"),
        content: new DropdownButton<String>(
          hint: Text("Status"),
          value: _selectedText,
          items: <String>['SDD', 'Meeting', 'Home', 'Space']
              .map((String value) {
            return new DropdownMenuItem<String>(
              value: value,
              child: new Text(value),
            );
          }).toList(),
          onChanged: (String val) {
            _selectedText = val;
            setState(() {
              _selectedText = val;
            });
          },
        ),
        actions: <Widget>[
          FlatButton(
            child: Text("UPDATE"),
            onPressed: () {
              .....
            },
          ),
        ],
      );
    });

}

如何更新“提示”或显示所选项目？

【问题讨论】：

您的setState 调用正在更新构建对话框的小部件，而不是对话框。请注意，showDialog 不会再次被调用。你需要用你自己的 StatefulWidget 替换你的对话框
是否可以在不创建另一个 StatefulWidget 的情况下实现这一点？
不，你需要创建一个新的元素， setState 可以标记脏。否则除了关闭/打开对话框之外，没有办法更新小部件
好的。谢谢乔纳！

标签： dart flutter dropdown

【解决方案1】：

使用@Jonah Williams 在 cmets 中的提示，我想出了以下工作示例来解决我遇到的类似问题：

import 'package:flutter/material.dart';

class StatusDialog extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return StatusDialogState();
  }
}

class StatusDialogState extends State<StatusDialog> {
  String _selectedText = "SSD";

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text("Status Update"),
      content: new DropdownButton<String>(
        hint: Text("Status"),
        value: _selectedText,
        items: <String>['SDD', 'Meeting', 'Home', 'Space']
            .map((String value) {
          return new DropdownMenuItem<String>(
            value: value,
            child: new Text(value),
          );
        }).toList(),
        onChanged: (String val) {
          setState(() {
            _selectedText = val;
          });
        },
      ),
      actions: <Widget>[
        FlatButton(
          child: Text("UPDATE"),
          onPressed: () {
            //.....
          },
        ),
      ],
    );
  }
}

void _buildStatusDialog(String documentID) {
  showDialog<void>(
    context: context,
    builder: (BuildContext context) {
      return StatusDialog();
    }
  );
}

然后您只需要添加一些逻辑即可从StatusDialog 获取_selectedText - 可能使用回调。

【讨论】：

【解决方案2】：

添加这一行isExpanded: true，它会将箭头扩大到容器右侧，因此代码将如下所示：

return new DropdownMenuItem<String>(
  value: value,
  child: new Text(value),
  isExpanded: true,
);

【讨论】：

这回答了另一个问题，而不是这里提出的问题。