Both of sprite.width and sprite.scaleX can be used for scale a sprite. Is possible sprite.scaleX depends on screen size?
When you change the width property, the scaleX property changes accordingly
var rect:Shape = new Shape();
rect.graphics.beginFill(0xFF0000);
rect.graphics.drawRect(0, 0, 100, 100);
trace(rect.scaleX) // 1;
rect.width = 200;
trace(rect.scaleX) // 2;
official documentation
You should read the official documentation about scaleX and width.
By default, scaleX=1 which means there is no rescaling of the sprite, it does not depend on anything, you may set it freely.
Related
if(_ss.x >= _l.getWidth()){
_ss.x = _l.getWidth();
_vx *= -1;
_ss is the child object of _l.
_l's original width is 1024px.
When ss.x is greater than 1024px the _l's width
is expanded by the same amount of pixels. However, strangely the
Parent, _l, which is essentially a background and container, does not resize visually. The _l.width property, however, increases when its object child _ss, visually a space ship, exceeds the _l.width's original pixel width of 1024.
I want _ss to be prevented from moving beyond its parent's original width of 1024px. I am new to ActionScript. What can be done?
If I understand you, you're noticing that when a child size changes it is reflected by it's parent DisplayObject/width and height properties, but does not visually change the parent. This is expected, a display object's width and height (and getBounds()) reflects the measured size of its contents, and there is no automatic layout of graphics when size changes in this way (such as drawing a background that fills the container bounds).
In other words:
var container:Sprite = new Sprite();
container.graphics.beginFill(0xff0000);
container.graphics.drawRect(0, 0, 100, 100);
trace(container.width, container.height); // 100 100
var child:Shape = new Shape();
child.graphics.beginFill(0x00ff00);
child.graphics.drawRect(0, 0, 500, 500);
trace(child.width, child.height); // 500 500
container.addChild(child);
trace(container.width, container.height); // 500 500
You can't prevent this behavior in a general sense, but you can override it with an extended class. For example:
class UISprite extends Sprite {
private var _width:Number = 0;
override public function set width(value:Number):void {
_width = value;
}
override public function get width():Number {
return _width;
}
}
Now a UISprite instance has a "virtualized" width that doesn't reflect the measured size. You can set it to be anything you like, regardless of the actual size of its contents:
var ui:UISprite = new UISprite();
trace(ui.width); // 0
ui.width = 100;
trace(ui.width); // 100
You can add things to it and it won't effect the width property:
var child:Shape = new Shape();
child.graphics.beginFill(0xff0000);
child.graphics.drawRect(0, 0, 500, 500);
ui.addChild(child);
trace(ui.width); // 100
Flex makes heavy use of this sort of thing to provide layout features.
Hope that helps.
I want make my label of Scene2D larger. I have scaled and set width and height to 200 and higher and it stays the same size.
Help? thanks.
So you want a bigger font size?
You can do that by calling lbl.font.setScale(yourFontSize);.
Sorry for my bad english, it is my code:
super(view, batch);
LabelStyle lbl = new LabelStyle();
lbl.font = new BitmapFont();
lbl.fontColor = Color.WHITE;
score = new Label("Score: ", lbl);
score.setPosition(getCamera().viewportWidth / 2, getCamera().viewportHeight - 150);
score.setSize(100, 100);
score.setSize(200, 200);
score.setScale(1.5f);
score.act(Gdx.graphics.getDeltaTime()); // update now
How do you find out the size of the system chrome so that I can specify the window size to achieve the stage size I want?
If my main window is set at 800 x 600 (stage), and I create a second window as below, it will be smaller.
public function Main():void
{
var windowOptions:NativeWindowInitOptions = new NativeWindowInitOptions();
windowOptions.systemChrome = NativeWindowSystemChrome.STANDARD;
windowOptions.type = NativeWindowType.NORMAL;
var newWindow:NativeWindow = new NativeWindow( windowOptions );
newWindow.width = 800;
newWindow.height = 600;
newWindow.stage.scaleMode = StageScaleMode.NO_SCALE;
newWindow.stage.align = StageAlign.TOP_LEFT;
newWindow.activate();
}
I assume you increase both newWindow.width = 800; and newWindow.height = 600;to account for the chrome, but how do you find this value?
you can calculate the size of the chrome by substracting the windows size (that include the chrome) with the inner size (that exclude the chrome).
From the width help of NativeWindows :
The dimensions reported for a native window include any system window
chrome that is displayed. The width of the usable display area inside
a window is available from the Stage.stageWidth property.
So the inner size can be obtained with stage object ( stage.stageWidth and stage.stageHeight: )
hence :
var chromeWidth=newWindow.width-newWindow.stage.stageWidth;
var chromeHeight=newWindow.height-newWindow.stage.stageHeight;
When creating ActionScript projects with NO_SCALE the stage.stageHeight and stage.stageWidth cannot be used to calculate chrome in the main application window as they do not resize to conform to the inner width. You must reference the main window stage.
To find the main windows inner stage height and width you can use the stage.nativeWindow.stage references stageHeight and stageWidth properties which gives inner width.
e.g. for a 1280x720 desired inner size:
// width stage.nativeWindow.width = 1280 + (stage.nativeWindow.width -
stage.nativeWindow.stage.stageWidth);
// height stage.nativeWindow.height = 720 + (stage.nativeWindow.height
- stage.nativeWindow.stage.stageHeight);
For reference, as I feel the other answers aren't clear enough. To set a new window to the desired dimensions:
// first set the desired window dimensions to set the (smaller) stage dimensions:
newWindow.width = 1024;
newWindow.height = 768;
// then reset the window dimensions and add chrome dimensions:
newWindow.width = 1024 + (1024 - newWindow.stage.stageWidth);
newWindow.height = 768 + (768 - newWindow.stage.stageHeight);
If I draw a rectangle of say linewidth=2 and then scale it to double the size of the rectangle, I get a rectangle that has its border double the size of the initial linewidth.
Is there a way to keep the linewidth to the perceived size of 2 or the original size.
In short, I want to just scale the size of the rectangle but keep the linewidth visually of size 2.
I tried setting the linewidth before and after the scale(2,2) command but the border width also increases.
One option is to divide the linewidth by the scale factor and this will work if the x and y scale factors are the same.
I don't have the option to scale the rectangle width and height and I need to use the scale command as I have other objects within the rectangle that need the scaling.
You can define path with transformation and stroke it without one. That way line width won't be transformed.
Example:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.save(); //save context without transformation
ctx.scale(2, 0.5); //make transformation
ctx.beginPath(); //define path
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
ctx.restore(); //restore context without transformation
ctx.stroke(); //stroke path
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
The lineWidth should be scaled down beforehand.
ctx.lineWidth = 2 / Math.max(scaleX, scaleY);
ctx.scale(scaleX, scaleY);
ctx.fillRect(50, 50, 50, 50);
Ok, you have a couple of options:
You can do your own scaling of coordinates and dimensions, e.g.
ctx.strokeRect( scaleX * x, scaleY * y, scaleX * width, scaleY * height) ;
And you'll need to apply the scaling to all the other objects too.
Alternatively you could apply the scaling but not rely on lineWidth for drawing the border of the rectangle. A simple method would be to draw the rectangle by filling the correct region and then removing the interior, minus the border, like so:
var scaleX = 1.5, scaleY = 2;
var lineWidth = 2;
ctx.scale(scaleX, scaleY);
ctx.fillStyle = "#000";
ctx.fillRect(100, 50, 100,
ctx.clearRect(100+lineWidth/scaleX, 50+lineWidth/scaleY, 100-(2*lineWidth)/scaleX, 60-(2*lineWidth)/scaleY);
In AS3, I have a Sprite that has a Z axis rotation applied.
How do I calculate that Sprite's dimensions (it's original size) from Sprite.rotationZ and Sprite.getRect(...)?
sprite.width and sprite.height on sprite.rotationZ = 0 would give you the original size.
antpaw's answer is best / easiest. It can also be done without ever seeing it visually if you switch the rotationZ back once you get your width and height, like so
var rotZ:Number = mySprite.rotationZ;
mySprite.rotationZ = 0;
var w:Number = mySprite.width;
var h:Number = mySprite.height;
mySprite.rotationZ = rotZ;
To do this mathematically you could look at this SO post and do the reverse.