PDA

View Full Version : Auto-Resizing and Centering your Content tutorial



arsenalfc
August 11th, 2009, 07:16 AM
I've just run through this tutorial and I've got my site centering in my browser as planned.

http://www.kirupa.com/developer/as3/resizing_centering_as3.htm

However when I resize my browser window the text (I'm using a pixel font) is going fuzzy.

Is there some way I can lock 'centerRectangle' to a rounded X and Y coordinate so that this doesn't happen?



function init()
{
stage.align=StageAlign.TOP_LEFT;
stage.scaleMode=StageScaleMode.NO_SCALE;

stage.addEventListener(Event.RESIZE, updateSize);
stage.dispatchEvent(new Event(Event.RESIZE));

backgroundRectangle.x = 0;
backgroundRectangle.y = 0;
}

init();

function updateSize(e:Event)
{
//Set background's size
backgroundRectangle.width = stage.stageWidth;
backgroundRectangle.height = stage.stageHeight;

//center content
centerRectangle.x = stage.stageWidth/2 - centerRectangle.width/2;
centerRectangle.y = stage.stageHeight/2 - centerRectangle.height/2;
}

komapeb
August 11th, 2009, 07:29 AM
Yes, it is :)



centerRectangle.x = Math.round(stage.stageWidth/2 - centerRectangle.width/2);
centerRectangle.y = Math.round(stage.stageHeight/2 - centerRectangle.height/2);

arsenalfc
August 11th, 2009, 09:02 AM
Komapeb I salute you!

Thank you.