Direction with SlideAndZoomTransition

[Jean-Marc]

Hi,
I have a problem with RadtransitionControl:
I set the transition property in the XAML as :

SlideAndZoomTransition

 

 

MinAlpha="1.0" MinZoom="1.0" StartSlideAt="0.2" LayoutAnimation="Animated" SlideDirection="LeftToRight"

My goal is to change the slideDirection at runtime from LeftToRight to RightToLeft, but I can' t access the RadTransitionControl object.

this is the xaml of my project:

<

 

 

Window x:Class="Kribi3D_BenchMark.MainWindow"

 

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

 

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

 

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

 

Title="" ResizeMode="NoResize" WindowStartupLocation="CenterScreen" ShowInTaskbar="False" WindowStyle="None" VerticalContentAlignment="Center" VerticalAlignment="Center" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Height="750px" Width="1350px" SnapsToDevicePixels="True">

 

 

<Window.Background>

 

 

<ImageBrush ImageSource="/Kribi3D_BenchMark;component/images/Kribi_Bench_mirino.png" />

 

 

</Window.Background>

 

 

<Window.Resources>

 

 

<ControlTemplate x:Key="FrameTemplate" TargetType="{x:Type Frame}" x:Name="template">

 

 

<telerik:RadTransitionControl Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Duration="00:00:02" FlowDirection="LeftToRight" UseLayoutRounding="True" TransitionStatusChanged="transition_TransitionStatusChanged" x:Name="transition" HorizontalAlignment="Center" HorizontalContentAlignment="Center" IsManipulationEnabled="True">

 

 

<telerik:RadTransitionControl.Transition>

 

 

<telerik:SlideAndZoomTransition MinAlpha="1.0" MinZoom="1.0" StartSlideAt="0.2" LayoutAnimation="Animated" SlideDirection="LeftToRight"/>

 

 

</telerik:RadTransitionControl.Transition>

 

 

</telerik:RadTransitionControl>

 

 

</ControlTemplate>

 

 

<Style x:Key="RadButtonStyle1" TargetType="{x:Type telerik:RadButton}">

 

 

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

 

 

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

 

 

<Setter Property="Background">

 

 

<Setter.Value>

 

 

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

 

 

<GradientStop Color="White" Offset="0"/>

 

 

<GradientStop Color="Gainsboro" Offset="0.5"/>

 

 

<GradientStop Color="#FFADADAD" Offset="0.5"/>

 

 

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

 

 

</LinearGradientBrush>

 

 

</Setter.Value>

 

 

</Setter>

 

 

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

 

 

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

 

 

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

 

 

<Setter Property="Padding" Value="3"/>

 

 

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

 

 

<Setter Property="Template">

 

 

<Setter.Value>

 

 

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

 

 

<Grid SnapsToDevicePixels="True">

 

 

<Border x:Name="OuterBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}">

 

 

<Border x:Name="InnerBorder" BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="{TemplateBinding InnerCornerRadius}"/>

 

 

</Border>

 

 

<ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

 

 

<Border x:Name="CommonStatesWrapper">

 

 

<Border x:Name="FocusVisual" BorderBrush="#FFFFC92B" BorderThickness="0" Background="Transparent" CornerRadius="{TemplateBinding CornerRadius}" Opacity="0" Visibility="Collapsed">

 

 

<Border x:Name="FocusInnerVisual" BorderBrush="Transparent" BorderThickness="1" CornerRadius="{TemplateBinding InnerCornerRadius}"/>

 

 

</Border>

 

 

</Border>

 

 

</Grid>

 

 

<ControlTemplate.Triggers>

 

 

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

 

 

<Setter Property="BorderBrush" TargetName="OuterBorder" Value="Transparent"/>

 

 

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

 

 

</Trigger>

 

 

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

 

 

<Setter Property="Opacity" TargetName="CommonStatesWrapper" Value="0"/>

 

 

<Setter Property="BorderBrush" TargetName="OuterBorder" Value="Transparent"/>

 

 

<Setter Property="BorderBrush" TargetName="InnerBorder">

 

 

<Setter.Value>

 

 

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

 

 

<GradientStop Color="#FFB69A78"/>

 

 

<GradientStop Color="#FFFFE17A" Offset="0.126"/>

 

 

</LinearGradientBrush>

 

 

</Setter.Value>

 

 

</Setter>

 

 

</Trigger>

 

 

<MultiTrigger>

 

 

<MultiTrigger.Conditions>

 

 

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

 

 

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

 

 

</MultiTrigger.Conditions>

 

 

<Setter Property="Opacity" TargetName="OuterBorder" Value="1"/>

 

 

</MultiTrigger>

 

 

<Trigger Property="IsEnabled" Value="False">

 

 

<Setter Property="Opacity" TargetName="Content" Value="1"/>

 

 

<Setter Property="BorderBrush" TargetName="OuterBorder" Value="Transparent"/>

 

 

<Setter Property="Background" TargetName="InnerBorder" Value="Transparent"/>

 

 

<Setter Property="BorderBrush" TargetName="InnerBorder" Value="Transparent"/>

 

 

</Trigger>

 

 

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

 

 

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

 

 

<Setter Property="Opacity" TargetName="FocusVisual" Value="0"/>

 

 

</Trigger>

 

 

</ControlTemplate.Triggers>

 

 

</ControlTemplate>

 

 

</Setter.Value>

 

 

</Setter>

 

 

</Style>

 

 

</Window.Resources>

 

 

<Grid Height="672" telerik:StyleManager.Theme="Office_Black" VerticalAlignment="Bottom" HorizontalAlignment="Center">

 

 

<Frame HorizontalAlignment="Left" Name="frame1" VerticalAlignment="Stretch" Width="1350" NavigationUIVisibility="Hidden" Template="{StaticResource FrameTemplate}" Margin="0,0,0,58" HorizontalContentAlignment="Center" VerticalContentAlignment="Stretch" Height="614" SnapsToDevicePixels="False" Focusable="False" IsHitTestVisible="True" IsTabStop="False" />

 

 

<telerik:RadButton Height="48" HorizontalAlignment="Right" Margin="0,620,1192,0" Name="backfromTest" Tag="Bench" VerticalAlignment="Top" Width="48" Click="backfromTest_Click" BorderThickness="0" Style="{DynamicResource RadButtonStyle1}">

 

 

<telerik:RadButton.Background>

 

 

<ImageBrush ImageSource="/Kribi3D_BenchMark;component/images/Kribi_Bench_tasto_back.png" />

 

 

</telerik:RadButton.Background>

 

 

</telerik:RadButton>

 

 

<Image Height="65" HorizontalAlignment="Left" Margin="12,-68,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="533" Source="/Kribi3D_BenchMark;component/images/Kribi_Bench_logo.png" />

 

 

<Image Height="65" HorizontalAlignment="Left" Margin="1128,-68,0,0" Name="image2" Stretch="Fill" VerticalAlignment="Top" Width="200" Source="/Kribi3D_BenchMark;component/images/Kribi_Bench_Inartis.png" />

 

 

<telerik:RadButton Height="48" HorizontalAlignment="Right" Margin="0,620,1260,0" Name="radButton1" VerticalAlignment="Top" Width="48" BorderBrush="#00000000" BorderThickness="0" Click="radButton1_Click" Style="{DynamicResource RadButtonStyle1}" >

 

 

<telerik:RadButton.Background>

 

 

<ImageBrush ImageSource="images/Kribi_Bench_tasto_close.png"/>

 

 

</telerik:RadButton.Background>

 

 

</telerik:RadButton>

 

 

</Grid>

</

 

 

Window>

[Yana]

Hello Jean-Marc,

I would suggest to check the following link:
http://www.telerik.com/help/wpf/radtransition-how-to-transition-selection.html

where it is explained how you could change the transition at run time.

Kind regards,
Yana
the Telerik team