'How to restrict user from selecting past time in Flutter
For example if it's 16:00 then selecting 15:59 or some earlier time from the same day shouldn't be allowed.
Solution 1:[1]
This CustomTimerPicker provide hour and minute on callback, and we can provide initial TimeOfDay else it will use TimeOfDay.now().
Run on dartPad.
class CustomTimerPicker extends StatefulWidget {
late final TimeOfDay intiTime;
final Function(int selectedHour, int selectedMinute) onChanged;
CustomTimerPicker({
Key? key,
required this.onChanged,
TimeOfDay? intiTimeOfDay,
}) : super(key: key) {
intiTime = intiTimeOfDay ?? TimeOfDay.now();
}
@override
State<CustomTimerPicker> createState() => _CustomTimerPickerState();
}
class _CustomTimerPickerState extends State<CustomTimerPicker> {
late int selectedHour;
late int selectedMinutes;
@override
void initState() {
super.initState();
selectedHour = widget.intiTime.hour;
selectedMinutes = widget.intiTime.minute;
}
@override
Widget build(BuildContext context) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
// hour picker
SizedBox(
width: kToolbarHeight,
child: CupertinoPicker(
// backgroundColor: Colors.cyanAccent, //bg Color
itemExtent: 50,
onSelectedItemChanged: (v) {
setState(() {
selectedHour = v + widget.intiTime.hour;
});
widget.onChanged(
selectedHour,
selectedMinutes,
);
},
children: List.generate(
24 - widget.intiTime.hour,
(index) => Center(
child: Text(
"${index + widget.intiTime.hour}",
textAlign: TextAlign.center,
),
),
),
),
),
//minute Picker
SizedBox(
width: kToolbarHeight,
child: CupertinoPicker(
itemExtent: 50,
onSelectedItemChanged: (v) {
setState(() {
selectedMinutes = v + widget.intiTime.minute;
});
widget.onChanged(
selectedHour,
selectedMinutes,
);
},
children: List.generate(
60 - widget.intiTime.minute,
(index) => Center(
child: Text(
"${index + widget.intiTime.minute}",
textAlign: TextAlign.center,
),
),
),
),
),
],
);
}
}
And use this widget providing height
SizedBox(
height: 200,
child: CustomTimerPicker(
// intiTimeOfDay: TimeOfDay(hour: 3, minute: 4),
onChanged: (selectedHour, selectedMinute) {
setState(() {
h = selectedHour;
m = selectedMinute;
});
debugPrint("H: $selectedHour minute: $selectedMinute");
},
),
),
Solution 2:[2]
You should check in the options of whichever component you are using.
For instance for flutter_datetime_picker package, there is a property minTime that you could set at the current date time to prevent selecting a past time.
TextButton(
onPressed: () {
DatePicker.showDatePicker(
context,
minTime: DateTime.now(),
maxTime: DateTime(2030, 12, 31),
onChanged: (date) {
print('change $date');
},
currentTime: DateTime.now(),
);
},
child: Text(
'Show Time Picker',
),
);
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Yeasin Sheikh |
| Solution 2 | Charles Rostaing |
