Flutter CupertinoDatePicker time mode 24hour format: disable range between 00:00 and 09:00?

Question

I have this CupertinoDatePicker set in time mode with 24h format and 15 minute interval:

                   CupertinoDatePicker(
                      use24hFormat: true,
                      mode: CupertinoDatePickerMode.time,
                      minuteInterval: 15,
                      initialDateTime: currentDate,
                      minimumDate: DateTime(currentDate.year, currentDate.month,
                          currentDate.day, minHours, minMinutes),
                      maximumDate: DateTime(currentDate.year, currentDate.month,
                          currentDate.day + nextDay, maxHours, maxMinutes),
                      onDateTimeChanged: (DateTime newDateTime) {
                        currentDate = newDateTime;
                      }
                     )

I set the initial date to currentDate which is defined as follows:

DateTime currentDate =
        DateTime(1900, 1, 1, currentHour, currentMinute);

where currentHour and currentMinute are two variables that I pass in this function. In the function before displaying the DatePicker, I also calculate minHours, minMinutes and maxHours and maxMinutes, that should limit the range in which user can pick the hours and minutes, done by setting minimumDate and maximumDate of the Picker.

The only BIG problem is that I want to count midnight (so 00:00) as the maximum time in some cases. So for example what if I want to disable between 00:15 and 9:00 but keep 00:00 enabled??

score 0 · Answer 1 · answered Mar 30 '23 at 16:39

To make your idea happen, you need to Customize CupertinoPicker and filter unwanted values:

class GianLuca extends StatefulWidget {
  const GianLuca({Key key}) : super(key: key);

  @override
  State<GianLuca> createState() => _GianLucaState();
}

class _GianLucaState extends State<GianLuca> {
  @override
  Widget build(BuildContext context) {
    List<DateTime> timeSlots = _generateTimeSlots(DateTime(1900, 1, 1, 0, 0), DateTime(1900, 1, 2), 15);
    return  MaterialApp(
      home: Scaffold(
        body: SafeArea(
          child:   CupertinoPicker(
            scrollController: FixedExtentScrollController(initialItem: 0),
            itemExtent: 32.0,
            onSelectedItemChanged: (int index) {
              // Handle selected time
            },
            children: timeSlots.map((time) {
              return Text(
                DateFormat.Hm().format(time),
                style: const TextStyle(fontSize: 20.0),
              );
            }).toList(),
          ),
        ),
      ),
    );
  }

  List<DateTime> _generateTimeSlots(DateTime startDate, DateTime endDate, int minuteInterval) {
    final List<DateTime> timeSlots = [];
    DateTime currentDate = startDate;

    while (currentDate.isBefore(endDate)) {
      if (currentDate.hour >= 9 || (currentDate.hour == 0 && currentDate.minute == 0)) {
        timeSlots.add(currentDate);
      }
      currentDate = currentDate.add(Duration(minutes: minuteInterval));
    }

    return timeSlots;
  }

}

happy coding...

Flutter CupertinoDatePicker time mode 24hour format: disable range between 00:00 and 09:00?

1 Answers1