flutter - 如何根据 Flutter 中来自服务器的 List 更改 modalBottomSheet 的状态?
问题描述
我有一个 modalBottomSheet,它显示了两个 CupertinoPicker,一个是日期选择器,另一个是小时选择器。I want to reach this effect: when date is changed in the picker, I send a request to server to check if there are available hours on that date, if yes, the picker on the right should show only those hours which are available, if没有可用的时间,它应该显示一个文本。我尝试使用 StatefulBuilder 来设置 modalBottomSheet 的状态,但是一旦列表变为空,它就不会填满,并且显示的时间不是我现在所在日期的时间,而是前一个时间。
showUniversalPicker() {
_selectedTime = 'ВСЕ';
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return StatefulBuilder(
builder: (
BuildContext context,
StateSetter setSheetState,
) {
return Container(
height: 300,
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
CupertinoButton(
child: Text(
'Отменить',
style: TextStyle(color: Colors.grey),
),
onPressed: () {
Navigator.of(context).pop();
},
),
Row(
children: [
CupertinoButton(
child: Text(
'Подтвердить',
style: TextStyle(color: Colors.blue),
),
onPressed: () {
setState(() {
_date = DateTime(
_selectedDate.year,
_selectedDate.month,
_selectedDate.day,
_selectedTime == 'ВСЕ'
? 00
: int.parse(_selectedTime),
);
});
print(_selectedTime);
_calendarController.setSelectedDay(_date);
Navigator.of(context).pop();
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => ChooseVideo(
date: _date,
wholeDay:
_selectedTime == "ВСЕ" ? true : false,
),
),
);
},
),
],
),
],
),
Container(
height: 200.0,
child: Flex(
direction: Axis.horizontal,
children: <Widget>[
Flexible(
flex: 8,
child: CupertinoDatePicker(
// minuteInterval: 1,
mode: CupertinoDatePickerMode.date,
initialDateTime: _date,
onDateTimeChanged: (DateTime dateTime) {
// setState(() {
// setModalSheetState = setSheetState;
// });
// debugger();
setState(() {
_selectedDate = dateTime;
});
// _timeList.clear();
// setSheetState(() {
// _timeList.add("ВСЕ");
// getHours();
// for (int i = 0; i < 24; i++) {
// if (_hours.contains(
// i.toString().padLeft(2, '0'))) {
// _timeList.add(
// i.toString().padLeft(2, '0'),
// );
// }
// }
// });
// setTimeList();
},
),
),
Flexible(
flex: 2,
child: CupertinoPicker(
itemExtent: 38,
magnification: 0.95,
useMagnifier: true,
// looping: true,
onSelectedItemChanged: (int index) {
setState(() {
_selectedTime = _timeList[index];
});
},
children: _timeList
.map(
(item) => Center(
child: Text(
item,
style: TextStyle(
fontSize: 20,
),
),
),
)
.toList()),
),
],
),
),
],
),
);
},
);
});
}
这是我现在使用的代码的一部分。