#767 – Transform Basics

In WPF, you can easily apply one or more 2D transforms to user interface elements.  A transform is a mathematical function applied to a user interface element that does one or more of the following:

  • Scales the element – make it bigger or smaller
  • Rotates the element – spin the element around some point
  • Translates the element – move the element up/down/left/right
  • Skews the element – tilt the element, e.g. turn a rectangular element into a rhomboid

In the example below, the second label has a rotation transform applied to it, which rotates it by 15 degrees (clockwise).

    <StackPanel Orientation="Horizontal">
        <Label Content="Grand Canyon" Background="LightPink"
               VerticalAlignment="Center" Margin="5"/>
        <Label Content="Grand Tetons" Background="Bisque"
               VerticalAlignment="Center" Margin="5" >
            <Label.RenderTransform>
                <RotateTransform Angle="15"/>
            </Label.RenderTransform>
        </Label>
    </StackPanel>

764-001