RE: [Flashcoders] Stretching Designs - Coded?
I have an example on ultrashock that demonstrates this and Scale 9 to good effect: http://www.ultrashock.com/ff.htm?http://www.ultrashock.com/flas/Detailed /264.html HTH M ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
[Flashcoders] Stretching Designs - Coded?
Hi there, I've seen a couple of design occasionally (like thefwa.com) that dynamically stretch and adjust with the width of the browser and the content. How is that kind of thing done? I know you can achieve some interestin gthings with scaleMode and Stage.align but I'm guessing something more complex is going on here. I want to create a header banner, that fits into a flexible width site, so it needs to stretch with the page. The height will stay the same, and there's some design elements that should be locked left, and some locked right. Could anyone point me in the right direction. I've not had much trouble with google since i'm not entirely sure what the correct terms for this are. Thanks! - Kevin ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] Stretching Designs - Coded?
How is that kind of thing done? I know you can achieve some interestin
gthings
with scaleMode and Stage.align but I'm guessing something more complex is
going on here.
No - that's about it really. Just make sure your flash is embedded with 100%
width so the stage does actually change size with the browser.
//Set your movie up like:
Stage.align = TL;
Stage.scaleMode = noScale;
//Add a listener so things get adjusted when the stage is resized
var stageListener = new Object();
stageListener.onResize = function(){
alignContent();
}
Stage.addListener(stageListener);
//Use Stage.width to get the width of your stage (and Stage.height if
needed).
//When you want to align movieclips use:
function alignContent(){
myMC._x = Stage.width;
}
Depending on how your MCs are set up, you may have to do some adjusting
like:
myMC._x = Stage.width - myMC._width - 50;
Left aligned items don't really need anything.
On 6/11/06, Kevin Cannon [EMAIL PROTECTED] wrote:
Hi there,
I've seen a couple of design occasionally (like thefwa.com) that
dynamically
stretch and adjust with the width of the browser and the content.
How is that kind of thing done? I know you can achieve some interestin
gthings
with scaleMode and Stage.align but I'm guessing something more complex is
going on here.
I want to create a header banner, that fits into a flexible width site, so
it
needs to stretch with the page. The height will stay the same, and there's
some design elements that should be locked left, and some locked right.
Could anyone point me in the right direction. I've not had much trouble
with
google since i'm not entirely sure what the correct terms for this are.
Thanks!
- Kevin
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
Re: [Flashcoders] Stretching Designs - Coded?
Hey Kev -
This is achieved to listening to the Stage object. It's super simple. I
actually have a little snippet that I use over and over when I am gonna do
stage stuff. It's below, the formatting get's messed up here, so I'll post a
lil FLA example, if you like. Basically, I create 9 arrays of the basic
alignments that I generally use (ie top-left, top-right, bottom right,
etc..) And simply add an object to the respective array I want to target.
This object will have 3 parameters, the MovieClip that is the target, and a
var for xpaddign and ypadding that act as offsets to the given position.
Take A Look. Here is the basic code, with no clips:
/*Stage.onResize() listings
*
*
*NOTE: Any clips that are moved due to an onResize event, are filed
into their respective arrays below
*as objects with three properties, _mc (the clip being
referenced), x and y padding.
*NOTE: To have a clip move with the stage, use this format:
{_mc:upperLeft_mc, xpadding:0, ypadding:0}
*
*/
var TopLeft:Array= [];
var TopCenter:Array= [];
var TopRight:Array= [];
var MiddleLeft:Array= [];
var MiddleCenter:Array= [];
var MiddleRight:Array= [];
var BottomLeft:Array= [];
var BottomCenter:Array= [];
var BottomRight:Array= [];
/*Stage.onResize() engine
*
*/
var stageObj:Object = new Object();
stageObj.onResize = function()
{
for(var i in TopLeft) {TopLeft[i]._mc._x =
0+TopLeft[i].xpadding;TopLeft[i]._mc._y=
0+TopLeft[i].ypadding; };
for(var i in TopCenter) {TopCenter[i]._mc._x =
Stage.width/2+TopCenter[i].xpadding; TopCenter[i]._mc._y=
0+TopCenter[i].ypadding; };
for(var i in TopRight) {TopRight[i]._mc._x =
Stage.width+TopRight[i].xpadding; TopRight[i]._mc._y=
0+TopRight[i].ypadding; };
for(var i in MiddleLeft) {MiddleLeft[i]._mc._x =
0+MiddleLeft[i].xpadding;MiddleLeft[i]._mc._y=
(Stage.height/2)+MiddleLeft[i].ypadding; };
for(var i in MiddleCenter) {MiddleCenter[i]._mc._x =
Stage.width/2+MiddleCenter[i].xpadding; MiddleCenter[i]._mc._y=
(Stage.height/2)+MiddleCenter[i].ypadding; };
for(var i in MiddleRight) {MiddleRight[i]._mc._x =
Stage.width+MiddleRight[i].xpadding; MiddleRight[i]._mc._y=
(Stage.height/2)+MiddleRight[i].ypadding; };
for(var i in BottomLeft) {BottomLeft[i]._mc._x =
0+BottomLeft[i].xpadding;BottomLeft[i]._mc._y=
(Stage.height)+BottomLeft[i].ypadding; };
for(var i in BottomCenter) {BottomCenter[i]._mc._x=
Stage.width/2+BottomCenter[i].xpadding; BottomCenter[i]._mc._y=
(Stage.height)+BottomCenter[i].ypadding; };
for(var i in BottomRight) {BottomRight[i]._mc._x =
Stage.width+BottomRight[i].xpadding; BottomRight[i]._mc._y=
(Stage.height)+BottomRight[i].ypadding; };
};
Stage.addListener(stageObj);
stageObj.onResize();
On 6/11/06 4:29 AM, Kevin Cannon [EMAIL PROTECTED] wrote:
Hi there,
I've seen a couple of design occasionally (like thefwa.com) that dynamically
stretch and adjust with the width of the browser and the content.
How is that kind of thing done? I know you can achieve some interestin gthings
with scaleMode and Stage.align but I'm guessing something more complex is
going on here.
I want to create a header banner, that fits into a flexible width site, so it
needs to stretch with the page. The height will stay the same, and there's
some design elements that should be locked left, and some locked right.
Could anyone point me in the right direction. I've not had much trouble with
google since i'm not entirely sure what the correct terms for this are.
Thanks!
- Kevin
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and
Re: [Flashcoders] Stretching Designs - Coded?
Threw together a quick example for you:
http://lab-media.com/transfer/chattyfig/StageObject.fla.zip
;]
A
On 6/11/06 10:29 AM, Aaron Buchanan [EMAIL PROTECTED] wrote:
Hey Kev -
This is achieved to listening to the Stage object. It's super simple. I
actually have a little snippet that I use over and over when I am gonna do
stage stuff. It's below, the formatting get's messed up here, so I'll post a
lil FLA example, if you like. Basically, I create 9 arrays of the basic
alignments that I generally use (ie top-left, top-right, bottom right,
etc..) And simply add an object to the respective array I want to target.
This object will have 3 parameters, the MovieClip that is the target, and a
var for xpaddign and ypadding that act as offsets to the given position.
Take A Look. Here is the basic code, with no clips:
/*Stage.onResize() listings
*
*
*NOTE: Any clips that are moved due to an onResize event, are filed
into their respective arrays below
*as objects with three properties, _mc (the clip being
referenced), x and y padding.
*NOTE: To have a clip move with the stage, use this format:
{_mc:upperLeft_mc, xpadding:0, ypadding:0}
*
*/
var TopLeft:Array= [];
var TopCenter:Array= [];
var TopRight:Array= [];
var MiddleLeft:Array= [];
var MiddleCenter:Array= [];
var MiddleRight:Array= [];
var BottomLeft:Array= [];
var BottomCenter:Array= [];
var BottomRight:Array= [];
/*Stage.onResize() engine
*
*/
var stageObj:Object = new Object();
stageObj.onResize = function()
{
for(var i in TopLeft) {TopLeft[i]._mc._x =
0+TopLeft[i].xpadding;TopLeft[i]._mc._y=
0+TopLeft[i].ypadding; };
for(var i in TopCenter) {TopCenter[i]._mc._x =
Stage.width/2+TopCenter[i].xpadding; TopCenter[i]._mc._y=
0+TopCenter[i].ypadding; };
for(var i in TopRight) {TopRight[i]._mc._x =
Stage.width+TopRight[i].xpadding; TopRight[i]._mc._y=
0+TopRight[i].ypadding; };
for(var i in MiddleLeft) {MiddleLeft[i]._mc._x =
0+MiddleLeft[i].xpadding;MiddleLeft[i]._mc._y=
(Stage.height/2)+MiddleLeft[i].ypadding; };
for(var i in MiddleCenter) {MiddleCenter[i]._mc._x =
Stage.width/2+MiddleCenter[i].xpadding; MiddleCenter[i]._mc._y=
(Stage.height/2)+MiddleCenter[i].ypadding; };
for(var i in MiddleRight) {MiddleRight[i]._mc._x =
Stage.width+MiddleRight[i].xpadding; MiddleRight[i]._mc._y=
(Stage.height/2)+MiddleRight[i].ypadding; };
for(var i in BottomLeft) {BottomLeft[i]._mc._x =
0+BottomLeft[i].xpadding;BottomLeft[i]._mc._y=
(Stage.height)+BottomLeft[i].ypadding; };
for(var i in BottomCenter) {BottomCenter[i]._mc._x=
Stage.width/2+BottomCenter[i].xpadding; BottomCenter[i]._mc._y=
(Stage.height)+BottomCenter[i].ypadding; };
for(var i in BottomRight) {BottomRight[i]._mc._x =
Stage.width+BottomRight[i].xpadding; BottomRight[i]._mc._y=
(Stage.height)+BottomRight[i].ypadding; };
};
Stage.addListener(stageObj);
stageObj.onResize();
On 6/11/06 4:29 AM, Kevin Cannon [EMAIL PROTECTED] wrote:
Hi there,
I've seen a couple of design occasionally (like thefwa.com) that dynamically
stretch and adjust with the width of the browser and the content.
How is that kind of thing done? I know you can achieve some interestin
gthings
with scaleMode and Stage.align but I'm guessing something more complex is
going on here.
I want to create a header banner, that fits into a flexible width site, so it
needs to stretch with the page. The height will stay the same, and there's
some design elements that should be locked left, and some locked right.
Could anyone point me in the right direction. I've not had much trouble with
google since i'm not entirely sure what the correct terms for this are.
Thanks!
- Kevin
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
Re: [Flashcoders] Stretching Designs - Coded?
Aaron, thanks for putting together that example. I made an example of keeping an element in the center of the Stage using zmc_tween along with your technique, something I started doing to add a little depth when the user resizes. Just eye candy. The attachment is your example with zmc_tween being used on another clip on stage. Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] Stretching Designs - Coded?
Attachment was stripped, can you send to [EMAIL PROTECTED] I will post along with mine :) a On 6/11/06 11:15 AM, Mike Britton [EMAIL PROTECTED] wrote: Aaron, thanks for putting together that example. I made an example of keeping an element in the center of the Stage using zmc_tween along with your technique, something I started doing to add a little depth when the user resizes. Just eye candy. The attachment is your example with zmc_tween being used on another clip on stage. Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
