MovieClip의 center point 와 Scale변경

Adobe Flash/ActionScript 3.0 2011. 2. 2. 03:32
반응형
http://www.senocular.com/flash/tutorials/transformmatrix/

Transformation Conversions

Sometimes you may need to compare transformation matrix values with those that exist in the Flash IDE or to those used in more generic ActionScript properties. Transformation matrix values, however, do not always correlate with their other Flash counterparts. Translation, for instance, relates directly to those values expressed as x (_x) and y (_y) position in Flash, but scale, skew, and rotation are handled slightly differently.

translation

Translation is, for the most part, the easy one. The tx and ty properties in a matrix directly relate to the _x and _y properties provided by ActionScript to reflect a movie clip's position within it's parent timeline. The values present in the Flash IDE in the property inspector, however, can differ.

The Flash IDE allows for position to be based on two separate locations. That of the top left of the movie clip or that of the movie clip's center. The option of using either is presented in the coordinate grid of the info panel

This center option does not always represent the local 0,0 location, or origin, of the movie clip in question, though. It's actually related to the transformation center point provided by the transform tool and is represented as a small black and white circle in Flash. By default this is placed in the center of a movie clip instance but can be adjusted using the transform tool. In order for translation values, or even _x and _y for that matter, to match up with this transformation center point, it would need to be placed on the origin of the movie clip which is represented by a black and white cross.

The transformation center point is not accessible by ActionScript, so keep that in mind as you are working with movie clips in Flash. It is often best to keep the registration point aligned with the movie clip's origin so you have a direct relation with the values you see in the Flash IDE and those accessible through ActionScript.

var my_matrix = my_mc.transform.matrix;

trace("x: " + my_matrix.tx);
trace("y: " + my_matrix.ty);

scale

Scale mostly relates directly to the a and d properties of a transformation matrix but is complicated by the effects of skewing. Without skewing, the a and b properties directly relate to the scale properties presented by flash - those in the IDE's transform panel and those given by _xscale and _yscale in ActionScript - with the simple exception of a matrix's scale being based on 1 while Flash bases scale on 100 for a scale of 100%.

When skewing is involved, the scale of an axis changes as it continues to stretch based on the relationship to the other axis, either x to y or vice versa. Because of these relations, its only a matter of using Pythagoreans theorem to acquire the correct scale factor

var my_matrix = my_mc.transform.matrix;

trace("x scale: " + Math.sqrt(my_matrix.a * my_matrix.a + my_matrix.b * my_matrix.b));
trace("y scale: " + Math.sqrt(my_matrix.c * my_matrix.c + my_matrix.d * my_matrix.d));

skew

Prior to transformation matrices in Flash 8, skew values were not accessible through ActionScript. The Flash IDE, however, did, and still does, provide values for skew in the transform panel in the form of values of rotation (in degrees). This is slightly different than the values used to interpret this transformation in the actual transform matrix. Values there represent a ratio by which one axis scales according to the other. They are not rotation or angle values.

The rotation values given by Flash represent the angles created on the opposite axis as a result of that axis being skewed. For example, skewing the x axis creates an angle between the now tilted y axis and its original vertical orientation.

Depending on the amount of skew, this angle varies. Using an arbitrary point along either axis and transforming it with a movie clip's matrix will allow us to obtain the value of this rotation using arctangent. An additional 90 degree offset is needed with x skew compensate for the orientation of the y axis.

var my_matrix = my_mc.transform.matrix;

var px = new flash.geom.Point(0, 1);
px = my_matrix.deltaTransformPoint(px);
var py = new flash.geom.Point(1, 0);
py = my_matrix.deltaTransformPoint(py);

trace("x skew: " +((180/Math.PI) * Math.atan2(px.y, px.x) - 90));
trace("y skew: " +((180/Math.PI) * Math.atan2(py.y, py.x)));

rotation

If you know skew, you know rotation. Flash uses the x skew angle for rotation.

var my_matrix = my_mc.transform.matrix;

var px = new flash.geom.Point(0, 1);
px = my_matrix.deltaTransformPoint(px);

trace("rotation: " +((180/Math.PI) * Math.atan2(px.y, px.x) - 90));

반응형

'Adobe Flash > ActionScript 3.0' 카테고리의 다른 글

FlashDevelop + Molehill + Away3d_4.0.0  (0) 2011.03.10
ProportionalScale  (0) 2011.02.24
draw custom round rect border  (0) 2011.02.22
What is an ArrayCollection?  (0) 2011.02.22
tabIndex  (0) 2011.01.17
: