Question

我的应用栏中有一个下拉菜单。但是，它似乎默认带有下划线。颤抖的文档说默认为0.0，不可能是这种情况，我可以看到下划线。如何删除下划线。

return Container(
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.all(Radius.circular(30)),
  ),
  margin: EdgeInsets.all(10.0),
  padding: EdgeInsets.all(5.0),
  width: MediaQuery.of(context).size.width * 0.30,
  child: Center(
    child: DropdownButton(
      items: _dropdownValues.map((value) => DropdownMenuItem(child: Text(value), value: value)).toList(),
        onChanged: (String value) {
          setState(() {
            _currentlySelected = value;
          });
        },
      isExpanded: false,
      value: _currentlySelected,
    )
  )
);

设计：

Answer 1

另一种选择是使用DropdownButton的下划线构造函数并将颜色设置为透明。

underline: Container(color: Colors.transparent),

在您的情况下：

child: DropdownButton(
    items: _dropdownValues.map((value) => DropdownMenuItem(child: Text(value), value: value)).toList(),
    onChanged: (String value) {
    setState(() {
        _currentlySelected = value;
    });
    },
    isExpanded: false,
    underline: Container(color: Colors.transparent),
    value: _currentlySelected,
)

Answer 2

我设法找到答案。 Flutter的DropdownButtonHideUnderline非常有用。我只是将DropdownButton包装在DropdownButtonHideUnderline中。

代码：

return Container(
    decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(Radius.circular(30)),
    ),
    margin: EdgeInsets.all(10.0),
    padding: EdgeInsets.all(5.0),
    width: MediaQuery.of(context).size.width * 0.30,
    child: Center(
        child: DropdownButtonHideUnderline(
            child: DropdownButton(
                items: _dropdownValues.map((value) => DropdownMenuItem(child: Text(value), value: value)).toList(),
                onChanged: (String value) {
                setState(() {
                    _currentlySelected = value;
                });
                },
                isExpanded: false,
                value: _currentlySelected,
            )
        )
    )
);

Flutter从DropDropdownButton删除底部的下划线

2 个答案: