Introducing Transformations

Transformations are special objects that modify the appearance of visual elements of type FrameworkElement, applying interesting effects such as rotation or translation, keeping unchanged the visual element’s functional behavior. For example, with transformations you can rotate a ListBox 180 degrees, but it will still work as usual; only the layout changes. Transformations are important to understand if you intend to apply animations to visual elements. I cover animations in the next section. Keep in mind that when you apply animations, basically you animate transformation objects that affect visual elements. You apply transformations by adding a RenderTransform node for your visual element at the XAML level. I explain this by dividing a Grid into four cells where each cell must contain a ListBox. To accomplish this, write the following XAML code that divides the grid and provides a common set of properties for ListBox instances via a style:

At this point, each cell contains a ListBox, as in the next sections. Before going into that, switch to the code behind file and handle the Window.Loaded event as follows:

The DataContext property is basically the data-source for a given container, and all children controls pick up data from it. In this case, assigning the Grid1.DataContext property populates all children ListBoxes.