Action Script 3: Resize SWF on Browser resize

 

Accessing Stage object was pretty simple in previous versions of Action Script. However, it’s little different in Action Script 3. Sprits (movie clip) have property named stage (notice small “s”). One can use this property to access the Stage Object and respond to the Stage object’s Resize event.

Here is the AS3 code to resize SWF depending on browser size:

Class myStage:

package {

import flash.display.Stage;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;

public class myStage extends Sprite {

private var _mc:Sprite;
private var mcStage:Stage;

public function myStage(_mc:Sprite){
this._mc = _mc;
mcStage = _mc.stage;
addStageListener();
}

public function addStageListener() {
mcStage.scaleMode = StageScaleMode.NO_SCALE;
mcStage.align = StageAlign.TOP_LEFT;
mcStage.addEventListener(Event.RESIZE, resizeHandler);
}

private function resizeHandler(event:Event):void {
trace("stageWidth: "+mcStage.stageWidth);
trace("stageHeight: "+mcStage.stageHeight);
_mc.x = mcStage.stageWidth/2;
_mc.y = mcStage.stageHeight/2;
}
}
}

Now, create object of myStage and pass movieclip reference (which you want to align at center of stage) as parameter:

var mystage:myStage = new myStage(_mc);

Publish the flash file. Be sure to put 100% as value for Height and Width parameters in Object and param tag in HTML.

All set! Now you can test your file. SWF should now respond as you resize the browser window.

Advertisements

About Tushar

Hi, I am Tushar Wadekar from Pune, India. I am an Adobe Certified Flash Developer. My Interests are: Flash, ActionScript, Flex, AIR, PHP, Ruby on Rails. You can reach me at: tusharwadekar[at]gmail[dot]com Thank you! Tushar
This entry was posted in ActionScript3, Flash. Bookmark the permalink.

28 Responses to Action Script 3: Resize SWF on Browser resize

  1. Suzy Alvarez says:

    Hello,

    Nice script, wondering if it was possible to add a action script to a swf file telling it to getURL then re-sizing that opened html to a smaller size. I’m trying to accomplish something similiar to this..

    For example:

    getURL(“http://somepopup.com”, “resizable=1,HEIGHT=200,WIDTH=200”);

    Would you happen to know any that is capable of creating this action? I appreciate any resposces

  2. Tushar says:

    if you are targetting ActionScript3, simplest way would be:

    var jsCmd:String = “window.open(‘http://somepopup.com’,’win’,’height=200,width=200′);”;
    var url:URLRequest = new URLRequest(“javascript:” + jsCmd + ” void(0);”);
    navigateToURL(url, “_self”);

  3. marc says:

    Thanks for the example, but forgive me I’m having a really difficult time getting it to run at all. I keep getting errors? Do you have any source files? I’d really appreciate it. This jump from AS2 to AS3 has been very difficult. Thanks.

  4. unhitched says:

    hi – sorry just learning & having trouble getting this to work.. I created myStage.as file and created a new fla where I added “var mystage:myStage = new myStage(_mc:sample.swf);” .

    But I get a syntax error “expecting rightparen before colon”.

    What am I doing wrong?

  5. Pingback: as3 stage resize | 2-cents

  6. owen says:

    Hello. Thank you for providing this resource. I was hoping that you could clarify your conclusive instructions:

    “Now, create object of myStage and pass movieclip reference (which you want to align at center of stage) as parameter:

    var mystage:myStage = new myStage(_mc);”

    I am unclear as to what you mean by ‘object of myStage’ and how to ‘pass movieclip reference.’

    I am new enough to AS that I am missing a developed enough vocabulary to properly understand. I would much appreciate it if you could bridge that gap. Thank you.

  7. Donno says:

    This Is So Confusing LOL Well ! Got It To Work

    1. Add Movie To Stage Give it a Instance Ex.”asb”
    2. Give it Class Name(above)
    3. set Property On Stage Ex. “asb.myStage(this)”

    Worked !

    Still don’t Understand ?
    var mystage:myStage = new myStage(_mc);”
    Oh Well !

  8. simon says:

    modified to work better:

    package {

    import flash.display.Stage;
    import flash.display.Sprite;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.events.Event;

    public class myStage extends Sprite {

    private var _mc:Sprite;
    private var _stage:Stage;

    public function myStage(mc:Sprite){
    this._mc = mc;
    _stage = _mc.stage;
    init();
    listeners();
    resizeHandler(new Event(Event.RESIZE));
    }

    private function init() {
    _stage.scaleMode = StageScaleMode.NO_SCALE;
    _stage.align = StageAlign.TOP_LEFT;
    }
    private function listeners() {
    _stage.addEventListener(Event.RESIZE, resizeHandler);
    _mc.addEventListener(Event.RESIZE, resizeHandler);
    }
    private function resizeHandler(event:Event):void {
    _mc.x = (_stage.stageWidth/2) – (_mc.width/2);
    _mc.y = (_stage.stageHeight/2) – (_mc.height/2);
    }
    }
    }

  9. RObert J. E. says:

    Hey guys, I’m completely new at this.
    So, I have a flash file that I want to have resize automatically as the user extends their browser so it fits automatically.

    I saw the code… but holy crp… I’m dumb.

    Anychance on getting a step by step version on how to do this for someone like ‘I’.. that is not savvy at all with this stuff.

    please oh please… thnks guys.

    rje

  10. Joe says:

    How come this code brings me so many Syntax errors? I found 7 Syntax errors in the output panel after using this script.. WTF?

  11. Leigh says:

    I was getting errors , there may be a problem if you copy the code directly into flash as the quotes are incorrect, just remove the two lines that say trace(whatever).

  12. handsomefoot says:

    Hi,

    I’m just beginning to learn Actionscript. I’m putting together a gallery. What if I want the image to resize, but not the text description? Any advice or resources to look up? Thanks.

    hsf

  13. Ryan says:

    Hey there, So the funny thing, is:
    1. the trace statements are causing errors, so I had to /// the trace at the bottome to make this work.

    2. this works for some of the website, but not all of it.

    I have the code placed before my movieclips of:
    content (holding the menu and other content)
    menuMC (holding the menu)
    contentMC (holding the content)

    I am trying to center everything and it isnt working right.

    here it is, this website means nothing right now, so bare with the “crap”

    http://www.hungateagency.com/fonts/site2.swf

    as you can see, the background and the site layout labels are centering, but the menu is not shrinking to the full effect. Very weird.

    I also tried copying SIMON’s version and it completely made the menu dissapear…

  14. zangolo says:

    exelente, simple y claro como me gusta, muchas gracias (Thanks)

  15. Adrian says:

    Great code thx!…

    How can i get it to adjust to fit the browser when it loads instead of only after i resize the browser.

    thx,
    A

  16. Adrian says:

    nevermind… i got it to work

    I added a public function to the myStage class

    public function resizeHandlerInit() {—-resizing—}

    which handled all the resizing. Then I called that function from the same frame as the new stage object in the fla

    mystage.resizeHandlerInit();

  17. I want resize my external swf for included in my xml menu. for exaple:

    ****

    ————————-
    (**** : ı want resize “main.swf” )

    i is rith ?????
    pLZ. HELP ME. tANKS!!!!

  18. Angelo says:

    how about doing this EXACT thing in as2?????? swf resizes with users browser

  19. Nico Limpika says:

    I built a re-sizable window with as3 and flash that resizes inside the flash movie. It can be viewed and downloaded at http://www.actionscript-flash-guru.com/blog/16-code-for-a-resizable-window-in-as3 I put a lot of work into this little script and I thought it would be a shame not to make it available to others. Thanks for the rocking post man.

  20. Tommy says:

    This script gives me an error:

    ArgumentError: Error #1063: Incongruenza nel conteggio degli argomenti su myStage(). Era atteso 1, è stato ricevuto 0.

    ???

  21. well, i just guess i have to update my Flash 8, to one supporting actionscript 3, because this solution is very nice!

  22. David says:

    Thanks alot. Just what I needed!

  23. sergey says:

    My extra and mega appreciations to this post. It really and essentially helped me. Thanx again Tushar.

  24. ECI says:

    You never answered the most important question: What do you mean by creating a reference to the object: var myStage:myStage = new myStage(_mc);

    Where is this reference being made? In the main .mxml file? What does the parameter _mc denote?

  25. bobbbie says:

    All I can say it that I’ve been using flash since it was in Beta mode. The above code does not work. AS3 sucks ass. The most counter intuitive choice Adobe EVER made was to transition from AS2 to AS3 so bluntly. CRAP CRAP CRAP CRAP CRAP. To the power of a billion.

  26. steve says:

    woooow u really are not very bright

  27. Pingback: Accessing stage propertys from within a class » free icons download

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s