TGML Skewing: <SkewX> and <SkewY>

SkewX and SkewY skew (stretch) the coordinate system for the immediate parent element about a specified point.

Skew X specifies a skew transformation along the X axis. The skew angle is measured in degrees from the Y axis.

Skew Y specifies a skew transformation along the Y axis. The skew angle is measured in degrees from the X axis.

Attribute Type Description

Angle

Double

The skew angle, measured in degrees.
A positive value implies counter-clockwise skew. A negative value implies clockwise skew.
Default: "0.0"
Inheritable: No
Animatable: Yes

Center

Point

Describes the position of the center point of the skew.
For more information, see the TGML Rotation <Rotate> section.
Default: "0.5 , 0.5"
Inheritable: No
Animatable: Yes

Example:

Copy
<TGML>
    <Polygon Points="50.0,50.0 150.0,50.0 150.0,150.0 50.0,150.0" Stroke="#000000" Fill="None"/>
    <Polygon Points="50.0,50.0 150.0,50.0 150.0,150.0 50.0,150.0" Stroke="#0000FF" Fill="#FFFF00" Opacity="0.75">
        <Skew Angle="45" Center="0.5,0.5"/>
    </Polygon>

    <Polygon Points="250.0,50.0 350.0,50.0 350.0,150.0 250.0,150.0" Stroke="#000000" Fill="None"/>
    <Polygon Points="250.0,50.0 350.0,50.0 350.0,150.0 250.0,150.0" Stroke="#0000FF" Fill="#FF0000" Opacity="0.75">
        <Skew Angle="45" Center="0.5,0.5"/>
    </Polygon>
</TGML>

Example on screen: