[英]Flutter: How to make dropdownbutton resize according to what was selected
I'm trying to make a dropdown button resize its width according to either what item was selected in the dropdown or the width of the "hint" text.我正在尝试根据下拉菜单中选择的项目或“提示”文本的宽度来调整下拉按钮的宽度。 How can I do this I'm totally lost.
我怎么能这样做我完全迷路了。 The dropdown button is being placed inside of a ListView that is horizontally scrollable.
下拉按钮被放置在可水平滚动的 ListView 内。
class FilterDropdown extends StatelessWidget {
final Text? hint;
final String? value;
final List<DropdownMenuItem<String>>? items;
final Function(String?)? onChanged;
final Key? key;
final IconData? iconData;
FilterDropdown(
{this.key,
this.hint,
this.value,
this.items,
this.onChanged,
this.iconData});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
border: Border.all(color: Colors.white),
borderRadius: BorderRadius.circular(8.0),
color: const Color(0xff161F25),
),
child: Padding(
padding: const EdgeInsets.fromLTRB(21, 0, 21, 0),
child: DropdownButtonHideUnderline(
child: DropdownButton<String>(
selectedItemBuilder: (BuildContext context) {
return items!.map<Widget>((DropdownMenuItem<String> item) {
Text innerWidget = item.child as Text;
return Align(
alignment: Alignment.centerLeft,
child: Text(
innerWidget.data!,
style: TextStyle(color: Colors.white),
)
// style: const TextStyle(color: Colors.white)),
);
}).toList();
},
style: const TextStyle(
color: Colors.black,
fontSize: 16,
),
key: key,
hint: Align(
alignment: Alignment.centerLeft,
child: hint,
),
value: value,
icon: const Icon(Icons.arrow_drop_down),
items: items,
onChanged: onChanged,
)),
));
}
}
Expanded(
child: new Column(
children: <Widget>[
new DropdownButton(
items: [
new DropdownMenuItem(child: new Text("Abc")),
new DropdownMenuItem(child: new Text("Xyz")),
],
hint: new Text("Select City"),
onChanged: null
)
]
),
flex: 1,
)
Use Column使用列
you can do like this:你可以这样做:
Container(
width: MediaQuery.of(context).size.width,
margin: EdgeInsets.only(left: 8, right: 3, top: 0, bottom: 0),
child: DropdownButtonHideUnderline(
child: DropdownButton(
icon: widget.icon,
isExpanded: true,
onChanged: (value) {},
value: 0,
items:
new DropdownMenuItem(child: new Text("1")),
new DropdownMenuItem(child: new Text("2")),
),
),
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.