How to Auto Resize a Window Component in Flash

Re-size your Window components automatically in Flash.

Flash ActionScript 3.0's upgraded "Event" capabilities allow for Window components to be automatically re-sized as the browser window that contains the Flash document is re-sized. The code works as follows: an Event Listener is created to listen for the ActionScript event "RESIZE" which is activated when the window holding the Flash document is re-sizing. When this event is activated, another function which manipulates the Window components runs, and re-sizes the component so that it gets smaller or bigger as the user makes the browser window smaller or bigger. This is useful for Flash web pages that take up the whole screen---when a user makes his screen larger or smaller, he will not have to scroll to see the content of the page.

Instructions

1. Create a new Flash Actionscript 3.0 document by going to "File," "New" and selecting "Flash Actionscript 3.0" and clicking "OK."

2. Select the Rectangle tool and draw a rectangle of any size in the middle of the screen. Switch to the Selection tool, click the rectangle and click "Convert to Symbol." Name the Rectangle whatever you'd like and click "OK." Under the Properties tab, replace "<Instance Name>" with "resizableComponent" and hit "Enter."

3. Click the "New Layer" button on the bottom left corner of the Timeline, and call the layer "Actions." Click the first frame of the Actions layer and go to "Window" and "Actions" to open the Actionscript window.

4. In the Actionscript window, type the following code:
   function init()
   {

   stage.align=StageAlign.TOP_LEFT;
   stage.scaleMode=StageScaleMode.NO_SCALE;
   stage.addEventListener(Event.RESIZE, updateSize);
   stage.dispatchEvent(new Event(Event.RESIZE));
   resizableComponent.x = 0;
   resizableComponent.y = 0;
   }
   init();

   function updateSize(e:Event)
   {
   resizableComponent.width = stage.stageWidth;
   resizableComponent.height = stage.stageHeight;
   }

5. Go to "Control" and "Test Movie" to test your movie. Click and drag the bottom right corner of the test window to re-size the window. The rectangle you created should automatically re-size along with it.

References

• Kirupa Flash Tutorials: Resizing Components in Flash