placing elements on fullscreen stage

[Web Rhino]

Hi;
i managed to make my movie full screen, but it scales all elements in the movie, can i control some element like the menu not to scale?

[madzigian]

add this on your first frame

Stage.scaleMode = "noScale";

then write an onResize event handler and add a stage listener to handle the objects that should scale, and those that should not.

Read these :

part 1
http://www.actionscript.com/Article/...1/Default.aspx
part 2
http://www.actionscript.com/Article/...2/Default.aspx
part 3
http://www.actionscript.com/Article/...3/Default.aspx

[Web Rhino]

Thanks;
were do i put this code?

// Create a function for the event you want to listen for
stageListener.onResize = function ()
{
// Get the width and height of the stage
// & multiply by half
var stageXCenter = Stage.width * .5;
var stageYCenter = Stage.height * .5;

// Offset the center point with half of
// the clip width and height
// (you can also use the -= operator and simply this)
stageXCenter = stageXCenter - (myClip._width * .5);
stageYCenter = stageYCenter - (myClip._height * .5);

// place the clip with the offset
myClip._x = stageXCenter;
myClip._y = stageYCenter;
}

[Web Rhino]

i added Stage.scaleMode = "noScale"; to the first frame , then created a movie clip and gave it an instantname:stageListener and added the code to it's first frame, but nothing is happening

[Web Rhino]

you know, i've done it
the example code is:

Stage.align = "LT";

Stage.scaleMode = "noScale";


stageListener = new Object();

stageListener.onResize = function() {
expandbg();
}

Stage.addListener(stageListener);

expandbg = function() {
bg._height = Stage.height;
}
stageListener.onResize();

Where "bg" is the clip i'm trying to resize or position, i added this code to first frame of my movie, it works wonder

Thanks man.

[madzigian]

ALWAYS CHECK FLASH'S HELP FILES!!!.. if you had, then you would have figured out that

i added Stage.scaleMode = "noScale"; to the first frame , then created a movie clip and gave it an instantname:stageListener and added the code to it's first frame, but nothing is happening

was never going to work.
ALSO.. if you tryuly want a fulscreen/full browser flash site... make sure in your publish settings, you have also set scaleMode to noScale and and for size, you choose 100% x 100%, not Match Movie or anything else. Then in your CSS for your HTML page, you specify NO MARGINS NO PADDING etc.

[Web Rhino]

Thanks man, i really checked the help before i posted, but gave me too much results.

yeah i did all that, and it works smooth, and i even got around the firefox bug BUT the problem now is that the code doesn't work from first time, i have to "reset down" then "maximize" the browser window so it works!!

[Web Rhino]

i got it working now, thanks..

[madzigian]

I noticed you said you resolved your issue.... I just figured i'd add my 2 cents anyway... just calling the function when the page initially loads should handle all of your initial placement of objects.....

Make sure, you properly define variables and create your objects properly. Also, there is no need for you to add that extra expand function... onResize is an event handler.. use it to handle your events!!!

Using your code above as a base.. i would do it like this

Stage.align = "TL"; 
Stage.scaleMode = "noScale"; 


// ---> Create a new listener object
var $stage:Object = new Object(); 


// ---> Define the resize function...
$stage.onResize = function() { 

      // ---> first, get the new dimensions of the stage....
      var $width:Number = Math.round(Stage.width);
      var $height:Number = Math.round(Stage.height);

      // ---> now, set the bg movieclip's w & h to the stage dimensions...
      bg._width = $width;
      bg._height = $height;
};


// --->  Apply the listener...
Stage.addListener($stage); 


// ---> Run the function...
$stage.onResize();

[Web Rhino]

it's really working very nice now, i think it's a very important piece of code that nay flash designer must know.

Thanks for the lead man

[madzigian]

you're welcome! That's what i'm here for.

I agree with you also, it's a very functional and useful piece of code. And you can get much more involved with it. With onResize, and a little bit of Math, you can keep your site layout consistent on pretty much any browser window. For instance, you could keep a menu locked on the bottom center of the stage by adding this :

// ---> Define the resize function...
$stage.onResize = function() { 

      // ---> first, get the new dimensions of the stage....
      var $width:Number = Math.round(Stage.width);
      var $height:Number = Math.round(Stage.height);

      // ---> now, set the bg movieclip's w & h to the stage dimensions...
      bg._width = $width;
      bg._height = $height;


      // ---> for clip with top-left registration point....
      my_menu._x = Math.round($width - my_menu._width)/2;
      my_menu._y = $height - my_menu._height; 

      // ---> to position a clip 10% of Stage.width, centered vertically....
      mc._x = $width * .1;
      mc._y = Math.round($height - my_menu._height)/2;
};

Play with it.. have some fun..

Good Luck!

[Web Rhino]

it's working fine now, but how do i control external movies that are being loaded into a movieholder??!

[madzigian]

you position the holder.... moving the holder will move the movie contained in it.

[mlecho]

hey madzigian...just curious...when compiling code like
Stage.align = "LT";
Stage.scaleMode = "noScale";

is it the same as the prefs in the publishing tab (cntrl+shift+F12)??

[madzigian]

PLEASE NOTE :

Stage.align = "TL";

TL = TOP LEFT

LT was a typo i had corrected but apparently the changes didn't stick.

It's not quite the same.. if you are planning to make a fullscreen flash site, include the Stage.scaleMode = "noScale"; line at the beginning of your movie, then make sure you also set your Publish Setting HTML settings to Scale : No Scale and the Dimensions : 100% x 100%

[Web Rhino]

it's not working for some reason;

i'm loading external swf using:

_root.currMovie = "./swf/home";
container.loadMovie(_root.currMovie+".swf");

and the function for the resize:

fixedWidth = Stage.width;
fixedHeight = Stage.height
Stage.align = "TL";
Stage.scaleMode = "noScale";
stageListener = new Object();
stageListener.onResize = function() {
containerbg();
}
containerbg = function() {
container._height = Stage.height;
container._width = Stage.width;
}

Stage.addListener(stageListener);
stageListener.onResize();

[madzigian]

because your still not using proper syntax... ActionScript 2.0 requires you to DEFINE your variables. So...

fixedWidth = Stage.width; --> incorrect

var fixedWidth:Number = Stage.width; --> correct

(although data typing isn't necessary, it's a good habit to get into)


you are also not using the code i provided for you, WHICH WORKS. copy and paste this into your movie and test:

Stage.align = "TL"; 
Stage.scaleMode = "noScale"; 


// ---> Create a new listener object
var $stage:Object = new Object(); 


// ---> Define the resize function...
$stage.onResize = function() { 

      // ---> first, get the new dimensions of the stage....
      var $width:Number = Math.round(Stage.width);
      var $height:Number = Math.round(Stage.height);

      // ---> now, set the bg movieclip's w & h to the stage dimensions...
      container._width = $width;
      container._height = $height;
};


// --->  Apply the listener...
Stage.addListener($stage); 


// ---> Run the function...
$stage.onResize(); 


// define your variables.  I would make file path it's own var and movie another
var filePath:String = "/swf/";
var currMovie:String = "home.swf";

// now load your movie...
container.loadMovie(filePath + currMovie);

[Web Rhino]

still not working , whenever i put the resize code on the same frame with the container.loadMovie it doesn't load the external movie at all, once i remove the resizer code, it loads the external movie, but ofcourse not fullscreen as i wish.

[madzigian]

are you placing the loadMovie code before the rest of the code?.. or did you use what i posted?...

[Web Rhino]

yeah, i used what you posted exactly, acaully i9 fixed the code on the rest of the file too.