How to Change the Stage Size in ActionScript 3.0

Written by david gitonga
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Change the Stage Size in ActionScript 3.0
Dynamic flash containers require JavaScript and AS3 to be implemented on Web pages. (Comstock/Comstock/Getty Images)

Imagine a flash container being able to dynamically adjust its size to the browser window size. In ActionScript 3 (AS3), this can be accomplished by adding a few lines of JavaScript. A dynamic flash container is especially handy when content needs to be added and displayed without specifying the content limit. There are many ways to dynamically change the stage size in AS3, but the easiest involves the use of the swfIN script.

Skill level:
Easy

Other People Are Reading

Instructions

  1. 1

    Visit the Google Code website and download the swfIN script (see Resources). Read the swfIN script manual to understand the basics of the script.

  2. 2

    Add the following line of code to your HTML file where the flash application or presentation will be embedded:

    <script type= "text/JavaScript" src= "swfIN.js"></script>

  3. 3

    Add the following code to the body of the HTML page:

    <script type= "text/JavaScript">

    Var s = new swfIN ("flash.swf", "flash stage", "100%", "100%");

    s.scrollbarAt (500, 400);

    s.write();

    </script>

    Ensure that the above code is placed within the <body></body> tags inside your HTML page. The parameters contained within quotation marks can be changed according to your presentation specifications.

  4. 4

    Set up your flash presentation and create the "Actions" layer.

  5. 5

    Add the code below on the first frame of the "Actions" layer by pressing F9:

    Stage.align = StageAlign.TOP_LET;

    Stage.scaleMode = StaggeScaleMode.NO_SCALE;

    Stage.addEventListener (Event.RESIZE, resize Handler);

    The above code sets the Flash scaling behaviour when the stage size changes, and listens to the resize event.

  6. 6

    Add the function call that will contain elements to be resized as shown below:

    Private function resize Handler (e:Event):void{

    background.width= stage.stageWidth;

    background.height = stage.stageHeight;

    }

    The above code resizes the background movieclip but can be changed to resize any other element to fit the stage size.

Tips and warnings

  • Make sure the swfIN.js file is saved inside the same folder that will have your SWF and HTML files on the server. Alternatively, use the "src=swfIN.js" parameter to define the relative path of this JavaScript from where it can be retrieved.
  • The "ScrollbarAT" parameters are the minimal dimensions at which the SWF will display. If the display window gets smaller than this, the SWF will not resize and instead will display scrollbars.

Don't Miss

Filter:
  • All types
  • Articles
  • Slideshows
  • Videos
Sort:
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the eHow.co.uk site, you consent to the use of cookies. For more information, please see our Cookie policy.