While DropdownMenuItem is wider than DropdownButton, I found the solution is wrapped with ButtonTheme, but then there always a empty space in front of text, plz check screenshot that I dont know how to remove. So my purpose is simple, make DropdownMenuItem has same width as DropdownButton meanwhile text is left aligned, plz help me.... thank you a lot!
ButtonTheme(
padding: const EdgeInsets.all(0.0), // doesnt work here
alignedDropdown: true,
minWidth: 0,
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
height: 0,
child: DropdownButton<String>(
style: mainTextStyle(textColor: AppColors.mainFontColor),
value: selectedGender,
focusNode: _genderFocusNode,
focusColor: Colors.redAccent,
hint: Text(
'Select your gender',
style:
hintTextStyle(textColor: AppColors.hintFontColor),
),
underline: Container(
height: 1,
color: AppColors.hintFontColor,
),
isExpanded: true,
items: genderItems.map((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
onChanged: (value) => setState(()=>selectedGender = value),
),
),
I dont why there is always a spacing on the left side... has anyone any idea?

