PDA

View Full Version : full browser flash nightmare



high1memo
February 16th, 2008, 03:16 PM
I have a full-flash site which is fixed size, most controls and assets are added to the stage at runtime, the aligment is set to center, and it is embedded in html with 100% width and height - you can visit www.janelaurie.com to get a better picture of what I mean.

Everything here is working perfectly, but I would like to add some stuff to the very edges of the browser and I cannot find the values that I need and its driving me crazy. I've added a listener to the stage.resize and stage.stageWidth / stage.stageHeight are giving the correct values but obviously that is not enough, I also need the coordinates of the top left corner which should be negative something - but I cannot find those values anywhere. I've tried getRect and getBounds but they don't work obviously as they only measure the full contents of the stage.

The only solution I can think of at this point is to set my stage.align to topleft, but that would mean i need to readjust the entire app and all of the main controls etc. are directly on the stage and I really do not want to change all that. All I need are two numbers, the coordinates of the top left corner of the stage in the resize event of the stage, is there anyway of retrieving that?

cheers,

bzouchir
February 16th, 2008, 08:35 PM
check out this one.

I think that's exactly what you're looking for:
http://www.tutorio.com/tutorial/liquid-flash-layout

dail
February 16th, 2008, 09:52 PM
I've made a AS3 stageManager class for creating liquid layouts.

Its here, it may help you out; http://www.blog.noponies.com/archives/53

high1memo
February 16th, 2008, 09:59 PM
unfortunately, as well written as they are, neither of those posts really answer my question. In both examples the flash app is aligned top left. Aligning it top-left is easier of course because you know the top left is 0,0 and the bottom right is Stage.width, Stage.height (or in AS3 stage.stageWidth, stage.stageHeight) - so you can easily calculate where to put your elements. In my case though nearly all of my controls and movieclips are placed on the stage at design time with keyframed animation, so I can't re-center them via code (and wouldn't want to any way cos theres a lot of stuff to move about!). The only solution I can think (if I were to go down the align top-left route) is to place everything I have on stage into a movieclip and center that via code, but that will screw up some other stuff i will have to reorganize quite a bit so I really would like to avoid that situation. All I really need is the coordinates of the topleft corner of the stage when the flash app is center aligned! It seems like such a simple thing I can't believe i can't find it!

bzouchir
February 20th, 2008, 05:40 AM
like you said, you'll need to put all that into a movieClip to align in code.
can't get anything dynamic with those keyframes!

so you need to find the top left coordinate of the Stage?
in relation to what?
topLeft corner is always 0,0 relative to root

do u want the topLeft corner relative to the swf? the browser? the monitor resolution?

just checking your website, looks good, your stage width and height are dynamic at 100% of the browser window, so there no way there's anything you can do by dragging and placing by hand those elements at the edges! scale the browser window and you have a different stage.

best thing wrap the graphics in a movieClip and then follow dail's post should work perfect.

Pier25
February 20th, 2008, 05:53 AM
I'm an AS3 newbie... but... if your align is on the center the top left corner would be

0 - Stage.width / 2 ???

At least in AS2.

I supose you already tried this, but why would this not work?

high1memo
February 20th, 2008, 09:59 AM
Yea I've gone ahead and changed my alignment to TOPLEFT and am doing it all the traditional way now: topleft is 0,0; bottom right is stage.stageWidth, stage.stageHeight. It was a bit of a pain because I had some code on the timeline - which was part of my root class, but nesting all those keyframes in a movieclip meant I had to create a new class and move over some of the properties and methods and setup communication between the two classes (other classes which was communicating those with the root class). Nothing catastrophic of course, just a few hours of work I wanted to avoid :P

Regarding "topLeft corner is always 0,0 relative to root", this isn't the case when the flash is aligned CENTER (which is how I originally had it and didn't want to change). It also isn't -stage.stageWidth / 2. It is actually something like -(stage.stageWidth - originalWidth)/2. I didnt want to hardcode my originalWidth (the dimensions setup at design time in the IDE) and couldn't find a way of determining it via code.

Like I said now my flash is top left aligned and its all working perfectly (it comes more into effect when you click on an image to maximise it in the portfolio section), but I would still be keen to learn if you could do this (without hardcoding any original dimension values) while having your flash center aligned.

visualingo
July 20th, 2010, 02:27 PM
I know this is 2 years later, but figured someone else may stumble across this thread as I did. I figured out the top left corner (AS2). I thought I'd find good examples out there in Google-land, but I couldn't find a clearcut formula on how to do this.

Anyway, here is my code:


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

originalStage = Stage.width;

sizeListener = new Object();
sizeListener.onResize = function() {
myObject._x = myObject._x-((Stage.width-originalStage)/2);
originalStage = Stage.width;
};
Stage.addListener(sizeListener);

Dan008
September 1st, 2010, 12:18 PM
I did it this way but this doesnt scale my flash in scale but it does fit full browser anyway to make it scale correctly in scale? thanks.

Anyway, here is my code:


stop();
this.onResize = function() {
//-- Called when browser is resized.
this.green_mc._x = (Stage.width/2)-(this.green_mc._width/2);
this.green_mc._y = (Stage.height/2)-(this.green_mc._height/2);
this.green_mc = Stage.width+"x"+Stage.height;
};
Stage.scaleMode = "exactFit";
Stage.align = "TL";
Stage.showMenu = false;
Stage.addListener(this);
this.onResize();
[/QUOTE]