This is a migrated thread and some comments may be shown as answers.

Appointment Editing does not work after adding Style Selector

5 Answers 257 Views

ScheduleView

This is a migrated thread and some comments may be shown as answers.

Michael asked on 22 Mar 2011, 02:38 PM

Hi,

I want to customize the Appointment Item. Therefore I proceeded as described in http://www.telerik.com/help/wpf/radscheduleview-styles-and-templates-appointment-style.html. But after creating the AppointmentStyleSelector nothing happens when I doubleclick an appointment. What went wrong? Are there any triggers missing? Below is the XAML which was generated by Expression Blend (4). I'm using Q1 2011 telerik controls.

thanks in advance,

michael

<telerik:OrientedAppointmentItemStyleSelector x:Key="AppointmentStyleSelector">

<telerik:OrientedAppointmentItemStyleSelector.HorizontalStyle>

<Style TargetType="{x:Type telerik:AppointmentItem}">

<Setter Property="Margin" Value="0,1,0,0"/>

<Style.BasedOn>

<Style TargetType="{x:Type telerik:AppointmentItem}">

<Setter Property="Background">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="White"/>

<GradientStop Color="#FFD4D4D4" Offset="1"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="BorderBrush" Value="#FF848484"/>

<Setter Property="HorizontalContentAlignment" Value="Stretch"/>

<Setter Property="VerticalContentAlignment" Value="Stretch"/>

<Setter Property="Foreground" Value="Black"/>

<Setter Property="BorderThickness" Value="1"/>

<Setter Property="Padding" Value="2,0,0,0"/>

<Setter Property="Focusable" Value="True"/>

<Setter Property="ContentTemplateSelector">

<Setter.Value>

<telerik:AppointmentItemContentTemplateSelector>

<telerik:AppointmentItemContentTemplateSelector.DefaultTemplate>

<DataTemplate>

<TextBlock TextWrapping="Wrap" Text="{Binding Subject}" TextTrimming="WordEllipsis"/>

</DataTemplate>

</telerik:AppointmentItemContentTemplateSelector.DefaultTemplate>

</telerik:AppointmentItemContentTemplateSelector>

</Setter.Value>

</Setter>

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type telerik:AppointmentItem}">

<Grid x:Name="Root">

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="2">

<Border BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1"/>

</Border>

<Border x:Name="CommonStatesVisual" BorderBrush="#FFFFC92B" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2" Visibility="Collapsed">

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFFFBA3" Offset="1"/>

<GradientStop Color="#FFFFFBDA" Offset="0"/>

</LinearGradientBrush>

</Border.Background>

<Border x:Name="CommonStatesVisualInnerBorder" BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1"/>

</Border>

<Border x:Name="PART_Category" Background="{Binding Category.CategoryBrush}" Margin="2"/>

<Rectangle x:Name="ReadOnlyVisual" Fill="#B2BABFC6" Margin="2" Visibility="Collapsed"/>

<Grid Margin="2">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto"/>

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<Border x:Name="PART_TimeMarker" Background="{Binding TimeMarker.TimeMarkerBrush}" Grid.Column="0" HorizontalAlignment="Left" Width="5">

<Border.Visibility>

<Binding Path="TimeMarker">

<Binding.Converter>

<telerik:NullToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Border.Visibility>

</Border>

<StackPanel Grid.Column="1" Margin="0,3,0,0" VerticalAlignment="Top">

<Image x:Name="RecurrenceMark" Grid.Column="0" HorizontalAlignment="Left" Height="10" Margin="2,1,1,0" Width="10">

<Image.Source>

<BitmapImage UriSource="pack://application:,,,/Telerik.Windows.Controls.ScheduleView;component/Themes/Images/AppointmentException.png"/>

</Image.Source>

<Image.Visibility>

<Binding Path="RecurrenceState">

<Binding.Converter>

<telerik:RecurrenceStateIsExeptionToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Image.Visibility>

</Image>

<Image x:Name="ExceptionMark" Grid.Column="0" HorizontalAlignment="Left" Height="10" Margin="2,1,1,0" Width="10">

<Image.Source>

<BitmapImage UriSource="pack://application:,,,/Telerik.Windows.Controls.ScheduleView;component/Themes/Images/AppointmentRecurrence.png"/>

</Image.Source>

<Image.Visibility>

<Binding Path="RecurrenceState">

<Binding.Converter>

<telerik:RecurrenceStateIsOccurenceToVisibilityConverter/>

</Binding.Converter>

</Binding>

</Image.Visibility>

</Image>

</StackPanel>

<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="2" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

</Grid>

<Grid x:Name="MouseOverOverlay" Opacity="0" Visibility="Collapsed">

<Border x:Name="PART_StartResizeGrip" telerik:RadDragAndDropManager.AllowDrag="True" Background="Transparent" Cursor="SizeWE" HorizontalAlignment="Left" VerticalAlignment="Stretch">

<StackPanel x:Name="StartResizeGrip" HorizontalAlignment="Center" Margin="1" VerticalAlignment="Center">

<Border BorderBrush="#FF444444" BorderThickness="0,0,1,1" Background="White" Height="3" Margin="1" Width="3"/>

</StackPanel>

</Border>

<Border x:Name="PART_EndResizeGrip" telerik:RadDragAndDropManager.AllowDrag="True" Background="Transparent" Cursor="SizeWE" HorizontalAlignment="Right" VerticalAlignment="Stretch">

<StackPanel x:Name="EndResizeGrip" HorizontalAlignment="Center" Margin="1" VerticalAlignment="Center">

<Border BorderBrush="#FF444444" BorderThickness="0,0,1,1" Background="White" Height="3" Margin="1" Width="3"/>

</StackPanel>

</Border>

<telerik:RadButton x:Name="DeleteButton" CommandParameter="{Binding RelativeSource={RelativeSource TemplatedParent}}" Command="telerik:RadScheduleViewCommands.DeleteAppointment" HorizontalAlignment="Right" Height="11" Margin="5" Padding="0" VerticalAlignment="Top" Width="11">

<telerik:StyleManager.Theme>

<telerik:Office_BlackTheme/>

</telerik:StyleManager.Theme>

<Path Data="M0,0L5,5 M5,0L0,5" Stroke="#FF444444"/>

</telerik:RadButton>

</Grid>

<ControlTemplate.Triggers>

<MultiTrigger>

<MultiTrigger.Conditions>

<Condition Property="IsReadOnly" Value="True"/>

<Condition Property="IsEnabled" Value="True"/>

</MultiTrigger.Conditions>

<Setter Property="Visibility" TargetName="ReadOnlyVisual" Value="Visible"/>

</MultiTrigger>

<MultiTrigger>

<MultiTrigger.Conditions>

<Condition Property="IsReadOnly" Value="False"/>

<Condition Property="IsMouseOver" Value="True"/>

<Condition Property="IsEnabled" Value="True"/>

</MultiTrigger.Conditions>

<MultiTrigger.EnterActions>

<BeginStoryboard>

<Storyboard>

<ObjectAnimationUsingKeyFrames Duration="0:0:0.4" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="MouseOverOverlay">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimation BeginTime="0:0:0.2" Duration="0:0:0.2" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="MouseOverOverlay"/>

</Storyboard>

</BeginStoryboard>

</MultiTrigger.EnterActions>

<MultiTrigger.ExitActions>

<BeginStoryboard>

<Storyboard>

<ObjectAnimationUsingKeyFrames Duration="0:0:0.2" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="MouseOverOverlay">

<DiscreteObjectKeyFrame KeyTime="0:0:0.2">

<DiscreteObjectKeyFrame.Value>

<Visibility>Collapsed</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimation BeginTime="0" Duration="0:0:0.2" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="MouseOverOverlay"/>

</Storyboard>

</BeginStoryboard>

</MultiTrigger.ExitActions>

<Setter Property="Visibility" TargetName="CommonStatesVisual" Value="Visible"/>

<Setter Property="Visibility" TargetName="MouseOverOverlay" Value="Visible"/>

</MultiTrigger>

<Trigger Property="IsSelected" Value="True">

<Setter Property="Visibility" TargetName="CommonStatesVisual" Value="Visible"/>

<Setter Property="Background" TargetName="CommonStatesVisual">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFCE79F" Offset="1"/>

<GradientStop Color="#FFFDD3A8"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

<Setter Property="BorderBrush" TargetName="CommonStatesVisual" Value="#FFFFC92B"/>

<Setter Property="BorderBrush" TargetName="CommonStatesVisualInnerBorder" Value="White"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="Panel.ZIndex" Value="1"/>

</Style>

</Style.BasedOn>

</Style>

</telerik:OrientedAppointmentItemStyleSelector.HorizontalStyle>

5 Answers, 1 is accepted

answered on 22 Mar 2011, 03:23 PM

Solved it myself.

The code has too look something like this

<ControlTemplate TargetType="{x:Type telerik:AppointmentItem}">

<Grid x:Name="Root">

<Grid.InputBindings>

<MouseBinding MouseAction="LeftDoubleClick" Command="telerik:RadScheduleViewCommands.EditAppointment" />

</Grid.InputBindings>

What is the reason why this is not generated by Blend?

thanks,

michael

answered on 22 Mar 2011, 05:04 PM

ScheduleView.zip

Hello Michael,

I am attaching all the RadScheduleView's Office_Black style so you can use it as a reference. You can find the appointment style selector there as well as other resources.

Kind regards,
Pana
the Telerik team

Vote for the 7 Telerik products at the 2011 Great Indian Developer Awards!