I have created two dropdown buttons in my Flutter app, and I want them to look the same. Problem the text inside the hint of the second dropdown button is not showing correctly, creating a visual difference. How can I make sure the text in the second dropdown button aligns properly and looks like the first one?
First DropDownButton Widget Code:
DropdownButtonFormField<String>(
isExpanded: true,
decoration: InputDecoration(
hoverColor: Colors.green,
filled: true,
fillColor: CupertinoColors.systemGrey4,
contentPadding:
const EdgeInsets.symmetric(vertical: 12),
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(32),
),
),
hint: Text(
'İşlem Yapılan Hisse Sayısı',
textAlign: TextAlign.center,
style: (buildJosefinSans(0.5, 16)),
),
items: list
.map((item) => DropdownMenuItem<String>(
value: item.toString(),
child: Align(
alignment: Alignment.center,
child: Text(
item.toString(),
textAlign: TextAlign.center,
),
),
))
.toList(),
validator: (value) {
if (value == null) {
return 'İşlem Yapılan Hisse Sayısı';
}
return null;
},
onChanged: (value) {
},
onSaved: (value) {
selectedValue = value.toString();
},
buttonStyleData: const ButtonStyleData(
padding: EdgeInsets.only(right: 8),
),
iconStyleData: const IconStyleData(
icon: Icon(
Icons.keyboard_arrow_down_sharp,
color: Colors.black,
),
iconSize: 32,
),
dropdownStyleData: DropdownStyleData(
decoration: BoxDecoration(
color: CupertinoColors.systemGrey5,
borderRadius: BorderRadius.circular(15),
),
),
menuItemStyleData: const MenuItemStyleData(
padding: EdgeInsets.symmetric(horizontal: 16),
),
)
Second DropDownButton Widget Code:
DropdownButtonFormField2<int>(
isExpanded: true,
decoration: InputDecoration(
hoverColor: Colors.green,
contentPadding: const EdgeInsets.symmetric(vertical: 16),
filled: true,
fillColor: CupertinoColors.systemGrey4,
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.circular(32),
),
isDense: true,
),
value: buyDropDownValue,
icon: Icon(
Icons.keyboard_arrow_down_sharp,
color: Colors.black,
size: 32,
),
elevation: 16,
style: (buildJosefinSans(0.5, 16)),
onChanged: (int? value) {
setState(() {
buyDropDownValue = value!;
bDropDownValue = buyDropDownValue!;
});
},
hint: Padding(
padding: EdgeInsets.fromLTRB(phoneWidth * 0.05, 0, 0, 0),
child: Text(
'Satın Alınan Hisse Sayısı',
textAlign: TextAlign.center,
style: buildJosefinSans(0.5, 16),
),
),
items: list.map<DropdownMenuItem<int>>((int value) {
return DropdownMenuItem<int>(
alignment: Alignment.center,
value: value,
child: Text(value.toString(), textAlign: TextAlign.center,),
);
}).toList(),
dropdownColor: CupertinoColors.systemGrey5,
borderRadius: BorderRadius.circular(15),
)