Export (0) Print
Expand All
This topic has not yet been rated - Rate this topic

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)
XML Namespace:  http://schemas.microsoft.com/winfx/2006/xaml/presentation

[TypeConverterAttribute(typeof(TransformConverter))] 
[LocalizabilityAttribute(LocalizationCategory.None, Readability=Readability.Unreadable)] 
public abstract class Transform : GeneralTransform
/** @attribute TypeConverterAttribute(System.Windows.Media.TransformConverter) */ 
/** @attribute LocalizabilityAttribute(LocalizationCategory.None, Readability=Readability.Unreadable) */ 
public abstract class Transform extends GeneralTransform
TypeConverterAttribute(System.Windows.Media.TransformConverter) 
LocalizabilityAttribute(LocalizationCategory.None, Readability=Readability.Unreadable) 
public abstract class Transform extends GeneralTransform
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.

<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>

// 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).

<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>

// 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 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.

System.Object
   System.Windows.Threading.DispatcherObject
     System.Windows.DependencyObject
       System.Windows.Freezable
         System.Windows.Media.Animation.Animatable
           System.Windows.Media.GeneralTransform
            System.Windows.Media.Transform
               Derived Classes
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 98, Windows Server 2000 SP4, Windows CE, Windows Millennium Edition, Windows Mobile for Pocket PC, Windows Mobile for Smartphone, Windows Server 2003, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP SP2, Windows XP Starter Edition

The Microsoft .NET Framework 3.0 is supported on Windows Vista, Microsoft Windows XP SP2, and Windows Server 2003 SP1.

.NET Framework

Supported in: 3.0
Did you find this helpful?
(1500 characters remaining)
Thank you for your feedback

Community Additions

ADD
Show:
© 2014 Microsoft. All rights reserved.