I have this Dropdown
Widget in a Modal
and I cannot Change the Value in the Widget while I'm using setState
and everytime I change the value, I should close the Modal and then the Value is Changed.
this is my Code:
var chosenRecentDay = 1;
List<int> daysList = [for (var i = 1; i < 31; i++) i];
int defaultDropDownValue = 1;
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return SizedBox(
height: 500.0,
child: Center(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 20.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(
width: 150.0,
height: 45.0,
child: Center(
child: DropdownButton(
value: defaultDropDownValue,
menuMaxHeight: 250.0,
icon: const Icon(
Icons.arrow_drop_down_circle_rounded,
color: Color(0xffF85E63),
),
borderRadius: BorderRadius.circular(30.0),
alignment: Alignment.center,
underline: Container(color: Colors.transparent),
items: daysList
.map<DropdownMenuItem<dynamic>>((dynamic value) {
var convertedList = value.toString();
return DropdownMenuItem<dynamic>(
value: value,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Padding(
padding:
const EdgeInsets.symmetric(horizontal: 5.0),
child: Text(
convertedList,
style: const TextStyle(
color: Color(0xffF85E63),
fontFamily: 'Lalezar',
fontSize: 18.0,
),
),
),
],
),
);
}).toList(),
onChanged: (val) {
setState(() {
defaultDropDownValue = val!;
chosenRecentDay = val;
});
},
),
),
),
],
),
),
),
);
},
);
You are using a modal and the outer setState
doesn't affect the modal after it's created. (It doesn't trigger a rebuild of a modal.)
One solution is to wrap your widget with a StatefulBuilder
like this:
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
// return your widgets here
},
);
},
);
Remember, if you need to update the state of both the parent widget and the modal, you can use different names for the StateSetter
of the StatefulBuilder
and the setState
of the parent widget.