Category / Section
How to update blackout dates using onViewChanged callback in the Flutter Calendar
1 min read
In the Flutter Event Calendar, you can dynamically update blackoutDates by using onViewChanged callback of the calendar.
Inside the state initialize the default values for calendar.
List<DateTime>? _blackoutDates = <DateTime>[];
Use the onViewChanged callback to get the first 5 visible dates of the month and add dates to _blackoutDateCollection variable and assign the collection to the _blackoutDates variable.
void viewChanged(ViewChangedDetails viewChangedDetails) {
List<DateTime> _blackoutDateCollection = <DateTime>[];
_blackoutDateCollection.add(viewChangedDetails.visibleDates[0]);
_blackoutDateCollection.add(viewChangedDetails.visibleDates[1]);
_blackoutDateCollection.add(viewChangedDetails.visibleDates[2]);
_blackoutDateCollection.add(viewChangedDetails.visibleDates[3]);
_blackoutDateCollection.add(viewChangedDetails.visibleDates[4]);
SchedulerBinding.instance!.addPostFrameCallback((timeStamp) {
setState(() {
_blackoutDates = _blackoutDateCollection;
});
});
}
Assign _blackoutDates list to the blackoutdates property of the calendar.
child: SfCalendar( view: CalendarView.month, dataSource: _getCalendarDataSource(), allowedViews: [ CalendarView.month, CalendarView.timelineMonth, ], blackoutDates: _blackoutDates, onViewChanged: viewChanged, blackoutDatesTextStyle: TextStyle( color: Colors.red, decoration: TextDecoration.lineThrough), ),
|
