Path Animation with DoubleAnimationUsingPath, AutoReverse : DoubleAnimation « Windows Presentation Foundation « C# / CSharp Tutorial






<Window x:Class="WpfApplication1.PathAnimationExample"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Path Animation" Height="500" Width="518">
    <Canvas Margin="5">

        <Polyline Points="0,345,96,345,320,432,500,432" Stroke="Gray"
      StrokeThickness="5" />
        <Path>
            <Path.Data>
                <PathGeometry x:Name="path2" Figures="M0,292 L75,292 300,380,449,380" />
            </Path.Data>
        </Path>
        <Ellipse Name="circle2" Stroke="DarkGoldenrod" Canvas.Left="0"
      Canvas.Top="293" Width="50" Height="50">
            <Ellipse.Fill>
                <LinearGradientBrush>
                    <GradientStop Color="DarkGoldenrod" Offset="0.5" />
                    <GradientStop Color="Gold" Offset="0.5" />
                </LinearGradientBrush>
            </Ellipse.Fill>
            <Ellipse.RenderTransform>
                <RotateTransform x:Name="circle2Rotate" CenterX="25" CenterY="25" />
            </Ellipse.RenderTransform>
        </Ellipse>
    </Canvas>
</Window>

//File:Window.xaml.cs

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace WpfApplication1
{
    public partial class PathAnimationExample : Window
    {
        public PathAnimationExample()
        {
            InitializeComponent();

            path2.Freeze(); // For performance benefits. 
            DoubleAnimationUsingPath daPath = new DoubleAnimationUsingPath();
            daPath.Duration = TimeSpan.FromSeconds(5);
            daPath.RepeatBehavior = RepeatBehavior.Forever;
            daPath.AccelerationRatio = 0.6;
            daPath.DecelerationRatio = 0.4;
            daPath.AutoReverse = true;
            daPath.PathGeometry = path2;
            daPath.Source = PathAnimationSource.X;
            circle2.BeginAnimation(Canvas.LeftProperty, daPath);

            daPath = new DoubleAnimationUsingPath();
            daPath.Duration = TimeSpan.FromSeconds(5);
            daPath.RepeatBehavior = RepeatBehavior.Forever;
            daPath.AccelerationRatio = 0.6;
            daPath.DecelerationRatio = 0.4;
            daPath.AutoReverse = true;
            daPath.PathGeometry = path2;
            daPath.Source = PathAnimationSource.Y;
            circle2.BeginAnimation(Canvas.TopProperty, daPath);

        }
    }
}
WPF Path Animation With Double Animation Using Path Auto Reverse








24.115.DoubleAnimation
24.115.1.Remove aniamtion with RemoveStoryboardRemove aniamtion with RemoveStoryboard
24.115.2.Animated transformAnimated transform
24.115.3.Create DoubleAnimation and Animate a Button with Button.BeginAnimation and Button.WidthPropertyCreate DoubleAnimation and Animate a Button with Button.BeginAnimation and Button.WidthProperty
24.115.4.DoubleAnimation Loop foreverDoubleAnimation Loop forever
24.115.5.DoubleAnimation Loop three timesDoubleAnimation Loop three times
24.115.6.DoubleAnimation Loop for 30 secondsDoubleAnimation Loop for 30 seconds
24.115.7.TranslateTransform and DoubleAnimationTranslateTransform and DoubleAnimation
24.115.8.Path Animation with DoubleAnimationUsingPath, AutoReversePath Animation with DoubleAnimationUsingPath, AutoReverse
24.115.9.Animated Text TransformAnimated Text Transform
24.115.10.Markup for navigation transition animationsMarkup for navigation transition animations