DoubleAnimationUsingPath.Source Property

Gets or sets the aspect of this animation's PathGeometry that determines its output value.

Namespace:  System.Windows.Media.Animation
Assembly:  PresentationCore (in PresentationCore.dll)
XMLNS for XAML: http://schemas.microsoft.com/winfx/2006/xaml/presentation, http://schemas.microsoft.com/netfx/2007/xaml/presentation

member Source : PathAnimationSource with get, set
<object Source="PathAnimationSource" .../>

Property Value

Type: System.Windows.Media.Animation.PathAnimationSource
The aspect of this animation's PathGeometry that determines its output value. The default value is X.

Identifier field

SourceProperty

Metadata properties set to true

None

This example shows how to rotate (pivot) an object along a geometric path that is defined by a PathGeometry object.

The following example uses three DoubleAnimationUsingPath objects to move a rectangle along a geometric path.

  • The first DoubleAnimationUsingPath animates a RotateTransform that is applied to the rectangle. The animation generates angle values. It makes the rectangle rotate (pivot) along the contours of the path.

  • The other two objects animate the X and Y values of a TranslateTransform that is applied to the rectangle. They make the rectangle move horizontally and vertically along the path.

<Page 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  mc:Ignorable="PresentationOptions">
  <Page.Resources>

    <!-- This is the geometry creates the animation path. Because 
         this example uses it multiple times, it's declared as a resource and
         frozen to improve performance. -->
    <PathGeometry x:Key="AnimationPath"
      Figures="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100"
      PresentationOptions:Freeze="True" />
  </Page.Resources>

  <Canvas Width="400" Height="400">



    <!-- The object to animate. -->
    <Rectangle   
      Width="30" Height="30" Fill="Blue">
      <Rectangle.RenderTransform>
        <TransformGroup>
          <RotateTransform x:Name="AnimatedRotateTransform" />
          <TranslateTransform x:Name="AnimatedTranslateTransform"  />
        </TransformGroup>        
      </Rectangle.RenderTransform>   

      <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Path.Loaded">
          <BeginStoryboard>
            <Storyboard RepeatBehavior="Forever" AutoReverse="True" >

              <!-- Generates angle values (in degrees) from
                   the path. This animation is used to
                   rotate the rectangle. -->
              <DoubleAnimationUsingPath
                Storyboard.TargetName="AnimatedRotateTransform"
                Storyboard.TargetProperty="Angle"
                PathGeometry="{StaticResource AnimationPath}"
                Source="Angle"
                Duration="0:0:5"  />

              <!-- Generates horizontal offset values from
                   the path. This animation is used to 
                   animate the rectangle horizontally. -->
              <DoubleAnimationUsingPath
                Storyboard.TargetName="AnimatedTranslateTransform"
                Storyboard.TargetProperty="X"
                PathGeometry="{StaticResource AnimationPath}"
                Source="X" 
                Duration="0:0:5"  />

              <!-- Generates vertical offset values from
                   the path. This animation is used to move
                   the rectangle vertically. -->
              <DoubleAnimationUsingPath
                Storyboard.TargetName="AnimatedTranslateTransform"
                Storyboard.TargetProperty="Y"
                PathGeometry="{StaticResource AnimationPath}"
                Source="Y" 
                Duration="0:0:5"  />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Rectangle.Triggers>
    </Rectangle>
  </Canvas>
</Page>
No code example is currently available or this language may not be supported.

Another way to rotate an object by using a geometric path is to use a MatrixAnimationUsingPath object and set its DoesRotateWithTangent property to true. For more information and an example, see How to: Rotate an Object by Using a Geometric Path (Matrix Animation).

For the complete sample, see Path Animation Sample.

.NET Framework

Supported in: 4.5, 4, 3.5, 3.0

.NET Framework Client Profile

Supported in: 4, 3.5 SP1

Windows 8.1, Windows Server 2012 R2, Windows 8, Windows Server 2012, Windows 7, Windows Vista SP2, Windows Server 2008 (Server Core Role not supported), Windows Server 2008 R2 (Server Core Role supported with SP1 or later; Itanium not supported)

The .NET Framework does not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.

Was this page helpful?
(1500 characters remaining)
Thank you for your feedback
Show:
© 2014 Microsoft