Chapter 7. Transforming and Animating Content

Silverlight applications can be dynamic even if they do not use JavaScript. The content can be transformed and animated, both of which we will cover here. The transformation is nothing that you can watch, but rather a calculation that takes effect when the plug-in renders the Silverlight content. For example, you can rotate or skew elements. An animation, on the other hand, can really change the visual appearance of the applications: elements may move or change their color. As always, you will find many small and self-contained examples that showcase the most interesting and important Silverlight options.


A transformation is technically only a change of one or more values. For instance, if an element is rotated, its position and the location of all the drawing points of the element change. If an element is moved to another position (that’s a transformation as well), basically the positions of all corners of the element change (if we leave fillings aside). Silverlight supports five transformations:


Changes the position of an element


Scales an element by multiplying its dimension horizontally and vertically


Skews an element by using a horizontal and a vertical angle


Rotates an element by using an angle


Multiplies all points of an element by a given matrix, and uses the result as the new value

Let’s start with the <TranslateTransform> element, which just ...

Get Essential Silverlight 2 Up-to-Date now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.