Apparently, when I add a preffixIcon to a InputDecoration in my DropdownButtonFormField it adds a right padding that I don't know where it comes from.

My code:
Container(
height: 50,
decoration: BoxDecoration(
color: CustomTheme.white,
borderRadius: BorderRadius.circular(10),
),
child: DropdownButtonFormField<dynamic>(
decoration: InputDecoration(
border: OutlineInputBorder(),
prefixIcon: icon != null
? Padding(
padding: const EdgeInsets.all(8),
child: Icon(icon, color: CustomTheme.orange),
)
: null,
),
isDense: true,
iconEnabledColor: CustomTheme.orange,
icon: const Icon(
Icons.keyboard_arrow_down,
),
isExpanded: true,
items: items.map<DropdownMenuItem<dynamic>>(
(dynamic value) {
return DropdownMenuItem<dynamic>(
value: value,
child: Text(
value.name,
overflow: TextOverflow.ellipsis,
style: Theme.of(context).primaryTextTheme.bodySmall!.copyWith(
color: CustomTheme.black,
),
),
);
},
).toList(),
onChanged: onChanged,
value: dropdownValue,
),
);
As a hot fix, I created a row in order to put the icon as a separate widget outside the DropdownButtonFormField, but I'd like to know if there's a way handle this with the InputDecoration widget (or a reason why this happens)