Mega Code Archive

 

Categories / Silverlight / Animations

 

Point value animation

<UserControl x:Class='SilverlightApplication3.MainPage'     xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'      xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'     xmlns:d='http://schemas.microsoft.com/expression/blend/2008'      xmlns:mc='http://schemas.openxmlformats.org/markup-compatibility/2006'      mc:Ignorable='d'      d:DesignWidth='640' d:DesignHeight='480'>     <UserControl.Resources>         <Storyboard x:Name="MovePointDown">             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[1].(BezierSegment.Point1)" Duration="00:00:00.50" To="44,277"/>             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[0].(BezierSegment.Point2)" Duration="00:00:00.50" To="155,277"/>             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[0].(BezierSegment.Point3)" Duration="00:00:00.50" To="100, 277"/>         </Storyboard>         <Storyboard x:Name="MovePointUp">             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[1].(BezierSegment.Point1)" Duration="00:00:00.50" To="44,200"/>             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[0].(BezierSegment.Point2)" Duration="00:00:00.50" To="155,200"/>             <PointAnimation Storyboard.TargetName="RedPath" Storyboard.TargetProperty="(Path.Data).(PathGeometry.Figures)[0].(PathFigure.Segments)[0].(BezierSegment.Point3)" Duration="00:00:00.50" To="100,200"/>         </Storyboard>     </UserControl.Resources>     <Canvas x:Name="LayoutRoot" Background="White" >         <Path Height="277" Width="200" Canvas.Left="306" Canvas.Top="65" Fill="#FFFF0000" Stretch="None" x:Name="RedPath" Cursor="Hand">             <Path.Data>                 <PathGeometry>                     <PathFigure IsClosed="True" StartPoint="200,100">                         <BezierSegment Point1="200,155" Point2="155,200" Point3="100,200"/>                         <BezierSegment Point1="44,200" Point2="0,155" Point3="0,100"/>                         <BezierSegment Point1="10,44" Point2="44,0" Point3="100,0"/>                         <BezierSegment Point1="155,0" Point2="200,44" Point3="200,100"/>                     </PathFigure>                 </PathGeometry>             </Path.Data>         </Path>     </Canvas> </UserControl> //File: Page.xaml.cs using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; namespace SilverlightApplication3 {     public partial class MainPage : UserControl     {         public MainPage()         {             InitializeComponent();             RedPath.MouseEnter += new MouseEventHandler(RedPath_MouseEnter);             RedPath.MouseLeave += new MouseEventHandler(RedPath_MouseLeave);         }         void RedPath_MouseLeave(object sender, MouseEventArgs e)         {             MovePointUp.Begin();         }         void RedPath_MouseEnter(object sender, MouseEventArgs e)         {             MovePointDown.Begin();         }     } }