Callbacks in Flutter Date Range Picker (SfDateRangePicker)

20 Oct 20222 minutes to read

Calendar supports the ViewChangedCallback and SelectionChangedCallback to interact with the Flutter date range picker.

View changed callback

The onViewChanged callback triggers when the current view swiped to previous or next view, picker view switched to another picker view.

  • visibleDateRange - returns the start and end dates of the current visible month.
@override
Widget build(BuildContext context) {
  return Scaffold(
    body: SfDateRangePicker(
      view: DateRangePickerView.month,
      onViewChanged: (DateRangePickerViewChangedArgs args) {
        var visibleDates = args.visibleDateRange;
      },
    ),
  );
}

NOTE

Selection changed callback

The onSelectionChanged callback triggers when selecting the dates from the date picker.

  • args.value - returns the dates based on the selection mode.
@override
Widget build(BuildContext context) {
  return Scaffold(
    body: SfDateRangePicker(
      view: DateRangePickerView.month,
      selectionMode: DateRangePickerSelectionMode.range,
      onSelectionChanged: (DateRangePickerSelectionChangedArgs args) {
        if (args.value is PickerDateRange) {
          final DateTime rangeStartDate = args.value.startDate;
          final DateTime rangeEndDate = args.value.endDate;
        } else if (args.value is DateTime) {
          final DateTime selectedDate = args.value;
        } else if (args.value is List<DateTime>) {
          final List<DateTime> selectedDates = args.value;
        } else {
          final List<PickerDateRange> selectedRanges = args.value;
        }
      },
    ),
  );
}