RotateTransform Object

Rotates an object clockwise about a specified point in a 2-D x-y coordinate system.

Properties

Angle, CenterX, CenterY, Name

Methods

Equals, FindName, GetHost, GetValue, SetValue

Remarks

A RotateTransform is defined by the following properties: Angle rotates an object by a specified angle about the point CenterX, CenterY.

When you use a RotateTransform, the transformation rotates the coordinate system for a particular object about the point 0, 0. Therefore, depending on the position of the object, it might not rotate in place (around its center). For example, if an object is positioned 200 units from 0 along the x-axis, a rotation of 30 degrees can swing the object 30 degrees along a circle that has a radius of 200, which is drawn around the origin. To rotate an object in place, set the CenterX and CenterY of the RotateTransform to the center of the object to rotate.

The local 0,0 for an object can be offset on a Canvas using Canvas.Left and Canvas.Top, but this does not count as a transform; the object retains its own local 0,0 in this case for transform purposes. For details on this concept, see Object Layout in Silverlight.

Multiple transforms can be applied with a TransformGroup.

Examples

Transforms can alter the display of text in your application to create a decorative effect. The following example shows text rotated 90 degrees using a RotateTransform.

TextBlock using a RotateTransform

The following code example uses a RotateTransform to rotate text. An Angle value of 90 rotates the element 90 degrees clockwise.

<!-- Rotate the text 90 degrees using a RotateTransform. -->
<TextBlock Text="Rotated Text" FontSize="32" Foreground="Teal">
  <TextBlock.RenderTransform>
    <RotateTransform Angle="90" />
  </TextBlock.RenderTransform>
</TextBlock>

The example below shows how to increase the Angle property value of a RotateTransform applied to a Rectangle every time the Rectangle is clicked.

<Canvas
  xmlns="https://schemas.microsoft.com/client/2007"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  Width="200" Height="200">
  <Rectangle MouseLeftButtonDown="handleMouseButtonDown"
    Width="50" Height="50"
    Fill="RoyalBlue">
    <Rectangle.RenderTransform>
      <!-- If you give the transform a name you can access it easily
           from code. -->
      <RotateTransform x:Name="myRotateTransform" />
    </Rectangle.RenderTransform>
  </Rectangle>
</Canvas>

function handleMouseButtonDown(sender, mouseEventArgs)
{
    // Retrieve a reference to the RotateTransform object.
    var rotateTransform = sender.findName("myRotateTransform");
    // Increase the Angle property value.
    rotateTransform.Angle = rotateTransform.Angle + 15;
}

See Also

Transform Overview
Transform