Click to Rate and Give Feedback
MSDN
MSDN Library
.NET Development
.NET Framework 3.5
Transform Class
Collapse All/Expand All Collapse All
This page is specific to
Microsoft Visual Studio 2008/.NET Framework 3.5

Other versions are also available for the following:
.NET Framework Class Library
Transform Class

Defines functionality that enables transformations in a 2-D plane. Transformations include rotation (RotateTransform), scale (ScaleTransform), skew (SkewTransform), and translation (TranslateTransform). This class hierarchy differs from the Matrix structure because it is a class and it supports animation and enumeration semantics.

Namespace:  System.Windows.Media
Assembly:  PresentationCore (in PresentationCore.dll)
Visual Basic (Declaration)
<TypeConverterAttribute(GetType(TransformConverter))> _
<LocalizabilityAttribute(LocalizationCategory.None, Readability := Readability.Unreadable)> _
Public MustInherit Class Transform _
    Inherits GeneralTransform
Visual Basic (Usage)
Dim instance As Transform
C#
[TypeConverterAttribute(typeof(TransformConverter))]
[LocalizabilityAttribute(LocalizationCategory.None, Readability = Readability.Unreadable)]
public abstract class Transform : GeneralTransform
Visual C++
[TypeConverterAttribute(typeof(TransformConverter))]
[LocalizabilityAttribute(LocalizationCategory::None, Readability = Readability::Unreadable)]
public ref class Transform abstract : public GeneralTransform
JScript
public abstract class Transform extends GeneralTransform
XAML
This class is abstract; see Inheritance Hierarchy for derived non-abstract classes usable in XAML.

Use the MatrixTransform class to create custom transformations that are not provided by the RotateTransform, ScaleTransform, SkewTransform, and TranslateTransform classes.

A 2-D x-y plane uses a 3x3 matrix for transformations. You can multiply affine transformation matrices to form linear transformations, such as rotation and skew (shear) that are followed by translation.

An affine transformation matrix has its final column equal to (0, 0, 1); therefore, you only have to specify the members in the first two columns.

A Windows Presentation Foundation (WPF) Matrix has the following structure:

The members in the last row, OffsetX and OffsetY, represent translation values.

Methods and properties usually specify the transformation matrix as a vector that has only six members; they are as follows:

    (M11, M12, M21, M22, OffsetX, OffsetY)

This example shows how to rotate an object. The example first creates a RotateTransform and then specifies its Angle in degrees.

The following example rotates a Polyline object 45 degrees about its upper-left corner.

XAML
<Canvas Height="200" Width="200">

  <!-- Rotates the Polyline 45 degrees about the point (0,0). -->
  <Polyline Points="25,25 0,50 25,75 50,50 25,25 25,0" 
    Stroke="Blue" StrokeThickness="10"
    Canvas.Left="75" Canvas.Top="50">
    <Polyline.RenderTransform>
      <RotateTransform CenterX="0" CenterY="0" Angle="45" />
    </Polyline.RenderTransform>
  </Polyline>
</Canvas>
C#
// Create a Polyline.
Polyline polyline1 = new Polyline();
polyline1.Points.Add(new Point(25, 25));
polyline1.Points.Add(new Point(0, 50));
polyline1.Points.Add(new Point(25, 75));
polyline1.Points.Add(new Point(50, 50));
polyline1.Points.Add(new Point(25, 25));
polyline1.Points.Add(new Point(25, 0));
polyline1.Stroke = Brushes.Blue;
polyline1.StrokeThickness = 10;

// Create a RotateTransform to rotate
// the Polyline 45 degrees about its
// top-left corner.
RotateTransform rotateTransform1 =
    new RotateTransform(45);
polyline1.RenderTransform = rotateTransform1;

// Create a Canvas to contain the Polyline.
Canvas canvas1 = new Canvas();
canvas1.Width = 200;
canvas1.Height = 200;
Canvas.SetLeft(polyline1, 75);
Canvas.SetTop(polyline1, 50);
canvas1.Children.Add(polyline1);

The CenterX and CenterY properties of the RotateTransform specify the point about which the object is rotated. This center point is expressed in the coordinate space of the element that is transformed. By default, the rotation is applied to (0,0), which is the upper-left corner of the object to transform.

The next example rotates a Polyline object clockwise 45 degrees about the point (25,50).

XAML
<Canvas Height="200" Width="200">

  <!-- Rotates the Polyline 45 degrees about the point (25,50). -->
  <Polyline Points="25,25 0,50 25,75 50,50 25,25 25,0" 
    Stroke="Blue" StrokeThickness="10"
    Canvas.Left="75" Canvas.Top="50">
    <Polyline.RenderTransform>
      <RotateTransform CenterX="25" CenterY="50" Angle="45" />
    </Polyline.RenderTransform>
  </Polyline>
</Canvas>
C#
// Create a Polyline.
Polyline polyline2 = new Polyline();
polyline2.Points = polyline1.Points;
polyline2.Stroke = Brushes.Blue;
polyline2.StrokeThickness = 10;

// Create a RotateTransform to rotate
// the Polyline 45 degrees about the
// point (25,50).
RotateTransform rotateTransform2 =
    new RotateTransform(45);
rotateTransform2.CenterX = 25;
rotateTransform2.CenterY = 50;
polyline2.RenderTransform = rotateTransform2;

// Create a Canvas to contain the Polyline.
Canvas canvas2 = new Canvas();
canvas2.Width = 200;
canvas2.Height = 200;
Canvas.SetLeft(polyline2, 75);
Canvas.SetTop(polyline2, 50);
canvas2.Children.Add(polyline2);

The following illustration shows the results of applying a Transform to the two objects.

Two objects that rotate 45 degrees from different rotational centers

45 degree rotations with different center points

The Polyline in the previous examples is a UIElement. When you apply a Transform to the RenderTransform property of a UIElement, you can use the RenderTransformOrigin property to specify an origin for every Transform that you apply to the element. Because the RenderTransformOrigin property uses relative coordinates, you can apply a transformation to the center of the element even if you do not know its size. For more information and for an example, see How to: Specify the Origin of a Transform by Using Relative Values.

For the complete sample, see 2-D Transforms Sample.

More Code

How to: Scale an Element This example shows how to use a ScaleTransform to scale an element.
How to: Skew an Element This example shows how to use a SkewTransform to skew an element. A skew, which is also known as a shear, is a transformation that stretches the coordinate space in a non-uniform manner. One typical use of a SkewTransform is for simulating 3-D depth in 2-D objects.
How to: Translate an Element This example shows how to translate (move) an element by using a TranslateTransform.
How to: Make an Element Spin in Place This example shows how to make an element spin by using a RotateTransform and a DoubleAnimation.
How to: Transform a Brush This example shows how to transform Brush objects by using their two transformation properties: RelativeTransform and Transform.
How to: Apply a Transform to an Element When an Event Occurs This example shows how to apply a ScaleTransform when an event occurs. The concept that is shown here is the same that you use for applying other types of transformations. For more information about the available types of transformations, see the Transform class or Transforms Overview.
How to: Apply a Transform to a BitmapImage This example demonstrates how to apply a Transform to a BitmapImage.
Any public static (Shared in Visual Basic) members of this type are thread safe. Any instance members are not guaranteed to be thread safe.

Windows 7, Windows Vista, Windows XP SP2, Windows Server 2008 R2, Windows Server 2008, Windows Server 2003

The .NET Framework and .NET Compact Framework do not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.

.NET Framework

Supported in: 3.5, 3.0
Tags What's this?: Add a tag
Community Content   What is Community Content?
Add new content RSS  Annotations
Processing
© 2010 Microsoft Corporation. All rights reserved. Terms of Use | Trademarks | Privacy Statement
Page view tracker