Can anybody help to align verticaly dropdown button with autocomplete field in flutter ? It look's like below :
I was trying many different things but depends on emulator device it's always too tall or too short, or text hint is not verticaly aligned (damn). Here is a code for that:
height: 100.sp,
color: Colors.redAccent,
child: Padding(
padding: const EdgeInsets.only(top: 4, bottom: 4),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
RangeField(),
SizedBox(
width: 10.sp,
),
Container(
width: 250.sp,
decoration: new BoxDecoration(
color: Colors.white,
borderRadius: new BorderRadius.all(
const Radius.circular(5.0)),
),
child: Autocomplete<Polska>(
displayStringForOption: _displayStringForOption,
optionsBuilder:
(TextEditingValue textEditingValue) {
if (textEditingValue.text == '') {
return const Iterable<Polska>.empty();
}
return polska.where((Polska option) {
return option
.toString()
.toLowerCase()
.contains(textEditingValue.text);
});
},
onSelected: (Polska selection) {
city.text = selection.city;
},
fieldViewBuilder: (context, controller,
focusNode, onEditingComplete) {
return TextField(
controller: controller,
focusNode: focusNode,
onEditingComplete: onEditingComplete,
textAlign: TextAlign.center,
textAlignVertical: TextAlignVertical.center,
decoration: InputDecoration(
border: InputBorder.none,
hintText: 'Miasto',
hintStyle: TextStyle(
fontFamily: 'Quicksand',
color: Colors.deepOrange,
fontSize: 30.sp),
),
style: TextStyle(
fontSize: 30.sp,
fontFamily: 'Quicksand',
),
);
},
),
),
SizedBox(
width: 10.sp,
),
Container(
width: 250.sp,
alignment: Alignment.center,
decoration: new BoxDecoration(
color: Colors.white,
borderRadius: new BorderRadius.all(const Radius.circular(5.0))),
child: DropdownButton(
hint: Text("Cena"),
alignment: Alignment.center,
items: [
DropdownMenuItem(
child: Text(" 0zł"),
value: "0",
),
DropdownMenuItem(
child: Text(" 50zł"),
value: "50",
),
DropdownMenuItem(
child: Text(" 100zł"),
value: "100",
),
],
value: priceSelector,
underline: SizedBox(),
onChanged: dropDownCallback,
iconEnabledColor: Colors.deepOrange,
iconSize: 0.sp,
icon: null,
style: TextStyle(
fontFamily: 'QuickSand', color: Colors.deepOrange, fontSize: 30.sp),
),
)
],
),
),
),
I was playing around height value and vertical axis alignment but it seems there is something different wrong with this code.