Composite​Transform Composite​Transform Composite​Transform Class

Definition

Applies multiple transform operations to an object.

public : sealed class CompositeTransform : Transform, ICompositeTransformpublic sealed class CompositeTransform : Transform, ICompositeTransformPublic NotInheritable Class CompositeTransform Inherits Transform Implements ICompositeTransform
<CompositeTransform .../>
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited methods

Inherited properties

Windows.UI.Xaml.Media.GeneralTransform.TryTransform(Windows.Foundation.Point,Windows.Foundation.Point)Windows.UI.Xaml.Media.GeneralTransform.TryTransform(Windows.Foundation.Point,Windows.Foundation.Point)Windows.UI.Xaml.Media.GeneralTransform.TryTransform(Windows.Foundation.Point,Windows.Foundation.Point)
Windows.UI.Xaml.Media.GeneralTransform.TryTransformCore(Windows.Foundation.Point,Windows.Foundation.Point)Windows.UI.Xaml.Media.GeneralTransform.TryTransformCore(Windows.Foundation.Point,Windows.Foundation.Point)Windows.UI.Xaml.Media.GeneralTransform.TryTransformCore(Windows.Foundation.Point,Windows.Foundation.Point)

Examples

This example shows how to apply the same transforms to an object by using either a CompositeTransform or a TransformGroup.

<StackPanel Margin="50">
    <Canvas Background="Black" Width="200" Height="200">
        <Rectangle Height="100" Width="100" Fill="Red">
            <Rectangle.RenderTransform>

                <!-- This one line of markup is the equivalent of the entire
             TransformGroup block in the other Canvas below. -->
                <CompositeTransform SkewX="30" Rotation="45" ScaleX="0.8" ScaleY="0.8" />
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas>

    <Canvas Margin="10" Background="Black" Width="200" Height="200">
        <Rectangle Height="100" Width="100" Fill="Red">
            <Rectangle.RenderTransform>
                <TransformGroup>

                    <!-- Note that you have to apply these transforms in 
                     a specific order to get the same effect as the
                     CompositeTransform. -->
                    <ScaleTransform ScaleX="0.8" ScaleY="0.8" />
                    <SkewTransform AngleX="30" />
                    <RotateTransform Angle="45" />
                </TransformGroup>
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas>
</StackPanel>

Remarks

CompositeTransform applies multiple transforms in this order:

  1. Scale (ScaleX, ScaleY )
  2. Skew (SkewX, SkewY )
  3. Rotate (Rotation )
  4. Translate (TranslateX, TranslateY )

If you want to apply multiple transforms to an object in a different order, you can create a TransformGroup and insert the transforms in your intended order.

CompositeTransform uses the same center point (CenterX, CenterY ) for all transformations. If you want to specify different center points per transform, use TransformGroup.

Constructors

CompositeTransform() CompositeTransform() CompositeTransform()

Initializes a new instance of the CompositeTransform class.

public : CompositeTransform()public CompositeTransform()Public Sub New()
Attributes

Properties

CenterX CenterX CenterX

Gets or sets the x-coordinate of the center point for all transforms specified by the CompositeTransform in device-independent pixel (DIP) relative to the upper left-hand corner of the element.

public : double CenterX { get; set; }public double CenterX { get; set; }Public ReadWrite Property CenterX As double
<CompositeTransform CenterX="double"/>
Value
double double double

The x-coordinate of the center point for all transforms specified by the CompositeTransform.

Attributes

CenterXProperty CenterXProperty CenterXProperty

Identifies the CenterX dependency property.

public : static DependencyProperty CenterXProperty { get; }public static DependencyProperty CenterXProperty { get; }Public Static ReadOnly Property CenterXProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the CenterX dependency property.

Attributes

CenterY CenterY CenterY

Gets or sets the y-coordinate of the center point for all transforms specified by the CompositeTransform in device-independent pixel (DIP) relative to the upper left-hand corner of the element.

public : double CenterY { get; set; }public double CenterY { get; set; }Public ReadWrite Property CenterY As double
<CompositeTransform CenterY="double"/>
Value
double double double

The y-coordinate of the center point for all transforms specified by the CompositeTransform.

Attributes

CenterYProperty CenterYProperty CenterYProperty

Identifies the CenterY dependency property.

public : static DependencyProperty CenterYProperty { get; }public static DependencyProperty CenterYProperty { get; }Public Static ReadOnly Property CenterYProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the CenterY dependency property.

Attributes

Rotation Rotation Rotation

Gets or sets the angle, in degrees, of clockwise rotation.

public : double Rotation { get; set; }public double Rotation { get; set; }Public ReadWrite Property Rotation As double
<CompositeTransform Rotation="double"/>
Value
double double double

The angle, in degrees, of clockwise rotation. The default is 0.

Attributes

RotationProperty RotationProperty RotationProperty

Identifies the Rotation dependency property.

public : static DependencyProperty RotationProperty { get; }public static DependencyProperty RotationProperty { get; }Public Static ReadOnly Property RotationProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the Rotation dependency property.

Attributes

ScaleX ScaleX ScaleX

Gets or sets the x-axis scale factor. You can use this property to stretch or shrink an object horizontally.

public : double ScaleX { get; set; }public double ScaleX { get; set; }Public ReadWrite Property ScaleX As double
<CompositeTransform ScaleX="double"/>
Value
double double double

The scale factor along the x-axis. The default is 1.

Attributes

ScaleXProperty ScaleXProperty ScaleXProperty

Identifies the ScaleX dependency property.

public : static DependencyProperty ScaleXProperty { get; }public static DependencyProperty ScaleXProperty { get; }Public Static ReadOnly Property ScaleXProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the ScaleX dependency property.

Attributes

ScaleY ScaleY ScaleY

Gets or sets the y-axis scale factor. You can use this property to stretch or shrink an object vertically.

public : double ScaleY { get; set; }public double ScaleY { get; set; }Public ReadWrite Property ScaleY As double
<CompositeTransform ScaleY="double"/>
Value
double double double

The scale factor along the y-axis. The default is 1.

Attributes

ScaleYProperty ScaleYProperty ScaleYProperty

Identifies the ScaleY dependency property.

public : static DependencyProperty ScaleYProperty { get; }public static DependencyProperty ScaleYProperty { get; }Public Static ReadOnly Property ScaleYProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the ScaleY dependency property.

Attributes

SkewX SkewX SkewX

Gets or sets the x-axis skew angle, which is measured in degrees counterclockwise from the y-axis. A skew transform can be useful for creating the illusion of three-dimensional depth in a two-dimensional object.

public : double SkewX { get; set; }public double SkewX { get; set; }Public ReadWrite Property SkewX As double
<CompositeTransform SkewX="double"/>
Value
double double double

The skew angle, which is measured in degrees counterclockwise from the y-axis. The default is 0.

Attributes

SkewXProperty SkewXProperty SkewXProperty

Identifies the SkewX dependency property.

public : static DependencyProperty SkewXProperty { get; }public static DependencyProperty SkewXProperty { get; }Public Static ReadOnly Property SkewXProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the SkewX dependency property.

Attributes

SkewY SkewY SkewY

Gets or sets the y-axis skew angle, which is measured in degrees counterclockwise from the x-axis. A skew transform can be useful for creating the illusion of three-dimensional depth in a two-dimensional object.

public : double SkewY { get; set; }public double SkewY { get; set; }Public ReadWrite Property SkewY As double
<CompositeTransform SkewY="double"/>
Value
double double double

The skew angle, which is measured in degrees counterclockwise from the x-axis. The default is 0.

Attributes

SkewYProperty SkewYProperty SkewYProperty

Identifies the SkewY dependency property.

public : static DependencyProperty SkewYProperty { get; }public static DependencyProperty SkewYProperty { get; }Public Static ReadOnly Property SkewYProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the SkewY dependency property.

Attributes

TranslateX TranslateX TranslateX

Gets or sets the distance to translate along the x-axis.

public : double TranslateX { get; set; }public double TranslateX { get; set; }Public ReadWrite Property TranslateX As double
<CompositeTransform TranslateX="double"/>
Value
double double double

The distance to translate (move) an object along the x-axis, in pixels. This property is read/write. The default is 0.

Attributes

TranslateXProperty TranslateXProperty TranslateXProperty

Identifies the TranslateX dependency property.

public : static DependencyProperty TranslateXProperty { get; }public static DependencyProperty TranslateXProperty { get; }Public Static ReadOnly Property TranslateXProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the TranslateX dependency property.

Attributes

TranslateY TranslateY TranslateY

Gets or sets the distance to translate (move) an object along the y-axis.

public : double TranslateY { get; set; }public double TranslateY { get; set; }Public ReadWrite Property TranslateY As double
<CompositeTransform TranslateY="double"/>
Value
double double double

The distance to translate (move) an object along the y-axis, in pixels. The default is 0.

Attributes

TranslateYProperty TranslateYProperty TranslateYProperty

Identifies the TranslateY dependency property.

public : static DependencyProperty TranslateYProperty { get; }public static DependencyProperty TranslateYProperty { get; }Public Static ReadOnly Property TranslateYProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the TranslateY dependency property.

Attributes

See Also