Class SchedulerMonthView

Represents a class which is used to configure all the properties of Month view.

Inheritance

System.Object

SchedulerMonthView

Namespace: Syncfusion.Maui.Scheduler

Assembly: Syncfusion.Maui.Scheduler.dll

Syntax

public class SchedulerMonthView : BindableObject

Constructors

SchedulerMonthView()

Declaration

public SchedulerMonthView()

Fields

AppointmentDisplayModeProperty

Identifies the AppointmentDisplayMode dependency property.

Declaration

public static readonly BindableProperty AppointmentDisplayModeProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for AppointmentDisplayMode dependency property.

AppointmentTemplateProperty

Identifies the AppointmentTemplate dependency property.

Declaration

public static readonly BindableProperty AppointmentTemplateProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for AppointmentTemplate dependency property.

CellStyleProperty

Identifies the CellStyle dependency property.

Declaration

public static readonly BindableProperty CellStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for CellStyle dependency property.

CellTemplateProperty

Identifies the CellTemplate dependency property.

Declaration

public static readonly BindableProperty CellTemplateProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for CellTemplate dependency property.

NumberOfVisibleWeeksProperty

Identifies the NumberOfVisibleWeeks dependency property.

Declaration

public static readonly BindableProperty NumberOfVisibleWeeksProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for NumberOfVisibleWeeks dependency property.

ShowLeadingAndTrailingDatesProperty

Identifies the ShowLeadingAndTrailingDates dependency property.

Declaration

public static readonly BindableProperty ShowLeadingAndTrailingDatesProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowLeadingAndTrailingDates dependency property.

ViewHeaderSettingsProperty

Identifies the ViewHeaderSettings dependency property.

Declaration

public static readonly BindableProperty ViewHeaderSettingsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ViewHeaderSettings dependency property.

ViewHeaderTemplateProperty

Identifies the ViewHeaderTemplate dependency property.

Declaration

public static readonly BindableProperty ViewHeaderTemplateProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ViewHeaderTemplate dependency property.

Properties

AppointmentDisplayMode

Gets or sets a value which defines the appointment display mode for the month cell in SfScheduler.

Declaration

public SchedulerMonthAppointmentDisplayMode AppointmentDisplayMode { get; set; }

Property Value

Type	Description
SchedulerMonthAppointmentDisplayMode	The default value of AppointmentDisplayMode is Text.

Examples

The below examples shows, how to use the AppointmentDisplayMode property of SchedulerMonthView in the SfScheduler.

XAML
C#

 <schedule:SfScheduler x:Name="Scheduler"
                       View="Month" >
    <schedule:SfScheduler.MonthView>
         <schedule:SchedulerMonthView AppointmentDisplayMode="Indicator" />
    </schedule:SfScheduler.MonthView>
</schedule:SfScheduler>

this.Scheduler.View = SchedulerView.Month;
this.Scheduler.MonthView.AppointmentDisplayMode = SchedulerMonthAppointmentDisplayMode.Indicator;

AppointmentTemplate

Gets or sets the appointment template to customize the default UI.

Declaration

public DataTemplate AppointmentTemplate { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.DataTemplate

Remarks

By default, the SchedulerAppointment is set as the BindingContext for AppointmentTemplate for both SchedulerAppointment and custom data object in AppointmentsSource. Custom data object can be bound in AppointmentTemplate by using DataItem. The AppointmentTemplate is applicable only when the AppointmentDisplayMode is set as Text in MonthView. The height of the appointment view will be calculated based on FontSize of the AppointmentTextStyle.

Examples

The following sample used to configure the custom appointments and appointment template.

# [Model.cs](#tab/tabid-8)

public class Meeting
{
    public string EventName { get; set; }
    public DateTime From { get; set; }
    public DateTime To { get; set; }
    public Brush BackgroundBrush { get; set; }
    public string RecurrenceRule { get; set; }
}

# [C#](#tab/tabid-9)

var customAppointments = new ObservableCollection<Meeting>();
var meeting = new Meeting()
{
   EventName = "General Meeting",
   From = new DateTime(2022, 2, 25, 09, 0, 0),
   To = new DateTime(2022, 2, 25, 10, 0, 0),
   BackgroundBrush = Brush.GreenYellow,
};
customAppointments.Add(meeting);
this.scheduler.AppointmentsSource = customAppointments;

# [XAML](#tab/tabid-10)

<ContentPage.Resources>
    <DataTemplate x:Key="appointmentTemplate">
        <Grid Background="{Binding DataItem.BackgroundBrush}">
            <Label Text="{Binding DataItem.EventName}" TextColor="Black"/>
        </Grid>
    </DataTemplate>
</ContentPage.Resources>
<syncfusion:SfScheduler x:Name="scheduler">
<syncfusion:SfScheduler.MonthView>
<syncfusion:SchedulerMonthView AppointmentTemplate="{StaticResource appointmentTemplate}"/>
</syncfusion:SfScheduler.MonthView>
<syncfusion:SfScheduler.AppointmentMapping>
<syncfusion:SchedulerAppointmentMapping
Subject="EventName"
StartTime="From"
EndTime="To"
Background="BackgroundBrush"/>
</syncfusion:SfScheduler.AppointmentMapping>
</syncfusion:SfScheduler>

CellStyle

Gets or sets the style of month cell, that used to customize the background, today background, leading month cell background, trailing month cell background and text color, font, font size, font family, font attributes of normal month cell, leading month cell and trailing month cell.

Declaration

public SchedulerMonthCellStyle CellStyle { get; set; }

Property Value

Type	Description
SchedulerMonthCellStyle

Examples

The below examples shows, how to use the MonthCellStyle of SchedulerMonthView in the SfScheduler.

var textStyle = new SchedulerTextStyle()
{
    TextColor = Colors.DarkBlue,
    FontSize = 14,
};
var leadingMonthTextStyle = new SchedulerTextStyle()
{
    TextColor = Colors.Red,
    FontSize = 14,
};
var trailingMonthTextStyle = new SchedulerTextStyle()
{
    TextColor = Colors.Red,
    FontSize = 14,
};
var monthCellStyle = new SchedulerMonthCellStyle()
{
    Background = Brush.LightSkyBlue,
    TodayBackground = Brush.LightBlue,
    LeadingMonthBackground = Brush.LightGreen,
    TrailingMonthBackground = Brush.LightYellow,
    TextStyle = textStyle,
    LeadingMonthTextStyle = leadingMonthTextStyle,
    TrailingMonthTextStyle = trailingMonthTextStyle
};
this.Scheduler.MonthView.CellStyle = monthCellStyle;

CellTemplate

Gets or sets the month cell template or template selector.

Declaration

public DataTemplate CellTemplate { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.DataTemplate

Remarks

The BindingContext of the CellTemplate is the SchedulerMonthCellDetails. The QueryAppointments and QueryAppointmentsCommand are not applicable while AppointmentDisplayMode is None for Month view.

Examples

The following sample used to configure month cell using the Microsoft.Maui.Controls.DataTemplate.

# [XAML](#tab/tabid-7)

<syncfusion:SfScheduler x:Name="Schedule">
   <syncfusion:SfScheduler.MonthView>
       <syncfusion:SchedulerMonthView>
           <syncfusion:SchedulerMonthView.CellTemplate>
               <DataTemplate>
                  <Border Background = "BlueViolet">
                    <Label HorizontalTextAlignment="Center"
                              TextColor="White" Text="{Binding DateTime.Day}"/>
                  </Border>
               </DataTemplate>
           </syncfusion:SchedulerMonthView.CellTemplate>
       </syncfusion:SchedulerMonthView>
  </syncfusion:SfScheduler.MonthView>
</syncfusion:SfScheduler>

NumberOfVisibleWeeks

Gets or sets the value to customize the number of rows count in the month view. It is applicable for the scheduler's month view.

Declaration

public int NumberOfVisibleWeeks { get; set; }

Property Value

Type	Description
System.Int32	Defaults to `6` .

Remarks

ShowLeadingAndTrailingDates will be applicable when the number of visible weeks value is 6. The number of visible weeks value ranges from 1 to 6. If the value is greater than 6, it will be considered 6. If the value is less than 1, it will be considered 1.

Examples

The below examples shows, how to use the NumberOfVisibleWeeks property of SchedulerMonthView in the SfScheduler.

XAML
C#

 <schedule:SfScheduler x:Name="Scheduler"
                       View="Month" >
    <schedule:SfScheduler.MonthView>
         <schedule:SchedulerMonthView NumberOfVisibleWeeks=6/>
    </schedule:SfScheduler.MonthView>
</schedule:SfScheduler>

this.Scheduler.View = SchedulerView.Month;
this.Scheduler.MonthView.NumberOfVisibleWeeks = 6;

ShowLeadingAndTrailingDates

Gets or sets a value indicating whether to displays the leading and trailing dates in the month view of the SfScheduler.

Declaration

public bool ShowLeadingAndTrailingDates { get; set; }

Property Value

Type	Description
System.Boolean	The default value of ShowLeadingAndTrailingDates is true.

Remarks

The leading and trailing dates are not visible, when the showTrailingAndLeadingDates value is false.

Examples

The below examples shows, how to use the ShowLeadingAndTrailingDates property of SchedulerMonthView in the SfScheduler.

XAML
C#

 <schedule:SfScheduler x:Name="Scheduler"
                       View="Month" >
    <schedule:SfScheduler.MonthView>
         <schedule:SchedulerMonthView ShowLeadingAndTrailingDates = "False" />
    </schedule:SfScheduler.MonthView>
</schedule:SfScheduler>

this.Scheduler.View = SchedulerView.Month;
this.Scheduler.MonthView.ShowLeadingAndTrailingDates = false;

ViewHeaderSettings

Gets or sets properties which allows to customize the view header setting of the Month in the SfScheduler.

Declaration

public SchedulerViewHeaderSettings ViewHeaderSettings { get; set; }

Property Value

Type	Description
SchedulerViewHeaderSettings	The properties settings used to customize the view header setting.

Examples

The below examples shows, how to use the ViewHeaderSettings property of SchedulerMonthView in the SfScheduler.

var dayTextStyle = new SchedulerTextStyle()
{
   TextColor = Colors.DarkBlue,
   FontSize = 14,
};
this.Scheduler.View = SchedulerView.Month;
this.Scheduler.MonthView.ViewHeaderSettings.Background = Brush.LightSkyBlue;
this.Scheduler.MonthView.ViewHeaderSettings.DayFormat = "dd";
this.Scheduler.MonthView.ViewHeaderSettings.DayTextStyle = dayTextStyle;

ViewHeaderTemplate

Gets or sets the month view header template to customize the default UI.

Declaration

public DataTemplate ViewHeaderTemplate { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.DataTemplate

Remarks

The BindingContext of the ViewHeaderTemplate is the System.DateTime. The SelectableDayPredicate, MinimumDateTime, and MaximumDateTime of date and time values can be used directly in data template selector. />.

Examples

The following code used to configure the month view header using the Microsoft.Maui.Controls.DataTemplate.

# [XAML](#tab/tabid-11)

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month">
    <scheduler:SfScheduler.MonthView>
       <scheduler:SchedulerMonthView>
           <scheduler:SchedulerMonthView.ViewHeaderTemplate>
               <DataTemplate>
                   <Grid Background = "lightBlue" >
                       <Label x:Name="label" HorizontalOptions="Center" VerticalOptions="Center" Text="{Binding StringFormat='{0:ddd}'}" TextColor="Red" />
                   </Grid>
               </DataTemplate>
           </scheduler:SchedulerMonthView.ViewHeaderTemplate>
       </scheduler:SchedulerMonthView>
   </scheduler:SfScheduler.MonthView>
</scheduler:SfScheduler>

The following code used to configure the month view header using the Microsoft.Maui.Controls.DataTemplateSelector.

# [DataTemplateSelector](#tab/tabid-12)

public class ViewHeaderTemplateSelector : DataTemplateSelector
{
   public ViewHeaderTemplateSelector()
   {
   }
   public DataTemplate TodayDatesTemplate { get; set; }
   public DataTemplate NormaldatesTemplate { get; set; }
   protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
   {
      var viewHeaderDetails = (DateTime)item;
           if (viewHeaderDetails.DateTime.Month == DateTime.Today.Month)
               return TodayDatesTemplate;
       return NormaldatesTemplate;
   }
}

# [Resources](#tab/tabid-13)

<ContentPage.Resources>
<DataTemplate x:Key="normaldatesTemplate">
     <Grid Background = "lightBlue">
        <Label x:Name="label" HorizontalOptions="Center" VerticalOptions="Center" Text="{Binding StringFormat='{0:ddd}'}"  TextColor="Red" />
     </Grid>
   </DataTemplate>
   <DataTemplate x:Key="todayDatesTemplate">
       <Grid Background = "LightGreen" >
           <Label x:Name="label" HorizontalOptions="Center" VerticalOptions="Center" Text="{Binding StringFormat='{0:ddd}'}"  TextColor="Orange" />
       </Grid>
  </DataTemplate>
 <local:ViewHeaderTemplateSelector x:Key="viewHeaderTemplateSelector"  TodayDatesTemplate="{StaticResource todayDatesTemplate}"  NormaldatesTemplate="{StaticResource normaldatesTemplate}" />
</ContentPage.Resources>

#[MainPage](#tab/tabid-14)

<scheduler:SfScheduler x:Name="Scheduler"
                      View="Month">
   <scheduler:SfScheduler.MonthView>
       <scheduler:SchedulerMonthView ViewHeaderTemplate = "{StaticResource viewHeaderTemplateSelector}"/>
   </scheduler:SfScheduler.MonthView>
</scheduler:SfScheduler>

Class SchedulerMonthView

Inheritance

Namespace: Syncfusion.Maui.Scheduler

Assembly: Syncfusion.Maui.Scheduler.dll

Syntax

Constructors

SchedulerMonthView()

Declaration

Fields

AppointmentDisplayModeProperty

Declaration

Field Value

AppointmentTemplateProperty

Declaration

Field Value

CellStyleProperty

Declaration

Field Value

CellTemplateProperty

Declaration

Field Value

NumberOfVisibleWeeksProperty

Declaration

Field Value

ShowLeadingAndTrailingDatesProperty

Declaration

Field Value

ViewHeaderSettingsProperty

Declaration

Field Value

ViewHeaderTemplateProperty

Declaration

Field Value

Properties

AppointmentDisplayMode

Declaration

Property Value

Examples

See Also

AppointmentTemplate

Declaration

Property Value

Remarks

Examples

CellStyle

Declaration

Property Value

Examples

See Also

CellTemplate

Declaration

Property Value

Remarks

Examples

NumberOfVisibleWeeks

Declaration

Property Value

Remarks

Examples

ShowLeadingAndTrailingDates

Declaration

Property Value

Remarks

Examples

See Also

ViewHeaderSettings

Declaration

Property Value

Examples

ViewHeaderTemplate

Declaration

Property Value

Remarks

Examples