RadCalendar DayNames' Brush

[Todd]

I have a need for the RadCalendar's GridLines and DayName to always be white as the calendar will always appear against a black background. Works in Dark Theme, but when I change to Light Theme in WP8, the calendar is not longer visible.

I was able to change the GridLineBrush no issues in VS, but I still can't find where I can change the DayName's brush. Any ideas?

[Todd]

Not sure what the protocol is here, but do I need to submit a support ticket to actually get an answer?

[Todor]

Hello Todd,

Thank you for writing.

Changing the day name brush is a little more tricky as we don't have dedicated properties for them. RadCalendar consists of CalendarButtons and you need to change their style. Here's the default style:

<Style TargetType="calendar:CalendarButton">
    <Setter Property="Padding" Value="0" />
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="calendar:CalendarButton">
                <Grid x:Name="LayoutRoot" Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ContentPresenter"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledColor}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="IsNotFromCurrentView">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ContentPresenter"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledColor}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="IsNotSelectable">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ContentPresenter"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledColor}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ButtonType">
                            <VisualState x:Name="Date" />
                            <VisualState x:Name="TodayDate">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="TodayVisual"
                                        Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Month" />
                            <VisualState x:Name="WeekNumber">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ContentPresenter"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledColor}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="WeekName">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="ContentPresenter"
                                        Storyboard.TargetProperty="Foreground">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneSubtleColor}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected" />
                            <VisualState x:Name="Selected" >
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetName="SelectedVisual"
                                        Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="TodayVisual" Visibility="Collapsed" Background="{StaticResource PhoneAccentBrush}" />
                    <Border x:Name="SelectedVisual" Visibility="Collapsed" Background="{StaticResource PhoneSubtleBrush}" />
                    <ContentControl Margin="{TemplateBinding Padding}"
                        ContentTemplate="{TemplateBinding ContentTemplate}"
                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                        Content="{TemplateBinding Content}"
                        x:Name="ContentPresenter">
                    </ContentControl>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

I have highlighted the VisualState that needs to be modified in order to change the color for the names of the days. Just add the style to the resources of your page/application and change the brush used in the WeekName visual state. You will also need to map the following prefix:

xmlns:calendar="clr-namespace:Telerik.Windows.Controls.Calendar;assembly=Telerik.Windows.Controls.Input"

I hope this information helps.

Greetings,
Todor
the Telerik team

[Todd]

This is perfect, thank you Todor!