我试图让DropdownButton
提示、文本和菜单项显示在中间而不是左边,但TextAlign.center
似乎没有做任何事情。
带有提示的下拉列表的图像:
以文本形式显示选定项的下拉列表的图像:
按下箭头时的菜单项图像:
我的代码:
return Theme(
data: ThemeData(canvasColor: blackTrans2, brightness: Brightness.dark),
child:Container(
width: MediaQuery.of(context).size.width/1.2,
decoration: BoxDecoration(
color: blackTrans,
borderRadius: BorderRadius.all(Radius.circular(5.0)),
),
child:DropdownButtonHideUnderline(
child: ButtonTheme(
alignedDropdown: true,
child: DropdownButton(
value: _dateSelected,
hint: AutoSizeText(NA_FLIGHT_PAGE_DROPDOWN, style: TextStyle(color: white,),textAlign: TextAlign.center,),
isDense: false,
onChanged: (String newValue){
setState(() {
_dateSelected = newValue;
});
},
items: snapshot.data.documents.map((DocumentSnapshot document){
return DropdownMenuItem<String>(
value: document.documentID,
child: AutoSizeText(document.documentID, style: TextStyle(color: white,),textAlign: TextAlign.center,),
);
}).toList(),
),
),
)
)
);
不确定这是否会影响任何东西,但我使用 AutoSizeText 来动态调整文本大小。
**更新:**我使用Center
设法使菜单项显示在中心,但即使使用Center
,文本和提示仍然保留在左侧...:
// Does not seem to change the hint or text position (when menu item selected)
hint: Center(child:AutoSizeText(NA_FLIGHT_PAGE_DROPDOWN, style: TextStyle(color: white,),textAlign: TextAlign.center,)),
// Changes the menu item to the center instead of left
child: Center(child:AutoSizeText(document.documentID, style: TextStyle(color: white,),textAlign: TextAlign.center,)),
6条答案
按热度按时间5n0oy7gb1#
对于那些看到选项来改变flutter类的人***dropdown.dart***。你不需要这样做。这样做:
1.将属性***已扩展*设置为true***
1.将居中小部件与下拉菜单项类子项一起使用。
IsExpanded也会处理溢出。
hc8w905p2#
一个简单直接的答案是不可能。但总有办法的。
如果你在
DrpoDownMenuItem
类上使用VSCodeCtrl+Click
,你必须转到flutter包提供的dart下拉菜单,并更改下面的代码。将
alignment: AlignmentDirectional.centerStart
更改为alignment: AlignmentDirectional.center
,它应该可以工作:)6psbrbz93#
是的,您可以像下面的代码示例那样执行此操作。
在这里我用我的颜色和装饰意见为我的porpose你可以改变它根据您的要求。
xiozqbni4#
您可以使用下面的代码来完美地将下拉列表中的文本定位在中心位置,同时仍然将下拉列表图标定位在容器的右端。
因此,我们只需添加isExpanded:true,并将Center()小工具添加到下拉菜单项()中的文本(项)。
ugmeyewa5#
DropdownMenuItem
类中有一个alignment
属性。如果你想改变它的宽度包裹
DropdownButton
与SizedBox
或Padding
。6ioyuze26#
在下拉按钮窗体字段或下拉按钮中添加已扩展:真的,
像这样的事情
下拉按钮窗体字段(已展开:正确,)