Learning C# 3.0

Animations

This control and resource stuff is great, but it’s not exactly exciting, we know. We promised you animations, and animations you shall have. The best way to make animations in WPF is with a tool called Expression Blend (available at http://www.microsoft.com/expression), but in this case, we’ll show you how to do it the hard way so that you’ll know what’s going on in the XAML. In this example, you’re going to start with a simple square, and perform some of the more basic animations on it. The square is in fact an instance of the built-in Rectangle control, which is part of the WPF schema. However, you can apply these animations to many other controls.

The first thing to do is define the Rectangle control. Create a new WPF project to start with. You could drag a Rectangle control out of the toolbar onto the window, but in this case, it’s easier to just define the rectangle in the XAML. Add the following element inside the <Grid> element:

<Rectangle Name="myRectangle" Width="100" Height="100">
</Rectangle>

Now you should see a square in the Design window, 100 units on a side. You didn’t define the Margin property, so the square will be centered in the window, which is fine. The first thing you’re going to do is animate the color of the square, and to do that, you’ll need the square to have some color first. If you click on the Rectangle element, you’ll see it has a Fill property, which is the interior color of the square (as opposed to the outside border, which we’ll leave ...