Visual Elements in Scheduler for .NET MAUI

• Apr 12, 2024
• 8 minutes to read

This document lists the visual elements in scheduler views.

All-Day Area

Specific to the Day View, Work-Week View, Week View.

The All-Day Area consists of cells and shows appointments for a day or several days:

1. All-Day Area
2. All-Day Appointment
3. All-Day Cell

The following settings manage this element:

Property	Description
MaxAllDayAppointmentRowCount	Gets or sets the maximum number of rows that the view allocates for all-day appointments. This is a bindable property.

All-Day Appointment

Specific to the Day View, Work-Week View, Week View.

The All-Day Appointment represents a scheduled activity that lasts 24 hours or longer. The scheduler displays these appointments in the all-day area that is below Header Items, above day view cells. An AppointmentItem object stores a Start and End dates, a Label, and a Subject, that characterize the appointment.

The View provides the following settings that manage the all-day appointment’s appearance:

The table below lists View properties that configure all-day appointments:

Property	Description
AllDayAppointmentAppearance	Gets or sets the appearance settings of all-day appointments. This is a bindable property.
AllDayAppointmentTemplate	Gets or sets a data template that is used to display all-day appointments. This is a bindable property.
AllDayAppointmentHeight	Gets or sets the height of all-day appointments in the View. This is a bindable property.

All Day Area Cell

Specific to the Day View, Work-Week View, Week View.

The All Day Area Cell is an element of the all-day area‘s grid and represents a day interval in the View. Cells visually align scheduled all-day appointments. The View displays the following cell types:

1. Regular All-Day Area Cell
2. Today All-Day Cell

The View provides the following settings that manage the all-day cell’s appearance:

The table below contains View properties that customize all-day cells:

Property	Description
AllDayCellAppearance	Gets or sets the appearance settings of all-day cells. This is a bindable property.
AllDayCellTemplate	Gets or sets a data template that is used to display the all-day cells. This is a bindable property.

Appointment

Specific to the Day View, Work-Week View, Week View, Month View.

The Appointment is an activity scheduled for a specific time interval. An AppointmentItem object stores a Start and End dates, a Label, and a Subject, that characterize the appointment.

The View provides the following settings that manage the appointment’s appearance:

The table below lists View properties that configure appointments:

Property	Description
AppointmentAppearance	Gets or sets appearance settings of appointments. This is a bindable property.
AppointmentTemplate	Gets or sets a data template that specifies the representation of appointments. This is a bindable property.
AppointmentMinHeight	Gets or sets the minimum height of appointments in the View. This is a bindable property.

Day View Cell

Specific to the Day View, Work-Week View, Week View.

The Day View Cell is an element of the scheduler day grid and represents a time interval in the View. Cells visually align scheduled appointments. Views display the following cell types:

1. TimeScaleInterval defines scale intervals into which the time ruler splits a time interval (the whole day or WorkTime only). Slots divide intervals into cells (2, 3). The TimeScaleSlotCount property specifies the number of slots within a scale interval.
2. Interval Day View Cell - a cell that corresponds to the first slot in a scale interval.
3. Slot Day View Cell - all other cells.
4. Work Time Day View Cell - a cell within the WorkTime interval. These cells can be either Interval or Slot.
5. Today Time Day View Cell. These cells can be either Interval or Slot.

The View provides the following options that configure the day view cell’s appearance:

The table below lists View properties that manage cells:

Property	Description
CellAppearance	Gets or sets appearance settings of cells. This is a bindable property.
CellTemplate	Gets or sets a data template that specifies the representation of cells. This is a bindable property.
CellMinHeight	Gets or sets the minimum height of cells. This is a bindable property.

Day View Header Item

Specific to the Day View, Work-Week View, Week View.

Header Items identify days in the View. Views support the following types of headers:

1. Regular Header Item
2. Today Header Item

The View provides the following options that configure the header’s appearance:

The table below lists View properties that manage headers:

Property	Description
HeaderItemAppearance	Gets or sets appearance settings of header items. This is a bindable property.
HeaderItemTemplate	Gets or sets a data template that specifies the representation of header items. This is a bindable property.

Time Ruler

Specific to the Day View, Work-Week View, Week View.

The Time Ruler displays time intervals that the View uses to lay out appointments:

1. Time Ruler
2. Time Ruler Header
3. Time Ruler Cell

The following settings configure this element:

Property	Description
TimeRulerWidth	Gets or sets the width of the time ruler. This is a bindable property.

Time Ruler Header

Specific to the Day View, Work-Week View, Week View.

The Time Ruler Header is an area above time ruler cells in which you can put custom content. The View provides the following options that configure the default header’s appearance:

The table below lists View properties that manage time ruler header:

Property	Description
TimeRulerHeaderAppearance	Gets or sets appearance settings of time ruler cells. This is a bindable property.
TimeRulerHeaderTemplate	Gets or sets a data template that that specifies the representation of time ruler cells. This is a bindable property.

Time Ruler Cell

Specific to the Day View, Work-Week View, Week View.

The Time Ruler Cell represents a time unit in the View. The time ruler holds cells the view shows. Views support the following types of cells:

1. TimeScaleInterval defines scale intervals into which the time ruler splits a time interval (the whole day or WorkTime only). Slots divide intervals into cells (2, 3). The TimeScaleSlotCount property specifies the number of slots within a scale interval.
2. Interval Time Ruler Cell - a cell that corresponds to the first slot in a scale interval.
3. Slot Time Ruler Cell - all other cells.

The View provides the following options that configure the cell’s appearance:

The table below lists View properties that manage time ruler cells:

Property	Description
TimeRulerCellAppearance	Gets or sets appearance settings of time ruler cells. This is a bindable property.
TimeRulerCellTemplate	Gets or sets a data template that that specifies the representation of time ruler cells. This is a bindable property.

Month View Cell

Specific to the Month View.

The Month View Cell is an element that represents a time interval (day) in the Month View. Cells visually align scheduled appointments. The Month View displays the following cell types:

1. Cell
2. First Day of the Month Cell
3. Today Cell

This view model provides the following settings that you can customize:

The table below lists View properties that manage cells:

Property	Description
CellAppearance	Gets or sets the apperance properties of the month view’s cells. This is a bindable property.
CellTemplate	Gets or sets a data template that specifies the View the Month View uses to show cells. This is a bindable property.

Month View Header Item

Specific to the Month View.

Header Items identify days in the View. The Month View supports the following types of headers:

1. Regular Header Item
2. Today Header Item

The View provides the following options that configure the header’s appearance:

The table below lists View properties that manage headers:

Property	Description
HeaderItemAppearance	Gets or sets the apperance properties of the month view’s headers. This is a bindable property.
HeaderItemTemplate	Gets or sets a data template that specifies the View the Month View uses to show header items. This is a bindable property.

Agenda View Appointment

Specific to the Agenda View.

An Agenda Appointment is a scheduled activity displayed within an Agenda view. You can use AppointmentViewModel object to access appointment data including text, label, displayed time, and appearance properties.

The View includes the following settings that specify appointment appearance:

The table below lists View properties that configure appointments:

Property	Description
AppointmentAppearance	Gets or sets appearance settings of AgendaView appointments. This is a bindable property.
AppointmentTemplate	Gets or sets a data template that specifies the AgendaView uses to show appointments. This is a bindable property.
AppointmentIntervalStringFormat	Gets or sets the format string the AgendaView appointments use to display the day text. This is a bindable property.

Agenda View Header Item

Specific to the Agenda View.

Header Items identify days in the Agenda view. You can use AgendaHeaderItemViewModel object to access related date.

The View includes the following options that configure header appearance:

Property	Description
HeaderItemTemplate	Gets or sets a data template that specifies the AgendaView uses to show headers. This is a bindable property.
AgendaHeaderTemplateSelector	The template selector that chooses a view template based on the passed view model.