My solution is to add alignment to dropdownMenuItem
DropdownButton<String>(
isExpanded: true,
elevation: 0,
underline: const SizedBox(),
value: controller.selectedItem.value.itemCode,
// Placeholder text
items: controller.testItems.map((var item) {
return DropdownMenuItem<String>(
alignment: Alignment.centerRight,
value: item.itemCode,
child: Text("${item.itemCode}"),
);
}).toList(),
onChanged: (String? val) {
var selected = controller.testItems
.firstWhere((w) => w.itemCode == val);
controller.onSlnoItemSelected(selected);
}
//controller.onGsmCntryChanged(val!),
))
],
This worked for me:
List<String> targetOptions = ['No target', '1', '2', '3', '4'];
return DropdownButton<String>(
value: target,
selectedItemBuilder: (BuildContext context) {
return targetOptions.map<Widget>((String item) {
return SizedBox(width: 70, child: Center(child: Text(item, style: TextStyle(color: Colors.white))));
}).toList();
},
items: targetOptions.map((String value) {
return new DropdownMenuItem<String>(
value: value == 'No target' ? '0' : value,
child: Center(
child: new Text(
value,
style: TextStyle(color: Colors.white),
),
),
);
}).toList(),
onChanged: (val) {
SettingManager.put(SettingManager.SETTING_DAILY_TARGET, val);
setState(() {
target = val;
});
},
)