Callbacks in Flutter Event Calendar (SfCalendar)

2 Jul 20214 minutes to read

Calendar supports the ViewChangedCallback and CalendarTapCallback to interact with Flutter calendar.

View changed callback

The onViewChanged callback triggers when the current view of calendar changed, that is view swiped to previous /next view, calendar view switched to another calendar view.

visibleDates - returns the current view visible dates collection.

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      body: Container(
        child: SfCalendar(
          view: CalendarView.week,
          onViewChanged: (ViewChangedDetails details) {
            List<DateTime> dates = details.visibleDates;
          },
        ),
      ),
    ),
  );
}

NOTE

  • Initially, the onViewChanged callback would be triggered to load the appointment data on the basis of visible dates.

Calendar tap callback

The onTapUp callback triggers whenever the calendar tapped.

date - returns the selected date.
appointments - returns the selected appointments.
targetElement - returns the element tapped.

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      body: Container(
        child: SfCalendar(
          view: CalendarView.week,
          onTap: (CalendarTapDetails details) {
            dynamic appointment = details.appointments;
            DateTime date = details.date!;
            CalendarElement element = details.targetElement;
          },
        ),
      ),
    ),
  );
}

NOTE

  • For recurrence appointment, the tap details will always return as Appointment, even for the custom business object.

Long press callback

The onLongPress callback is called, whenever the SfCalendar elements are long pressed on view.

The long-pressed date, appointments, and element details when the long-press action performed on element available in the CalendarLongPressDetails.

date - returns the long-pressed date.
appointments - returns the long-pressed appointments.
targetElement - returns the long-pressed calendar element.

@override
Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Container(
      child: SfCalendar(
        view: CalendarView.week,
        onLongPress: (CalendarLongPressDetails details) {
          DateTime date = details.date!;
          dynamic appointments = details.appointments;
          CalendarElement view = details.targetElement;
        },
      ),
    )));
  }

NOTE

  • For recurrence appointment, the long pressed details will always return as Appointment, even for the custom business object.

See also