Flutter Event Calendar (SfCalendar) Overview

21 Oct 20222 minutes to read

The Syncfusion Flutter Calendar library was written natively in Dart and has nine types of built-in configurable view modes that provide basic functionality for scheduling, managing, and representing appointments efficiently. The Calendar Widget exposes a clean and convenient user interface for custom working days and hours and basic calendar operations such as date navigation and selection.

Calendar overview

Key features

  • Multiple calendar views: A wide range of built-in view modes are available: day, week, workweek, month, schedule, timeline day, timeline week, timeline workweek. The control allows you to conveniently customize every view with unique, view-specific options.

Multiple calendar views

  • Appointments: Appointments contain information on events scheduled at specific times. In addition to default appointments, users can use their own collections to connect a business entity to an appointment by mapping their fields, such as start time, end time, subject, notes, and recurrence.

Calendar appointments

  • Recurring appointments: Easily configure recurring events to be repeated on a daily, weekly, monthly, or yearly basis with optimized recurrence options. You can also skip or change the occurrence of a recurring appointment.

Recurring appointments

  • Time zone: Regardless of the time zone in your device, Calendar supports setting any required time zone for the control itself, as well as individual events.

Calendar timezone

  • Schedule view: Show a list of scheduled appointments grouped by week, between set minimum and maximum dates, with the schedule view. You can customize everything from the date and time formats to the styling of each header.

Schedule view

  • Timeline month view: Display appointments across the multiple days of a month on a horizontal axis where each column represents a single day.

Timeline month view

  • Resource view: Display the appointments of each resource in a discrete timeline view to enhance viewability.

Resource view

  • Special time regions: Disable interactions and selections for specific time ranges. This is useful when you want to block user interaction during holidays or another special events and to highlight those time slots.
    Calendar time regions

  • Flexible working days: Customize the work days in a workweek so that the remaining days will be hidden from view.

Flexible working days

  • First day of the week: Customize the first day of the week as needed. The default is Sunday.

First day of week

  • Blackout dates: Disable any date in a month and timeline month view of a calendar to make it inactive. You can easily prevent the selection of weekends by disabling them.

Blackout dates

  • Hide leading and trailing dates: Hide the next month and previous month dates in the calendar to enhance the appearance.

Hide leading trailing dates

  • Month agenda view: Display appointments in a list as shown in the following month view by clicking on a day.

Month agenda view

  • Appearance customization: Provide a uniform and consistent look with Calendar’s flexible appearance and format.
    Appearance customization
  • Custom start and end hours: Display the event calendar timeslot views with specific time durations by hiding the unwanted hours.
  • Web layout: The web layout improved for a better experience, and now, the mouse hovering effect has been applied to all the calendar elements.