Change the appointment display style

10 posts, 0 answers
  1. Matthias
    Matthias avatar
    7 posts
    Member since:
    Dec 2011

    Posted 02 Feb 2012 Link to this post

    Hi,

    i was wondering if i can change the display style of an appointment in radscheduleview like shown in the attached screenshot? Is it
    possible?
    The default appointment style does only display the subject of an appointment in the week view for example. In my opinion, this is a waste of useful display space and my goal is to display additional information like the location, resources or category of an appointment.
    I looked through the examples and API documentation but didn't found any hint or solution for this problem.

    thanks in advance,

    best regards

    Matthias
  2. Matthias
    Matthias avatar
    7 posts
    Member since:
    Dec 2011

    Posted 03 Feb 2012 Link to this post

    Well, i figured something out. I used the OrientedAppointmentItemStyleSelector for solving my problem. However i now ran into another problem. The indicators for resizing an appointment in a vertical view such Day or week view are not on the top/Bottom side of an appointment anymore...instead they are on the left and right side. I already read a thread in this forum where the creator had the same problem, but he wasn't using the OrientedAppointmentItemStyleSelector and thats caused his problem. I really have no idea why this problem occurrs, because the correct vertical style is applied...do i have missed to set an orientation parameter or something?

    Here's my code.

    Public Class AppointmentStyleSelector
            Inherits OrientedAppointmentItemStyleSelector
     
            Private _horizontalAppointmentStyle As Style
            Public Property HorizontalAppointmentStyle() As Style
                Get
                    Return _horizontalAppointmentStyle
                End Get
                Set(value As Style)
                    _horizontalAppointmentStyle = value
                End Set
            End Property
     
            Private _verticalAppointmentStyle As Style
            Public Property VerticalAppointmentStyle() As Style
                Get
                    Return _verticalAppointmentStyle
                End Get
                Set(value As Style)
                    _verticalAppointmentStyle = value
                End Set
            End Property
     
            Public Overrides Function SelectStyle(item As Object, container As DependencyObject, activeViewDefinition As ViewDefinitionBase) As Style
                Dim appointment As IAppointment = TryCast(item, IAppointment)
                If appointment Is Nothing Then
                    Return MyBase.SelectStyle(item, container, activeViewDefinition)
                End If
     
                If activeViewDefinition.GetOrientation() = Orientation.Horizontal Then
                    Return Me.HorizontalAppointmentStyle
                Else
                    Return Me.VerticalAppointmentStyle
                End If
            End Function
        End Class

    And the corresponding XAML code:

    <Style x:Key="HorizontalAppointmentStyle" TargetType="telerik:AppointmentItem">
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FF46384B" Offset="0.998"/>
                            <GradientStop Color="#FFBA9DC2" Offset="0.007"/>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Style>
     
            <Style x:Key="VerticalAppointmentStyle" TargetType="telerik:AppointmentItem">
                <Setter Property="ContentTemplateSelector">
                    <Setter.Value>
                        <telerik:AppointmentItemContentTemplateSelector>
                            <telerik:AppointmentItemContentTemplateSelector.DefaultTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Vertical">
                                        <TextBlock TextWrapping="Wrap" Text="{Binding Subject}" TextTrimming="WordEllipsis"/>
                                        <TextBlock TextWrapping="Wrap" Text="{Binding Appointment.Description}" TextTrimming="WordEllipsis"/>
                                        <TextBlock TextWrapping="Wrap" Text="{Binding Appointment.Location}" TextTrimming="WordEllipsis"/>
                                    </StackPanel>                               
                                </DataTemplate>
                            </telerik:AppointmentItemContentTemplateSelector.DefaultTemplate>
                        </telerik:AppointmentItemContentTemplateSelector>
                    </Setter.Value>
                </Setter>
            </Style>
             
             
     
            <Calendar:AppointmentStyleSelector x:Key="AppointmentItemStyleSelector"
                                               HorizontalAppointmentStyle="{StaticResource HorizontalAppointmentStyle}"
                                               VerticalAppointmentStyle="{StaticResource VerticalAppointmentStyle}" />

    thanks for your help!
  3. UI for WPF is Visual Studio 2017 Ready
  4. Matthias
    Matthias avatar
    7 posts
    Member since:
    Dec 2011

    Posted 03 Feb 2012 Link to this post

    And here is a screenshot of the problem...i forgot to attach it in my previous post.
  5. George
    Admin
    George avatar
    1332 posts

    Posted 09 Feb 2012 Link to this post

    Hi Matthias,

     
    Can you change the SelectStyle method to the following code:

    ...
    If activeViewDefinition.GetOrientation() = Orientation.Horizontal Then
    Return Me.VerticalAppointmentStyle
    Else
    Return Me.HorizontalAppointmentStyle
    End If


    Hope this helps.


    Regards,
    George
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  6. Matthias
    Matthias avatar
    7 posts
    Member since:
    Dec 2011

    Posted 09 Feb 2012 Link to this post

    Hi George,

    thanks for your reply.
    I've tested your code snippet but that doesn't work for me. The 'resize' indicators are still positioned on the left and right side of the appointment.
    I really have no idea whats causing this problem.

    best regards

    Matthias
  7. George
    Admin
    George avatar
    1332 posts

    Posted 16 Feb 2012 Link to this post

    Hi Matthias,

     
    We took some time to investigate the issue and we found a bug in our code. We will try to fix it for our next internal build. The issue is logged in our PITS and you can track it here - http://www.telerik.com/support/pits.aspx#/public/wpf/9768. I am glad to update your telerik points.


    Regards,
    George
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  8. David
    David avatar
    4 posts
    Member since:
    May 2012

    Posted 12 Jul 2012 Link to this post

    Hi,

    I have check this issue now again with the newst version of RadScheduleView but it still looks the same.

    After some search I found that you often recommend to copy the ScheduleView.xaml, as this is the only way to access the styles in it. For some resones it is not possible to access the "AppointmentItemVerticalControlTemplate" with TryFindResource. Not even the "RadScheduleViewStyle" can be found. Even though it is used by the RadScheduleView.

    To avoid copying your 4700 line long resource dictionary I have solve the issue now on this way:

    <UserControl.Resources>
    <ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="/Telerik.Windows.Controls.ScheduleView;component/Themes/Office/Black/ScheduleView.xaml"/>
    </ResourceDictionary.MergedDictionaries>
    <Style x:Key="VerticalAppointmentStyle" TargetType="telerik:AppointmentItem">
    <Setter Property="Template" Value="{DynamicResource AppointmentItemVerticalControlTemplate}" />
    <!-- your setters-->
    </Style>
    <Style x:Key="HorizontalAppointmentStyle" TargetType="telerik:AppointmentItem">
    <!-- Horizontal works fine anyway. -->
    </Style>
    <Calendar:AppointmentStyleSelector x:Key="AppointmentItemStyleSelector"
      HorizontalAppointmentStyle="{StaticResource HorizontalAppointmentStyle}"
      VerticalAppointmentStyle="{StaticResource VerticalAppointmentStyle}" />
    </ResourceDictionary>
    </UserControl.Resources>
    <telerik:RadScheduleView
      AppointmentStyleSelector="{StaticResource AppointmentItemStyleSelector}"... />

    First I reference the ScheduleView.xaml directly from your assembly, so I dont have to a copy it.
    Second I add the AppointmentItemVerticalControlTemplate to the vertical style.

    best regards,
    David

  9. Dani
    Admin
    Dani avatar
    848 posts

    Posted 17 Jul 2012 Link to this post

    Hello David,

    Copying ScheduleView.xaml is only recommended when you are modifying a theme different than the default one. If you are editing the Office Black theme, you do not need to copy the entire RadScheduleView xaml, you just need the part you wish to customize.

    However, if the part you wish to customize (in your case, the AppointmentItemVerticalControlTemplate) is from a theme different than the default, then you should base your custom style on the theme you are using.

    You can use NoXaml Binaries together with implicit styles to apply a theme. Then, append in App.xaml your custom style and base it on the theme you are using. More details on implicit styling and the process of basing a style on a theme can be found here.
     
    The bug with the OrientedAppointmentItemStyleSelector should be fixed since 2012 Q1 SP1 in March. If you are still experiencing issues, please share a reproducable project which we can test.

    All the best,
    Dani
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  10. David
    David avatar
    4 posts
    Member since:
    May 2012

    Posted 18 Jul 2012 Link to this post

    Hi Dani,
     
    I have create a sample, showing what I want to modify.
    RadScheduleViewWPF.zip

    Also I have attach a screenshot. It shows that the Resize grip is on the wrong side.

    Maybe you can verify if this is still the bug or if I do something wrong.
     
    best regards,
     David

     

  11. Dani
    Admin
    Dani avatar
    848 posts

    Posted 24 Jul 2012 Link to this post

    Hi David,

    When using the AppointmentItemStyleSelector, you need to copy and modify the entire selector. Providing only one of the two styles from the selector results in broken orientation.

    Anyway, you do not need the style selector if what you wish to customize is only the content template of vertical appointments (AppointmentItemStyleSelector includes quite some amount of xaml; you could avoid that). You can use the AppointmentItemContentTemplateSelector. By default this selector has a single default template. You need to inherit it and create your own custom AppointmentItemContentTemplateSelector in order to make it orientation-aware and provide a ContentTemplate for the vertically oriented appointments only.

    I hope this will be helpful.

    Regards,
    Dani
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top
UI for WPF is Visual Studio 2017 Ready