Adding animation easing to animations

Property-based animations are linear – they progress at a constant rate. This is fine for many scenarios, but for some scenarios this feels too mechanical. Key frame animations can use Bezier-based interpolations (which are certainly not linear), but it's not easy to configure or guess their effects.

Animation easing (introduced in WPF 4) provides a viable alternative that can turn a (maybe boring) linear animation into a non-linear one.

Getting ready

Make sure Visual Studio is up and running.

How to do it...

We'll create a linear animation and another same animation mutated with animation easing:

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

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

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

3. Add a StackPanel to the first row of the Grid. Place two buttons inside similar to the following:

   <StackPanel Orientation="Horizontal...