宽度实际上是由selectedItemBuilder参数提供的最宽项决定的（如果没有定义，它将使用这些项）。

DropdownButton<T>(
      value: value,
      selectedItemBuilder: (ctx) => [for (final item in items) value], 
      items: items,
      onChanged: (value) => ... update value

示例中的selectedItemBuilder生成一个重复项的列表（对应于所选值的项），您需要一个有状态的小部件来处理该值。

用ButtonTheme Package 下拉按钮，并添加alignedDropdown = true，如下所示：

ButtonTheme(
  alignedDropdown: true,
  child: DropdownButton(...),
)

alignedDropdown会将菜单项的宽度与按钮相匹配。然后我们需要特定的宽度，所以用SizedBox或Container Package ButtonTheme：

SizedBox(
  width: 25, // Your width for dropdowns
  child: ButtonTheme(...),
)

这是可行的：

new Container(
            padding: const EdgeInsets.fromLTRB(10.0, 5, 10, 0),
            child: new Container(
              padding: const EdgeInsets.fromLTRB(10, 5, 5, 5),
              decoration: new BoxDecoration(
                  color: Colors.white,
                  borderRadius: new BorderRadius.only(
                      topLeft: const Radius.circular(5.0),
                      bottomLeft: const Radius.circular(5.0),
                      bottomRight: const Radius.circular(5.0),
                      topRight: const Radius.circular(5.0))),
              child: new Center(
                  child: new Column(children: [
                new DropdownButton(
                  underline: Text(''),
                  icon: Icon(Icons.keyboard_arrow_down),
                  hint: new Text('Small text'),
                  style: TextStyle(
                    color: Colors.white30,
                  ),
                  isExpanded: true,
                  value: _selectedLocation,
                  onChanged: (String newValue) {
                    setState(() {
                      _selectedLocation = newValue;
                    });
                  },
                  items: _locations.map((String location) {
                    return new DropdownMenuItem<String>(
                      value: location,
                      child: new Text(
                        location,
                        style: TextStyle(
                            color: myColour, fontWeight: FontWeight.bold),
                      ),
                    );
                  }).toList(),
                ),
              ])),
            ))

如果我理解正确的话，那么我也遇到过这个问题，并且我有一个解决方案。简单地创建一个Wrap小部件作为DropdownButton的父控件。它将使下拉菜单按照值的大小换行（不确定它对空值的React）

Wrap(children: <Widget>[DropdownButton(
value: null,
hint: Text("Small text"),
items: //Text widgets that have more text and are larger than the hint
)])

使用DropdownButtonHideUnderline删除下划线扭曲下拉框

我设法通过定义alignment: Alignment.centerRight删除了空白。默认情况下，对齐方式设置为Alignment.centerStart，这将强制文本开始对齐，而图标设置为结束对齐。因此，通过将文本居中向右对齐，它将填充文本和图标之间的空白。完整代码示例：

DropdownButton(
    alignment: Alignment.centerRight,
    child: .....
     )