Creates an arbitrary affine matrix transformation that is used to manipulate objects or coordinate systems in a two-dimensional plane.

<MatrixTransform   .../>

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

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

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

You can offset the local (0,0) position for an object on a Canvas by using the Canvas.Left and Canvas.Top properties, but this does not operate as a transform; the object retains its own local (0,0) position in this case for transform purposes.

You can apply multiple transforms with a TransformGroup object.

For more information on basic concepts, see Transforms. Note that the Transforms topic is written primarily for users of the managed API, and may not have code examples or specific information that address the JavaScript API scenarios.

The following example transforms the position and skew of a rectangle by using a MatrixTransform object.

  Width="400" Height="300">
  <Rectangle Width="60" Height="60" Fill="Blue">

        <MatrixTransform.Matrix >

          <!-- This matrix transforms the x,y position of
               the rectangle and skews it. -->
          <Matrix OffsetX="30" OffsetY="100" M12="0.5" />


Community Additions