flash interactivity_event.resize

When an animation is resized and Event.RESIZE event is broadcast by the Stage object. Thanks to this event we can manage the resizing of our application. In a new Flash CS3 documents we will create a clip containing the logo of our site and give it the instance name myLogo.

The following code allows us to keep the logo centered whatever the resizing do to our animation:

// import the resizing classes
import fl.transitions.Tween;
import fl.transitions.easing.Strong;
// alignment of the stage top left
stage.align = StageAlign.TOP_LEFT;
// we don’t allow the content to be stretched
stage.scaleMode = StageScaleMode.NO_SCALE;
// listen for the event from the stage object
stage.addEventListener ( Event.RESIZE, resize );
// calculate the x and y position
var initCenterX:int = (stage.stageWidth - myLogo.width)/2;
var initCenterY:int = (stage.stageHeight - myLogo.height)/2;
// two Tween objects are created, one for each axis
var tweenX:Tween = new Tween ( myLogo, "x", Strong.easeOut, myLogo.x,
initCenterX, 15 );
var tweenY:Tween = new Tween ( myLogo, "y", Strong.easeOut, myLogo.y,
initCenterY, 15 );
 
function resized ( pEvt : Event ):void
{
// calculate the x and y positions
var centerX:int = (stage.stageWidth - myLogo.width)/2;
var centerY:int = (stage.stageHeight - myLogo.height)/2;
// we take the start and end sizes and perform the repositioning
tweenX.begin = myLogo.x;
tweenX.finish = centreX;
tweenX.start();
tweenY.begin = myLogo.y;
tweenY.finish = centreY;
tweenY.start();
}

The following image illustrates the result:

We can use the Event.RESIZE to manage the repositioning of any graphic elements within an application or site.