Using TimeRulerStyleSelector cannot change the Background color of Month view day item

[Dev]

Hi,

I'm using RadControl Q3 2011 to build a ScheduleView in WPF application. I plan to use MonthViewDefinition (and I had created a custom  BiWeeklyViewDefinition extending MonthViewDefinition that shows current two weeks) to show the appointment data.
One of the requirement is that the ScheduleView should be able to show alternative background color of the dates across months (i.e. showing Blue color for all dates in Dec and Green color for all dates in Jan).
I know that using "TimeRulerItemStyleSelector" should be able to achieve that by building a custom selector extending OrientedTimeRulerItemStyleSelector. However, I found that I even cannot change the background color of ScheduleView in WPF by simply using OrientedTimeRulerItemStyleSelector with Style specifying:

 

 

 

 

<telerik:OrientedTimeRulerItemStyleSelector x:Key="TimeRulerItemStyleSelector">
        <telerik:OrientedTimeRulerItemStyleSelector.MonthViewTickStyle>
            <Style TargetType="telerik:TimeRulerItem">
                <Setter Property="Background" Value="Blue" />
            </Style>
        </telerik:OrientedTimeRulerItemStyleSelector.MonthViewTickStyle>
    </telerik:OrientedTimeRulerItemStyleSelector>

 

 

 

The XAML of ScheduleView:

<telerik:RadScheduleView Grid.Row="0" Name="RSV" AppointmentsSource="{Binding Appointments}" VisibleRangeChanged="RSV_VisibleRangeChanged" Loaded="RSV_Loaded"
                                     TimeRulerItemStyleSelector="{StaticResource ResourceKey=TimeRulerItemStyleSelector}">
                <telerik:RadScheduleView.ViewDefinitions>
                    <bo_calendar:BiWeeklyViewDefinition CalendarWeekRule="FirstFullWeek" FirstDayOfWeek="Monday" />
                    <telerik:MonthViewDefinition CalendarWeekRule="FirstFullWeek" FirstDayOfWeek="Monday" />
                </telerik:RadScheduleView.ViewDefinitions>
            </telerik:RadScheduleView>

Any idea?

Thanks a lot!

Frankie

[Dani]

Hi Frankie,

Please, try TemplateBinding the Background of the GoToDayButton which is part of the control template for MonthViewTickStyle. Please, check the attached project for reference.

I hope it will be helpful.

Best wishes,
Dani
the Telerik team

[Dev]

Hi Dani,

Thank you for your response and your sample project. I try to modify Background style of GoToDayButton but it still does not give me my expected outcome based on your provided project.
I'm running Visual Studio 2010 using RadControl Q3 2011 (.NET 4.0). And the screen shot named "scheduleview with white background.png" is the output from the sample project. What I'm going to implement is the "expected scheduleview with alternative background.png" with alternative background color for different months. I understand I need to write a Converter to identify "alternative" months but at this moment I cannot change the Background color of each month date item in ScheduleView.

Any thoughts?
Many thanks!

Frankie

[Dani]

Hi Frankie,

I assumed you wish to change the background of the time ruler header in MonthView. Sorry for the misunderstanding.

If what you wish to change is the background of the entire slot in MonthView, this is represented by the HighlightItemStyle and is not part of the TimeRulerItemStyleSelector.

You now have two options. You can either continue using a custom TimeRulerItemStyleSelector, and modify the MonthViewTickStyle so that an element stretching through the entire slot has a TemplateBinding to the Background property:

<telerik:OrientedTimeRulerItemStyleSelector.MonthViewTickStyle>
                <Style TargetType="telerik:TimeRulerItem">
                    <Setter Property="Background" Value="Blue" />
                    <Setter Property="Foreground" Value="{StaticResource MonthViewTimeRulerItemForeground_Normal}" />
                    <Setter Property="Margin" Value="0 -1 -1 0" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="telerik:TimeRulerMonthViewItem">
                                <!--NOTE: a Border element used to change backgrounds-->
                                <Border Background="{TemplateBinding Background}" BorderBrush="White" BorderThickness="1">
                                    <Grid Background="{TemplateBinding Background}">
                                        <telerik:RadButton Padding="0" VerticalAlignment="Top" Height="22"
                                                       Style="{StaticResource GoToDayButtonStyle}"
                                                       Command="telerik:RadScheduleViewCommands.SetDayViewMode"
                                                       CommandParameter="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content.DateTime.Date}">
                                            <ContentPresenter Margin="{TemplateBinding Padding}" />
                                        </telerik:RadButton>
                                        <telerik:RadToggleButton Visibility="{Binding ExpandButtonVisibility}"
                                                             IsChecked="{Binding IsExpanded, Mode=TwoWay}"
                                                             Style="{StaticResource ExpandMonthViewButtonStyle}"
                                                             HorizontalAlignment="Right" VerticalAlignment="Bottom" />
                                    </Grid>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </telerik:OrientedTimeRulerItemStyleSelector.MonthViewTickStyle>

The other option is, since, differentiating slots in MonthView means making them special, you can implement the SpecialSlotStyleSelector. The HighlightItemStyle is part of the SpecialSlotStyleSelector. More details on the selector can be found here.

I hope this will be helpful.

Kind regards,
Dani
the Telerik team

[saravanan govindan]

Hi Dani,
        I tried that but it doesn't seems to be work for me. I am using SpecialSlotStyleSelector too. While using that for the default slot in month view i need to show in some other color (like blue). For some special slot i have to apply that Special slot style. If i give background color to control(like grid) in that template of that TimeRulerMonthViewItem it shows that color, but i didn't show that specialslots default only applied. how can i solve this?

Thanks,
Saravanan G

[Dani]

Hi Saravan,

I am not sure I fully understand what you wish to achieve. If you are using a SpecialSlotStyleSelector, then why not provide a separate style for slots you wish to have a different background based on some criteria? I do not think you need to modify the TimeRulerMonthViewItem.

Please, send a screenshot or a sample demonstrating the problem you are facing.

Kind regards,
Dani
the Telerik team