Chapter 2. Animations in Business Logic Silverlight Applications

When you build a Silverlight application, animations can play a large role in spicing it up, making it more user-friendly and intuitive. This chapter shows how to achieve this by employing the following techniques:

• Using VisualStateManager to animate custom controls

• Animating navigation transitions

Animating Silverlight controls

Silverlight provides many built-in controls. It also empowers the developers to create their own controls – so called custom controls. Even the built-in Silverlight controls can be fully re-styled with all of their visual parts replaced by the designer. In the following sections, you will see how to use the VisualStateManager concept in order to provide custom animations for a built-in Silverlight button and later for a custom button-like control.

Tools for animating controls

Here is some bad news and good news for the WPF developers: the bad news – Silverlight does not have a built-in property or data triggers to trigger a visual change within a style or a template; the good news – the MS Expression Blend SDK functionality to a large degree mitigates this deficiency by providing classes to replace missing triggers. DataTriggers can detect a change of property within a control and fire, for example, ChangePropertyAction – which can trigger some visual property...

Animating navigation panels

Almost any application provides a way to switch (navigate) between different screens. Good navigation functionality should give the users ideas of whether it was a forward or backward movement, and give hints of how to move to the previously shown screens. This section describes ways of creating intuitive navigation functionality using animations.

Let's assume that we are moving from screen to screen mostly in a bidirectional way either forward (to the right) or backwards (to the left). Under a forward move, it will make sense to show the new panel coming from the right and the old panel disappearing on the left-hand side of the application. Under a backward movement, the panels will move in the opposite direction. A more involved animation can result in a page-like movement with the previous page being flipped away, and a new page turned open for the view.

The NavigationAnimations.sln sample shows how to create such animations. The sample is built around TransitioningContentControl...

Summary

Using button state animations as an example, we saw in this chapter how to change the transition animations on a control, whether it is a Silverlight built-in control or a custom control.

We have also seen how to animate the navigation between pages in a Silverlight application and described TransitionContentControl in detail.

The next chapter will describe generating and animating random fields imitating natural processes, such as clouds or fire.