[Windows Phone] manually implement the layouttransform animation effect of telerik

[Windows Phone] manually implement the layouttransform animation effect of telerik

 

By sinodragon21/Nathan

 

Reprinted please indicate the source http://www.cnblogs.com/sinodragon21/archive/2012/07/20/2601164.html

 

I. Demo Effect

 

 

 

Ii. Core code

 1         public void OnPropertyChanged(Object sender, PropertyChangedEventArgs args) 2         { 3             //Rect tmp = _layoutTransform.TransformBounds(((Rect)_content)); 4             if (null == _content) 5             { 6                 return; 7             } 8  9             _content.RenderTransform = _layoutTransform;10             CompositeTransform tmp = (CompositeTransform) _layoutTransform;11             double radian = tmp.Rotation * Math.PI / 180;12             double d = (_content.Width) * (System.Math.Sin(radian) + System.Math.Cos(radian));13             double margin = Math.Abs((d  - _content.Width)/2);14             _content.Margin = new Thickness(margin);15         }

 

 1 <phone:PhoneApplicationPage  2     x:Name="Myself" 3     x:Class="LayoutTransform.MainPage" 4     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 5     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 6     xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 7     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 8     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 9     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"10     xmlns:system="clr-namespace:System;assembly=mscorlib"11     xmlns:layouttransform="clr-namespace:LayoutTransform;assembly=LayoutTransform"12     mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"13     FontFamily="{StaticResource PhoneFontFamilyNormal}"14     FontSize="{StaticResource PhoneFontSizeNormal}"15     Foreground="{StaticResource PhoneForegroundBrush}"16     SupportedOrientations="Portrait" Orientation="Portrait"17     shell:SystemTray.IsVisible="True">18 19     <phone:PhoneApplicationPage.Resources>20         <system:Double x:Key="MyFontSizeAppName">24</system:Double>21         <FontFamily x:Key="MyFontFamilySemiBold">Segoe WP Semibold</FontFamily>22         23         <Style x:Key="MyAppNameTextBlockStyle" TargetType="TextBlock">24             <Setter Property="FontFamily" Value="{StaticResource MyFontFamilySemiBold}"/>25             <Setter Property="FontSize" Value="{StaticResource MyFontSizeAppName}"/>26             <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>27             <Setter Property="Margin" Value="12,10,12,10" />28         </Style>29 30         <Storyboard x:Name="sb_protagonist">31             <DoubleAnimation Storyboard.TargetName="Myself"32                              Storyboard.TargetProperty="Rotation"33                              From="0" To="360" Duration="0:0:5" />34         </Storyboard>35     </phone:PhoneApplicationPage.Resources>

 

Iii. Source Code

Http://www.hugwp.com/thread-4208-1.html

 

-- End.