I am trying to find AS3 code for a MovieClip on my stage.
My stage resizes proportionally on different screens (different size monitors), but the MC gets too big for smaller screen laptops and some parts of it get cut off. Would appreciate for any help
You could restrict any scaling, and handle the sizing yourself:
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
Have a look at the docs for the scale mode and align properties available.
Put this before anything else. This code find's the scale size from your original layout to the re-sized. (NOTE: It's best if you use this when Event.RESIZE is happening)
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
var guiSize:Rectangle = new Rectangle(0, 0, 1024, 600); //original stage size, substitute this with your orginal size
var deviceSize:Rectangle = new Rectangle(0, 0,
Math.max(stage.fullScreenWidth, stage.fullScreenHeight),
Math.min(stage.fullScreenWidth, stage.fullScreenHeight));
var appScale:Number = 1;
if ((deviceSize.width/deviceSize.height) > (guiSize.width/guiSize.height)) {
appScale = deviceSize.height / guiSize.height;
}
else {
appScale = deviceSize.width / guiSize.width;
}
Than, use appScale to scale every MovieClip/Sprite you have, e.g. _mc.scaleX = _mc.scaleY = appScale.
Using this way, every time the stage get re-sized, the right and down border are moved. That means if you want your footer to be always 50px from bottom, you should use something like :
_footer.y = stage.stageHeight - (50 * appCale);
Related
I am trying to create a game with fullscreen.
When I add an object to the stage in full screen mode, I would like it to stay at the same coordinates (for example 1000 pixels) relative to the monitor when I exit fullscreen mode.
How can I make the object move to the same location when leaving fullscreen mode?
To get your started:
Something along these lines is what you'll need to do:
stage.align = StageAlign.TOP_LEFT; //you'll need to running a top-left no-scale swf for this to work
stage.scaleMode = StageScaleMode.NO_SCALE;
var itemPoint:Point = new Point(150,150); //the point on the monitor the object should reside
//call this anytime the item needs to be redrawn (eg when the window changes size or position)
function updatePos(e:Event = null){
//We need to also account for the chrome of the window
var windowMargin:Number = (stage.nativeWindow.bounds.width - stage.stageWidth) * .5; //this is the margin or padding that between the window and the content of the window
var windowBarHeight:Number = stage.nativeWindow.bounds.height - stage.stageHeight - windowMargin; //we have to assume equal margin on the left/right/bottom of the window
item.x = itemPoint.x - stage.nativeWindow.x - windowMargin;
item.y = itemPoint.y - stage.nativeWindow.y - windowBarHeight;
}
stage.nativeWindow.addEventListener(NativeWindowBoundsEvent.MOVE, updatePos); //we need to listen for changes in the window position
stage.nativeWindow.addEventListener(NativeWindowBoundsEvent.RESIZE, updatePos); //and changes in the window size
//a click listener to test with
stage.addEventListener(MouseEvent.CLICK, function(e:Event):void {
if(stage.displayState == StageDisplayState.FULL_SCREEN_INTERACTIVE){
stage.displayState = StageDisplayState.NORMAL;
}else{
stage.displayState = StageDisplayState.FULL_SCREEN_INTERACTIVE;
}
});
updatePos();
I am trying to add a child at the bottom of the screen.
I am using stage.stageHeight, but it doesn't seem to be able to get the height of the device properly.
It is leaving a very wide gap between the child (s6) and the bottom of the screen.
Code:
addEventListener(Event.ADDED_TO_STAGE, onadded);
function onadded (event:Event):void{
addChild(s6);
s6.y = stage.stageHeight - s6.height;
s6.width = width - 20;
s6.x = stage.x+10;
}
Edit:
addEventListener(Event.ADDED_TO_STAGE, onadded);
function onadded (event:Event):void{
addChild(s7);
s7.width = stage.stageWidth;
stage.align = StageAlign.TOP_LEFT;
addChild(s6);
trace(stage.fullScreenWidth);
trace(stage.fullScreenHeight);
s6.y = stage.fullScreenHeight - s6.height;
s6.width = width - 20;
s6.x = stage.x+10;
s6.account.addEventListener(MouseEvent.CLICK, fl_ClickToGoTomyaccount);
s6.automatch.addEventListener(MouseEvent.CLICK, fl_ClickToGoToAAA);
s6.search.addEventListener(MouseEvent.CLICK, fl_ClickToGoTosearchpage);
s7.myaccount.addEventListener(MouseEvent.CLICK, fl_ClickToGoTomyaccount);
s7.autmatch.addEventListener(MouseEvent.CLICK, fl_ClickToGoToAAA);
s7.sssearch.addEventListener(MouseEvent.CLICK, fl_ClickToGoTosearchpage);
}
you can use the screen resolution property and use them in your code.
I have done one example like this and it varies on different screen resolutions.
var screenWidth:int = Capabilities.screenResolutionX;
var screenHeight:int = Capabilities.screenResolutionY;
this.width= screenWidth - (screenWidth / 2);
this.height=screenHeight - 200;
Hope it will work for you
I think you should use fullScreenHeight instead of stageHeight: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/Stage.html#fullScreenHeight
This is very true especially when working with mobile devices. stageHeight and stageWidth are not very reliable then.
You may also want to wait for RESIZE event which will occur shot after your app initialized, and then you can again use stageHeight instead.
After using the answer I found here
as3 video full screen mode
which was :
stage.displayState = StageDisplayState.FULL_SCREEN;
videoPlayer.x = 0;
videoPlayer.y = 0;
videoPlayer.width = stage.fullScreenWidth;
videoPlayer.height = stage.fullScreenHeight;
My video is full screen size, but anchored in the same point as it was on the stage, putting my video off to the side.
Is there an algorhythm I can use to calculate how many negative pixels I should move my video so it's displaying edge to edge?
Add these lines and your code might work. By default, the stage scales up to fill the screen (VIEW_ALL) and is centered.
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
Calculate the width of your video and the stage and use the half of it:
when anchor of videoPlayer is topleft:
videoPlayer.x = (stage.fullScreenWidth - videoPlayer.width) / 2;
videoPlayer.y = (stage.fullScreenHeight- videoPlayer.height ) / 2;
when anchor of videoPlayer is centered:
videoPlayer.x = stage.fullScreenWidth / 2;
videoPlayer.y = stage.fullScreenHeight / 2;
Edit: after reading your question again, you can try to relocate your video after resizing:
import flash.display.StageAlign;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, myResizeHandler);
private function myResizeHandler(event:Event) {
videoPlayer.x = 0;
videoPlayer.y = 0;
}
I want to set width and height of the stage during resize of that swf..
I do it in resize event handling..but doesn't work..any other way to achieve this?
stage.addEventListener (Event.RESIZE, resizeListener);
function resizeListener (e:Event):void {
stage.stageWidth=500;
stage.stageHeight=300;
}
Thanks
by the sounds of it you just need
stage.align = "";
stage.scaleMode = StageScaleMode.NO_SCALE;
this will keep the content the same size no matter how much you stretch the window
Updated:
you need is to compare the ratios of the width and height scales of the content and the target. To make the loaded image fit within the area, scaling so that everything is inside you can do something like this:
var scale:Number = Math.min( _holder.width / _loader.content.width,
_holder.height / _loader.content.height );
_loader.content.scaleX = _loader.content.scaleY = scale;
This will make sure that you can see everything. If you change Math.min to Math.max, you will get a different result if the dimensions don't match.
public function loaderComplete(event:Event):void
{
var content:MovieClip = MovieClip(event.currentTarget.content );
//the dimensions of the external SWF
var _width:int = content.width;
var _height:int = content.height;
// you have several options here , assuming you have a container Sprite
// you can directly set to the dimensions of your container, if any
if( container.width < _width )
_width = container.width // and do the same for height
// or you could scale your content to fit , here's a simple version
// but you can check the height too or keep checking both value
// until it fits
if( container.width < _width )
{
var scale:Number = container.width / _width;
content.scaleX = content.scaleY = scale;
}
}
This answer gives better understanding of previous code given by swati singh.See this link
How to resize an external SWF to fit into a container?
Thanks to all
Edit #2 I've found the solution, it was more simple than I could have hoped. Thanks for your time. =) (Answered my own question with full solution)
Edit: My apologies that my post was not transparent enough.. I will try to iterate for a little more clarity. I am not simply trying to contain things and have the container resize without the contents resizing. I would just use a simple MovieClip for that.. My main focus is on the use of BitmapFill. I'm trying to make a repeating background image for a container; thus far I'm able to draw my BitmapFill sprite to the size I want. (Which is the stage's height) but when the stage is resized, I want to re-size my container but have my containers BitmapFill crop or add more as the window is resized bigger or smaller. Allow me to illustrate what I mean:
I hope this clears up any confusion and helps with any straighter answers.
------- Original post:
I've got a simple rectangle sprite that fills with a bitmap from the library and a simple resize handler function that detects when the window has been resized.
What I would like to do is have my rectangle resize to the height of the stage.stageHeight maintaining its bitmap fill, but not resizing the bitmap fill or any children within the sprite.
From what I've read, this is a little tricky because the sprite resizes in relation to what it contains.. or.. something like that.. I really don't know any more.. I saw one example where a person extended the sprite class but I don't know why or how..
in my library there is an image called 'pattern' and my code looks like this:
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.addEventListener(Event.RESIZE, resizeHandler, false, 0, true);
var bgData:pattern = new pattern(0,0);
var bg:Sprite = new Sprite();
bg.graphics.beginBitmapFill(bgData, null, true, false);
bg.graphics.drawRect( 0, 0, 80, stage.stageHeight);
bg.graphics.endFill();
addChild(bg);
function resizeHandler(e:Event=null):void
{
trace("dimensions are: " + stage.stageWidth + " x " + stage.stageHeight);
bg.height = stage.stageHeight; //simply makes the fill resize also
}
Oh, well I'm dull. The answer was quite simple.
All I needed to do was clear the graphics then redraw them..
I wasn't aware of the clear(); function..
the full revised code is as follows:
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.addEventListener(Event.RESIZE, resizeHandler, false, 0, true);
var bgData:pattern = new pattern(0,0);
var bg:Sprite = new Sprite();
bg.graphics.beginBitmapFill(bgData, null, true, false);
bg.graphics.drawRect( 0, 0, 80, stage.stageHeight);
bg.graphics.endFill();
addChild(bg);
function resizeHandler(e:Event=null):void
{
trace("dimensions are: " + stage.stageWidth + " x " + stage.stageHeight);
bg.graphics.clear();
bg.graphics.beginBitmapFill(bgData, null, true, false);
bg.graphics.drawRect( 0, 0, 80, stage.stageHeight);
bg.graphics.endFill();
}
thanks all, sorry for this potential waste of space.
Since a Sprite will resize to its content, you can use a Shape to resize your Sprite. Changing the Shape size will effectively resize the Sprite without resizing the Sprite's other children.
var bg:Sprite = new Sprite();
addChild( bg );
var fill:Shape = new Shape();
//you can make the fill transparent
with( fill )
{
graphics.beginFill( 0 , 0 );
graphics.drawRect( 0 , 0 , anyWidth , anhyHeight );
graphics.endFill();
}
bg.addChild(fill);
//then add the fill that you want visible
var bgFill:Sprite = new Sprite();
//add the graphics here
bg.addChild(bgFill );
function resizeSprite(event:Event ):void
{
// bgFill will not be resized
fill.width = stage.stageWidth;
fill.height = stage.stageHeight;
}