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

6 posts, 1 answers
  1. Frankie
    Frankie avatar
    11 posts
    Member since:
    Jun 2011

    Posted 19 Dec 2011 Link to this post

    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

  2. Dani
    Admin
    Dani avatar
    848 posts

    Posted 20 Dec 2011 Link to this post

    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
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Frankie
    Frankie avatar
    11 posts
    Member since:
    Jun 2011

    Posted 20 Dec 2011 Link to this post

    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
  5. Answer
    Dani
    Admin
    Dani avatar
    848 posts

    Posted 21 Dec 2011 Link to this post

    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
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  6. saravanan govindan
    saravanan govindan avatar
    1 posts
    Member since:
    Dec 2009

    Posted 26 Jun 2012 Link to this post

    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

  7. Dani
    Admin
    Dani avatar
    848 posts

    Posted 28 Jun 2012 Link to this post

    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
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
Back to Top
UI for WPF is Visual Studio 2017 Ready