<Window x:Class="SplineKeyFrameAnimation"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Spline Key Frame Animation" Height="250" Width="400">
  <Canvas Margin="5">
    <Ellipse Name="ball1" Canvas.Left="10" Canvas.Top="50" Width="20" Height="20">
      <Ellipse.Fill>
        <RadialGradientBrush>
          <GradientStop Color="Gold" Offset="0" />
          <GradientStop Color="DarkGoldenrod" Offset="1" />
        </RadialGradientBrush>
      </Ellipse.Fill>
    </Ellipse>
    <Canvas.Triggers>
      <EventTrigger RoutedEvent="StackPanel.Loaded">
        <EventTrigger.Actions>
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation
                Storyboard.TargetName="ball1"
                Storyboard.TargetProperty="(Canvas.Left)" To="310"
                Duration="0:0:10" RepeatBehavior="Forever" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger.Actions>
      </EventTrigger>
    </Canvas.Triggers>
  </Canvas>
</Window>

   
    
    
    
    
    
     

   
      

<Window x:Class="Animation.KeySplineAnimation"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="KeySplineAnimation" Height="249.6" Width="624"
    >
    <Window.Triggers>
        <EventTrigger RoutedEvent="Window.Loaded">
            <EventTrigger.Actions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ellipse1" Storyboard.TargetProperty="(Canvas.Left)" >
                            <SplineDoubleKeyFrame KeyTime="0:0:5" Value="250" KeySpline="0.25,0 0.5,0.7"></SplineDoubleKeyFrame>
                            <SplineDoubleKeyFrame KeyTime="0:0:10" Value="500" KeySpline="0.25,0.8 0.2,0.4"></SplineDoubleKeyFrame>
                        </DoubleAnimationUsingKeyFrames>

                        <DoubleAnimation Storyboard.TargetName="ellipse2" Storyboard.TargetProperty="(Canvas.Left)" To="500" Duration="0:0:10">
                        </DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger.Actions>
        </EventTrigger>
    </Window.Triggers>
    <Canvas Margin="10">
        <Ellipse Name="ellipse1" Canvas.Left="0" Fill="Red" Width="10" Height="10"></Ellipse>
        <Ellipse Name="ellipse2" Canvas.Top="150" Canvas.Left="0" Fill="Red" Width="10" Height="10"></Ellipse>
    </Canvas>
</Window>

   
    
    
    
    
    
     

   
      
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:s="clr-namespace:System;assembly=mscorlib">


    <Ellipse Name="elips" Width="24" Height="24" Fill="Red" 
             Canvas.Left="96">

        <Ellipse.Triggers>
            <EventTrigger RoutedEvent="Ellipse.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetName="elips" RepeatBehavior="Forever">
                        <DoubleAnimation 
                                Storyboard.TargetProperty="(Canvas.Top)"
                                From="96" To="480" Duration="0:0:1"
                                AutoReverse="True" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Ellipse.Triggers>
    </Ellipse>
</Canvas>

   
    
    
    
    
    
     

   
      

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:s="clr-namespace:System;assembly=mscorlib">


    <Ellipse Name="elips" Width="20" Height="20" Fill="Red" 
             Canvas.Left="200">

        <Ellipse.Triggers>
            <EventTrigger RoutedEvent="Ellipse.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetName="elips" RepeatBehavior="Forever">
                        <DoubleAnimation 
                                Storyboard.TargetProperty="(Canvas.Top)"
                                From="96" To="490" Duration="0:0:1"
                                AutoReverse="True" 
                                AccelerationRatio="1" />

                        <ParallelTimeline BeginTime="0:0:0.98" 
                                          AutoReverse="True">

                            <DoubleAnimation Storyboard.TargetProperty="Width"
                                             To="32" Duration="0:0:0.02" />

                            <DoubleAnimation Storyboard.TargetProperty="Height"
                                             To="16" Duration="0:0:0.02" />

                            <DoubleAnimation 
                                    Storyboard.TargetProperty="(Canvas.Left)"
                                    From="0" To="-4"  Duration="0:0:0.02"
                                    IsAdditive="True" />
                        </ParallelTimeline>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Ellipse.Triggers>
    </Ellipse>
</Canvas>

   
    
    
    
    
    
     

   
      

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Canvas.Resources>
        <PathGeometry x:Key="path"
                      Figures="M 0 0 C 300 0, 400 400, 700 200
                               S 0 300 600 576 S 400 700 100 200" />
    </Canvas.Resources>

    <Path Stroke="Black" Data="{StaticResource path}" />

    <Button>
        Button
        <Button.RenderTransform>
            <MatrixTransform x:Name="xform" />
        </Button.RenderTransform>
    </Button>

    <Canvas.Triggers>
        <EventTrigger RoutedEvent="Canvas.Loaded">
            <BeginStoryboard>
                <Storyboard RepeatBehavior="Forever">
                    <MatrixAnimationUsingPath 
                        Storyboard.TargetName="xform"
                        Storyboard.TargetProperty="Matrix"
                        Duration="0:0:10" 
                        PathGeometry="{StaticResource path}"
                        DoesRotateWithTangent="True" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Canvas.Triggers>
</Canvas>

   
    
    
    
    
    
     

   
      

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Path Canvas.Left="150" Canvas.Top="150" StrokeThickness="25"
          Data="M 0 -100 
                C -55 -100, -100  -55, -100 0
                S  55 -100,    0 -100">
        <Path.Stroke>
            <LinearGradientBrush SpreadMethod="Repeat">
                <LinearGradientBrush.Transform>
                    <TranslateTransform x:Name="xform" /> 
                </LinearGradientBrush.Transform>
                <LinearGradientBrush.GradientStops>
                    <GradientStop Offset="0.00" Color="Red" />
                    <GradientStop Offset="0.14" Color="Orange" />
                    <GradientStop Offset="1.00" Color="Red" />
                </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>
        </Path.Stroke>
        <Path.Triggers>
            <EventTrigger RoutedEvent="Path.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetName="xform" TargetProperty="X">
                        <DoubleAnimation From="0" To="621" 
                                         Duration="0:0:2"
                                         RepeatBehavior="Forever" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Path.Triggers>
    </Path>
</Canvas>

   
    
    
    
    
    
     

BLE>



   
      
<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Path Fill="Blue">
        <Path.Data>
            <EllipseGeometry x:Name="elips"
                             RadiusX="12" RadiusY="12" />
        </Path.Data>

        <Path.Triggers>
            <EventTrigger RoutedEvent="Path.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetName="elips" TargetProperty="Center">
                        <PointAnimationUsingPath Duration="0:0:2.5" 
                                                 AutoReverse="True"
                                                 RepeatBehavior="Forever">
                            <PointAnimationUsingPath.PathGeometry>
                                <PathGeometry 
                                    Figures="M 6 288 C 576 0, 0 0, 480 288" />
                            </PointAnimationUsingPath.PathGeometry>
                        </PointAnimationUsingPath>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Path.Triggers>
    </Path>
</Canvas>