Creating property-based animations

WPF includes a sophisticated and elegant animation engine that takes animations to the declarative level. Instead of dealing with timers and graphic updates, an animation object holds all the required information for the animation to commence. WPF does the rest. In this recipe, we'll take a look at property-based animations – the simplest and most often used kind.

Getting ready

Make sure Visual Studio is up and running.

How to do it...

We'll create some property-based animations on some shapes inside a Canvas, showing the basic steps involved in creating animations:

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

2. Open MainWindow.xaml. Add the following two rows to the existing Grid:

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

3. Add a Canvas to the second row with a bunch of elements:

   <Canvas Grid.Row="1">
       <Rectangle Canvas.Left="60" Canvas.Top="40" Width="40" ...