Creating path-based animations

Property-based animations are certainly the most common animations to use. WPF supports another form of animation – path-based animation; that is, an animation that runs along a PathGeometry. Let's see how to achieve that.

Getting ready

Make sure Visual Studio is up and running.

How to do it...

We'll create a circle that moves along a path laid out by a PathGeometry object:

1. Create a new WPF application named CH09.PathBasedAnimation.

2. Open MainWindow.xaml. Add a PathGeometry object to the Resources property of Window that describes a rectangular path:

   <Window.Resources>
       <PathGeometry x:Key="rg">
           <PathFigure IsClosed="True" StartPoint="20,20">
               <PolyLineSegment 
                   Points="300,20 300,200 20,200 20,200" />
           </PathFigure>
       </PathGeometry>
   </Window.Resources>

3. Add two rows to the existing Grid as follows:

   <Grid.RowDefinitions>
     <RowDefinition Height="Auto" />
     <RowDefinition...