---
title: "What’s New in 2021 Volume 1: Flutter Event Calendar"
published_at: "2021-04-13T11:13:54+00:00"
modified_at: "2025-03-20T09:43:22+00:00"
url: "https://www.syncfusion.com/blogs/post/whats-new-in-2021-volume-1-flutter-event-calendar"
excerpt: "The Syncfusion Flutter event Calendar has seven built-in, configurable view modes that provide basic functionalities for scheduling, managing, and representing appointments efficiently. This calendar widget exposes a clean and convenient user interface for custom working days and working hours, and..."
taxonomy_category:
  - "Desktop"
  - "Flutter"
  - "Mobile"
  - "UI"
  - "Web"
  - "What's new"
taxonomy_post_tag:
  - "Event Calendar"
  - "Flutter"
  - "Mobile"
  - "productivity"
  - "Web"
---

# What’s New in 2021 Volume 1: Flutter Event Calendar

[Nijamudeen](https://www.syncfusion.com/blogs/author/nijamudeensulaiman)

![What’s New in 2021 Volume 1: Flutter Event Calendar](https://www.syncfusion.com/blogs/wp-content/uploads/2021/04/Whats-New-in-2021-Volume-1-Flutter-Event-Calendar.png)


The Syncfusion [Flutter event Calendar](https://www.syncfusion.com/flutter-widgets/flutter-calendar)
 has seven built-in, configurable view modes that provide basic functionalities for scheduling, managing, and representing appointments efficiently. This calendar widget exposes a clean and convenient user interface for custom working days and working hours, and basic calendar operations such as date navigation and selection. In this blog, we will explain the following new features included in our Flutter Calendar in the [2021 Volume 1 release](https://www.syncfusion.com/forums/164043/essential-studio-2021-volume-1-release-v19-1-0-54-is-available-for-download)
:

- [Load more data on demand](#load-more-data-on-demand)
- [View navigation mode](#view-navigation-mode)
- [Current time indicator](#current-time-indicator)
- [Header date format](#header-date-format)

## Load more data on demand

Load appointments on demand whenever a user switches from one view to another or scrolls to the start or end position of the schedule view. This feature loads appointments on demand for the visible date range with a loading indicator. This improves the loading performance of appointments ranging multiple years.

Refer to the following code example.

```
@override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SfCalendar(
            controller: _controller,
            loadMoreWidgetBuilder:
                (BuildContext context, CalendarLoadMoreCallback loadMoreAppointments) {
                  return FutureBuilder<String>(
                   initialData: 'loading',
                   future: loadMoreAppointments(),
                   builder: (context, snapShot) {
                    return Container(
                        height: _controller.view == CalendarView.schedule ? 50 : double.infinity,
                        width: double.infinity,
                        color: Colors.white38,
                        alignment: Alignment.center,
                        child: CircularProgressIndicator(
                            valueColor:
                                AlwaysStoppedAnimation(Colors.deepPurple)));
                   },
                 );
              },
            dataSource: _dataSource),
      ),
    );
  }
```

![Loading more data on demand in Flutter event Calendar](https://www.syncfusion.com/blogs/wp-content/uploads/2021/04/Loading-more-data-on-demand-in-Flutter-event-Calendar.gif)

Loading more data on demand in Flutter Calendar

## View navigation mode

Now, you can easily customize the swipe navigation through the **viewNavigationMode** property. This feature allows us to enable or disable the swipe interaction in the Calendar widget.

Refer to the following code example.

```
@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SfCalendar(
         view: CalendarView.day,
        viewNavigationMode: ViewNavigationMode.none,
    ),);
  }
```

## Current time indicator

In the Flutter event Calendar, you can now display an indicator of the current time of day by setting the **showCurrentTimeIndicator** property to true .

Refer to the following code example.

```
@override
Widget build(BuildContext context) {
    return Container(
      child: SfCalendar(
        view: CalendarView.day,
        showCurrentTimeIndicator: true,
              ),
  );
  }
```

![Current time indicator in Flutter Calendar](https://www.syncfusion.com/blogs/wp-content/uploads/2021/04/Current-time-indicator-in-Flutter-Calendar.png)

Current time indicator in Flutter Calendar

## Header date format

Now, you can customize the date format in the header by using the **headerDateFormat** property.

Refer to the code example.

```
@override
  Widget build(BuildContext context) {
    return Scaffold(appBar: AppBar(title: Text('Calendar'),),
      body: SfCalendar(
        view: CalendarView.month,
        headerDateFormat: 'MMM,yyy',
      ),
    );
  }
}
```

![Custom header date format in Flutter event Calendar](https://www.syncfusion.com/blogs/wp-content/uploads/2021/04/Custom-header-date-format-in-Flutter-event-Calendar.png)

Custom header date format in Flutter event Calendar

## Conclusion

In this blog post, we walked through the new features in our [Flutter event Calendar](https://www.syncfusion.com/flutter-widgets/flutter-calendar)
 available in the [2021 Volume 1](https://www.syncfusion.com/forums/164043/essential-studio-2021-volume-1-release-v19-1-0-54-is-available-for-download)
 release. To see all the updates in this release, please check our [release notes](https://help.syncfusion.com/flutter/release-notes/v19.1.0.54?type=all)
 and [What’s New](https://www.syncfusion.com/products/whatsnew)
 pages. Try out these new features and leave your feedback in the comments section below!

You can also explore other features in the [Calendar widget’s documentation](https://help.syncfusion.com/flutter/calendar/getting-started)
, where you can find detailed explanations of each feature along with code examples.

For current customers, the newest version is available for download from the [License and Downloads](https://www.syncfusion.com/account/downloads)
 page. If you are not yet a Syncfusion customer, you can try our 30-day [free trial](https://www.syncfusion.com/downloads)
 to check out the available features.

We also encourage you to try out our [Flutter project demos](https://github.com/syncfusion/flutter-examples)
. You can contact us through our [support forums](https://www.syncfusion.com/forums)
, [Direct-Trac](https://www.syncfusion.com/account/login)
 or [feedback portal](https://www.syncfusion.com/feedback/home)
. We are always happy to assist you!

## Related blogs

- [What’s New in 2021 Volume 1: Flutter](https://www.syncfusion.com/blogs/post/whats-new-in-2021-volume-1-flutter.aspx)
- [API Breaking Changes in Flutter DataGrid in 2021 Volume 1](https://www.syncfusion.com/blogs/post/api-breaking-changes-in-flutter-datagrid-in-2021-volume-1.aspx)
- [5 Things Every Developer Must Know About Flutter 2](https://www.syncfusion.com/blogs/post/5-things-every-developer-must-know-about-flutter-2.aspx)
- [How to Create a Scheduling Application Using Flutter Event Calendar](https://www.syncfusion.com/blogs/post/how-to-create-a-scheduling-application-using-flutter-event-calendar.aspx)