flash.geom

# Transform - AS3

Package | flash.geom
Class | public class Transform
Inheritance | Transform Object
Subclasses | Transform

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

The Transform class provides access to color adjustment properties and two- or three-dimensional transformation objects that can be applied to a display object. During the transformation, the color or the orientation and position of a display object is adjusted (offset) from the current values or coordinates to new values or coordinates. The Transform class also collects data about color and two-dimensional matrix transformations that are applied to a display object and all of its parent objects. You can access these combined transformations through the `concatenatedColorTransform` and `concatenatedMatrix` properties.

To apply color transformations: create a ColorTransform object, set the color adjustments using the object's methods and properties, and then assign the `colorTransformation` property of the `transform` property of the display object to the new ColorTransformation object.

To apply two-dimensional transformations: create a Matrix object, set the matrix's two-dimensional transformation, and then assign the `transform.matrix` property of the display object to the new Matrix object.

To apply three-dimensional transformations: start with a three-dimensional display object. A three-dimensional display object has a `z` property value other than zero. You do not need to create the Matrix3D object. For all three-dimensional objects, a Matrix3D object is created automatically when you assign a `z` value to a display object. You can access the display object's Matrix3D object through the display object's `transform` property. Using the methods of the Matrix3D class, you can add to or modify the existing transformation settings. Also, you can create a custom Matrix3D object, set the custom Matrix3D object's transformation elements, and then assign the new Matrix3D object to the display object using the `transform.matrix` property.

To modify a perspective projection of the stage or root object: use the `transform.matrix` property of the root display object to gain access to the PerspectiveProjection object. Or, apply different perspective projection properties to a display object by setting the perspective projection properties of the display object's parent. The child display object inherits the new properties. Specifically, create a PerspectiveProjection object and set its properties, then assign the PerspectiveProjection object to the `perspectiveProjection` property of the parent display object's `transform` property. The specified projection transformation then applies to all the display object's three-dimensional children.

Since both PerspectiveProjection and Matrix3D objects perform perspective transformations, do not assign both to a display object at the same time. Use the PerspectiveProjection object for focal length and projection center changes. For more control over the perspective transformation, create a perspective projection Matrix3D object.

View the examples

Related API Elements

flash.display.DisplayObject.transform
flash.geom.ColorTransform
flash.geom.Matrix
flash.geom.Matrix3D
flash.geom.PerspectiveProjection

Public Properties
Hide Inherited Public Properties
Show Inherited Public Properties

| Property | Defined By
--- | --- | ---
|  | colorTransform : flash.geom:ColorTransform A ColorTransform object containing values that universally adjust the colors in the display object. | Transform
|  | concatenatedColorTransform : flash.geom:ColorTransform [read-only] A ColorTransform object representing the combined color transformations applied to the display object and all of its parent objects, back to the root level. | Transform
|  | concatenatedMatrix : Matrix [read-only] A Matrix object representing the combined transformation matrixes of the display object and all of its parent objects, back to the root level. | Transform
|  | constructor : Object A reference to the class object or constructor function for a given object instance. | Object
|  | matrix : Matrix A Matrix object containing values that alter the scaling, rotation, and translation of the display object. | Transform
|  | matrix3D : Matrix3D Provides access to the Matrix3D object of a three-dimensional display object. | Transform
|  | perspectiveProjection : PerspectiveProjection Provides access to the PerspectiveProjection object of a three-dimensional display object. | Transform
|  | pixelBounds : Rectangle [read-only] A Rectangle object that defines the bounding rectangle of the display object on the stage. | Transform

Public Methods
Hide Inherited Public Methods
Show Inherited Public Methods

| Method | Defined By
--- | --- | ---
|  | getRelativeMatrix3D(relativeTo:DisplayObject):Matrix3D Returns a Matrix3D object, which can transform the space of a specified display object in relation to the current display object's space. | Transform
|  | hasOwnProperty(name:String):Boolean Indicates whether an object has a specified property defined. | Object
|  | isPrototypeOf(theClass:Object):Boolean Indicates whether an instance of the Object class is in the prototype chain of the object specified as the parameter. | Object
|  | propertyIsEnumerable(name:String):Boolean Indicates whether the specified property exists and is enumerable. | Object
|  | setPropertyIsEnumerable(name:String, isEnum:Boolean = true):void Sets the availability of a dynamic property for loop operations. | Object
|  | toLocaleString():String Returns the string representation of this object, formatted according to locale-specific conventions. | Object
|  | toString():String Returns the string representation of the specified object. | Object
|  | valueOf():Object Returns the primitive value of the specified object. | Object

Property Detail

### colorTransform

property

`colorTransform:flash.geom:ColorTransform`

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

A ColorTransform object containing values that universally adjust the colors in the display object.

Implementation
`public function get colorTransform():flash.geom:ColorTransform`
`public function set colorTransform(value:flash.geom:ColorTransform):void`
Throws

| `TypeError` — The colorTransform is null when being set

More examples

Adjusting DisplayObject colors

Related API Elements

flash.geom.ColorTransform

### concatenatedColorTransform

property

`concatenatedColorTransform:flash.geom:ColorTransform` [read-only]

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

A ColorTransform object representing the combined color transformations applied to the display object and all of its parent objects, back to the root level. If different color transformations have been applied at different levels, all of those transformations are concatenated into one ColorTransform object for this property.

Implementation
`public function get concatenatedColorTransform():flash.geom:ColorTransform`

Related API Elements

flash.geom.ColorTransform

### concatenatedMatrix

property

`concatenatedMatrix:Matrix` [read-only]

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

A Matrix object representing the combined transformation matrixes of the display object and all of its parent objects, back to the root level. If different transformation matrixes have been applied at different levels, all of those matrixes are concatenated into one matrix for this property. Also, for resizeable SWF content running in the browser, this property factors in the difference between stage coordinates and window coordinates due to window resizing. Thus, the property converts local coordinates to window coordinates, which may not be the same coordinate space as that of the Stage.

Implementation
`public function get concatenatedMatrix():Matrix`

### matrix

property

`matrix:Matrix`

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

A Matrix object containing values that alter the scaling, rotation, and translation of the display object.

If the `matrix` property is set to a value (not `null`), the `matrix3D` property is `null`. And if the `matrix3D` property is set to a value (not `null`), the `matrix` property is `null`.

Implementation
`public function get matrix():Matrix`
`public function set matrix(value:Matrix):void`
Throws

| `TypeError` — The matrix is null when being set

Related API Elements

flash.geom.Matrix

### matrix3D

property

`matrix3D:Matrix3D`

Language Version: | ActionScript 3.0

Runtime Versions: | Flash Player 10, AIR 1.5

Provides access to the Matrix3D object of a three-dimensional display object. The Matrix3D object represents a transformation matrix that determines the display object's position and orientation. A Matrix3D object can also perform perspective projection.

If the `matrix` property is set to a value (not `null`), the `matrix3D` property is `null`. And if the `matrix3D` property is set to a value (not `null`), the `matrix` property is `null`.

Implementation
`public function get matrix3D():Matrix3D`
`public function set matrix3D(value:Matrix3D):void`

Related API Elements

flash.geom.Matrix3D

### perspectiveProjection

property

`perspectiveProjection:PerspectiveProjection`

Language Version: | ActionScript 3.0

Runtime Versions: | Flash Player 10, AIR 1.5

Provides access to the PerspectiveProjection object of a three-dimensional display object. The PerspectiveProjection object can be used to modify the perspective transformation of the stage or to assign a perspective transformation to all the three-dimensional children of a display object.

Based on the field of view and aspect ratio (dimensions) of the stage, a default PerspectiveProjection object is assigned to the root object.

Implementation
`public function get perspectiveProjection():PerspectiveProjection`
`public function set perspectiveProjection(value:PerspectiveProjection):void`

More examples

Example: Perspective projection

Related API Elements

flash.geom.PerspectiveProjection

### pixelBounds

property

`pixelBounds:Rectangle` [read-only]

Language Version: | ActionScript 3.0

Runtime Versions: | AIR 1.0, Flash Player 9, Flash Lite 4

A Rectangle object that defines the bounding rectangle of the display object on the stage.

Implementation
`public function get pixelBounds():Rectangle`
Method Detail

### getRelativeMatrix3D

()
method

`public function getRelativeMatrix3D(relativeTo:DisplayObject):Matrix3D`

Language Version: | ActionScript 3.0

Runtime Versions: | Flash Player 10, AIR 1.5

Returns a Matrix3D object, which can transform the space of a specified display object in relation to the current display object's space. You can use the `getRelativeMatrix3D()` method to move one three-dimensional display object relative to another three-dimensional display object.

Parameters

| `relativeTo:DisplayObject` — The display object relative to which the transformation occurs. To get a Matrix3D object relative to the stage, set the parameter to the `root` or `stage` object. To get the world-relative matrix of the display object, set the parameter to a display object that has a perspective transformation applied to it.

Returns

| `Matrix3D` — A Matrix3D object that can be used to transform the space from the `relativeTo` display object to the current display object space.

More examples

Using Matrix3D objects for reordering display

Related API Elements

flash.geom.Matrix3D
Examples How to use this example
TransformExample.as
The following example uses the TransformExample class to skew the bottom side of a square sprite filled with a gradient pattern. Each time the user clicks the square, the application transforms the sprite by skewing it with the following steps:

1. The `TransformExample()` constructor creates a new sprite object `target`.
2. The `TransformExample()` constructor calls the `draw()` method, which draws a gradient square in the sprite.
3. The `TransformExample()` constructor adds a click event listener for the sprite, which is handled by the `clickHandler()` method.
4. The `clickHandler()` method creates a new Matrix object, `skewMatrix`, which is set to apply a skew effect. Another matrix, `tempMatrix`, is assigned to the current transformation matrix of the sprite, and then is combined with `skewMatrix` using the `concat()` method. This matrix is assigned to the `transform.matrix` property of the square sprite. Each time the user clicks the square, the call to the `clickHandler()` modifies the shape of the square by skewing it.
5. Additionally, the `clickHandler()` method creates a new ColorTransform object. The `redOffset` property of the new ColorTransform is set to the current value of redOffset and increased by 25. Likewise, the `blueOffset` property is reduced by 25. With each click, the colors of the sprite change.

Copy

    package {
        import flash.display.Sprite;
        import flash.display.GradientType;
        import flash.geom.Matrix;
        import flash.geom.ColorTransform;
        import flash.events.MouseEvent;

        public class TransformExample extends Sprite {
            public function TransformExample() {
                var target:Sprite = new Sprite();
                draw(target);
                addChild(target);
                target.useHandCursor = true;
                target.buttonMode = true;
                target.addEventListener(MouseEvent.CLICK, clickHandler)
            }
            public function draw(sprite:Sprite):void {
                var red:uint = 0xFF0000;
                var green:uint = 0x00FF00;
                var blue:uint = 0x0000FF;
                var size:Number = 100;
                sprite.graphics.beginGradientFill(GradientType.LINEAR, [red, blue, green], [1, 0.5, 1], [0, 200, 255]);
                sprite.graphics.drawRect(0, 0, 100, 100);
            }
            public function clickHandler(event:MouseEvent):void {
                var skewMatrix:Matrix = new Matrix();
                skewMatrix.c = 0.25;
                var tempMatrix:Matrix = this.transform.matrix;
                tempMatrix.concat(skewMatrix);
                this.transform.matrix = tempMatrix;

                var rOffset:Number = this.transform.colorTransform.redOffset + 25;
                var bOffset:Number = this.transform.colorTransform.blueOffset - 25;
                this.transform.colorTransform = new ColorTransform(1, 1, 1, 1, rOffset, 0, bOffset, 0);
            }
        }
    }

© 2015 Adobe Systems Incorporated. All rights reserved.
Mon Apr 10 2017, 12:28 PM -07:00