Both the header and content portions of individual days in the Month view of Silverlight Schedule can be customized.

Here is a screen shot of a customization set up to repeat every Sunday:


Customizations are defined via the ViewCustomizations Dependency Property of the CalendarView control. ViewCustomizations is a property of type CalendarViewCustomizations, which in turn has three properties for customizing different aspects of the calendar’s view: GlobalAppointmentViewDefinitions, DayTimeSlotAppearances, and MonthDayAppearances. To customize month day views, use the MonthDayAppearances property. MonthDayAppearances is an ObservableCollection of type MonthDayAppearance.

Note: It is possible to change the header text for all dates in Month view by changing values of the static properties MonthDayHeaderFormat and MonthFirstDayHeaderFormat on class ScheduleSettings (DevComponents.Silverlight.Schedule.) The default values for these format strings are "d " and "ddd d", respectively.

MonthDayAppearance is a DependencyObject with the following dependency properties:

  • Date – Specifies the specific date on which to apply the customizations.
  • RecurrencePattern – Specifies a recurrence pattern. More below.
  • OwnerKey – Specifies the specific owner for which to apply the customizations. The default value is null, which indicates the default owner.
  • Background – Optionally provide a Brush for the background of the day.
  • BorderBrush – Optionally provides a Brush for the border of the day.
  • BorderThickness – Optionally provides a Thickness for the border.
  • ContentTemplate – Specifies a DataTemplate to use for rendering the Content of the Day View. The Content property value is set internally to an instance of CalendarDayViewModel.
  • HeaderTemplate – Specifies a DataTemplate to use for rendering the Header of the Day View. The Header property value is set internally to an instance of CalendarDayViewModel.

Use the OwnerKey property to indicate a specific owner for the customization.

RecurrancePattern is a class for defining simple recurrences. Specify whether the recurrence is daily, weekly, monthly or yearly with the PatternType property. If daily or weekly, specific days are specified using DaysOfWeek property, which is an enum that has Flags attribute set so values can be or’d together. If monthly, a value for StartDate alone indicates a repeating day of the month (i.e. every 23rd day.) Use RelativeDayInMonth to specify whether the repeating day is the first, second, third, fourth or last day of the month. If StartDate is supplied, then day of week is inferred from it. Otherwise, use DaysOfWeek property to specify the specific day or days which are recurring.

Here is an example of a custom month day appearance in which a custom ContentTemplate and HeaderTemplate are applied every weekend day:

<schedule:CalendarViewCustomizations x:Key="CalendarCustomizations">
            <schedule:MonthDayAppearance ContentTemplate="{StaticResource CustomMonthDayContentTemplate}" HeaderTemplate="{StaticResource CustomMonthDayHeaderTemplate}">
                    <schedule:RecurrencePattern PatternType="Daily" DaysOfWeek="WeekendDays" />

This customization is applied to the CalendarView by setting ViewCustomizations property as such:

ViewCustomizations="{StaticResource CalendarCustomizations}"

If you need a custom Month day appearance for a Date which is known only at run time it may be necessary to define it in code. Here is an example of how to do that:

    new MonthDayAppearance 
        Date = DateTime.Now.Date.AddDays(4),
        ContentTemplate = Resources[&quot;CustomMonthDayContentTemplate&quot;],
        HeaderTemplate = Resources[&quot;CustomMonthDayHeaderTemplate&quot;]

The above examples uses the following resources:

<DataTemplate x:Key="CustomMonthDayContentTemplate">
            <controls:BoolToVisibilityConverter x:Key="boolToVisibilityConverter" />
            <ImageBrush ImageSource="images/smileyface.png" Stretch="Fill" Opacity="0.1"  />
        <TextBlock Text="Take the day off!" VerticalAlignment="Bottom" TextWrapping="Wrap" Margin="5" />
        <Border Visibility="{Binding IsActive, Converter={StaticResource boolToVisibilityConverter}, ConverterParameter=Inverse}" controls:DynamicResource.BackgroundKey="MonthWeekInactiveDayBackground" />
        <Border Visibility="{Binding IsSelected, Converter={StaticResource boolToVisibilityConverter}}" controls:DynamicResource.BackgroundKey="MonthWeekSelectionBackground" />
        <Border BorderThickness="0,0,1,1" controls:DynamicResource.BorderBrushKey="MonthWeekDayBorder" />
<DataTemplate x:Key="CustomMonthDayHeaderTemplate">
            <controls:BoolToVisibilityConverter x:Key="boolToVisibilityConverter" />
        <Border BorderThickness="1" Background="LightYellow" BorderBrush="Orange" />
        <Border BorderThickness="0,0,1,1" controls:DynamicResource.BackgroundKey="MonthDayTodayHeaderBackground" 
            Visibility="{Binding IsToday, Converter={StaticResource boolToVisibilityConverter}}"/>
        <TextBlock  Margin="2,1" Text="{Binding Date, StringFormat=' {0:dddd}!'}" FontWeight="Bold" Foreground="DarkOrange" />

The Content and Header properties of MonthDayView are set internally to the same instance of MonthDayViewModel. MonthDayViewModel exposes the following properties for binding in the data templates:

  • HeaderText – Provides default header text, which is the day’s Date formatted according to the values provided by the static properties ScheduleSettings.MonthDayHeaderFormat and MonthFirstDayHeaderFormat.
  • IsToday – A Boolean indicating whether the day is Today.
  • Date – A DateTime containing the day’s date.
  • IsSelected – A Boolean indicating whether the day is currently selected.
  • IsActive – A Boolean indicating whether the day is an active day in the Month’s current view. For example, if the month is set at June and the date July 1 is visible, July 1 would have IsActive = false.

The default data templates for MonthDayView Content and Header are provide for completeness. You can use them as starting points for your customizations:

<!-- Default data template for content of a single day in Month view.-->
<DataTemplate x:Key="DefaultMonthDayViewContentTemplate">
            <ctrls:BoolToVisibilityConverter x:Key="boolToVisibilityConverter" />
        <Border Visibility="{Binding IsActive, Converter={StaticResource boolToVisibilityConverter}, ConverterParameter=Inverse}" ctrls:DynamicResource.BackgroundKey="MonthWeekInactiveDayBackground" />
        <Border Visibility="{Binding IsSelected, Converter={StaticResource boolToVisibilityConverter}}" ctrls:DynamicResource.BackgroundKey="MonthWeekSelectionBackground" />
        <Border BorderThickness="0,0,1,1" ctrls:DynamicResource.BorderBrushKey="MonthWeekDayBorder" />
<!-- Default data template for the Header of a single day in Month view.-->
<DataTemplate x:Key="DefaultMonthDayViewHeaderTemplate">
            <ctrls:BoolToVisibilityConverter x:Key="boolToVisibilityConverter" />
        <Border BorderThickness="0,0,1,1" ctrls:DynamicResource.BackgroundKey="MonthWeekHeaderBackground" ctrls:DynamicResource.BorderBrushKey="MonthWeekHeaderBorder" />
        <Border BorderThickness="0,0,1,1" ctrls:DynamicResource.BackgroundKey="MonthDayTodayHeaderBackground" 
                Visibility="{Binding IsToday, Converter={StaticResource boolToVisibilityConverter}}"/>
        <TextBlock  Margin="2,1" Text="{Binding HeaderText}" FontWeight="Bold" />

Related posts:

  1. How to display the number of appointments for a day in month view of Silverlight Schedule.
  2. Customizing Appointment Views in Silverlight Schedule
  3. Customizing Time Slots in Silverlight Schedule
  4. Silverlight Toolbar Quick Start Guide
  5. Silverlight Schedule Control Quick Start Guide