backgroundColor property

Color? backgroundColor

The background color to fill the background of the SfCalendar month agenda view.

Defaults to null.

Using a SfCalendarTheme gives more fine-grained control over the appearance of various components of the calendar.

See also:

• appointmentTextStyle, which used to customize the text on the agenda view of calendar.
• dateTextStyle, which used to customize the date text in the agenda view of calendar.
• dayTextStyle, which used to customize the day text in the agenda view of calendar.
• Knowledge base: How to customize the agenda view appointment
• Knowledge base: How to show a custom agenda view

Widget build(BuildContext context) {
return Container(
   child: SfCalendar(
     view: CalendarView.month,
     monthViewSettings: MonthViewSettings(
         dayFormat: 'EEE',
         numberOfWeeksInView: 4,
         appointmentDisplayCount: 2,
         appointmentDisplayMode: MonthAppointmentDisplayMode.appointment,
         showAgenda: true,
         navigationDirection: MonthNavigationDirection.horizontal,
         agendaStyle: AgendaStyle(
             backgroundColor: Colors.transparent,
            appointmentTextStyle: TextStyle(
                 color: Colors.white,
                 fontSize: 13,
                 fontStyle: FontStyle.italic
             ),
             dayTextStyle: TextStyle(color: Colors.red,
                 fontSize: 13,
                 fontStyle: FontStyle.italic),
             dateTextStyle: TextStyle(color: Colors.red,
                 fontSize: 25,
                 fontWeight: FontWeight.bold,
                 fontStyle: FontStyle.normal)
        )),
     ),
   );
}

Implementation

final Color? backgroundColor;