Wednesday, November 27, 2013

How to handle multiple resolutions / multiple screen sizes with the Starling Framework?

One of the great reasons that i choose Adobe AIR and Starling Framework as my favorite tool to create Android Games is that, it can be easily customized to support multiple resolutions for multiple screens. Honestly,  if you are going to design and re-size every single image of your games for all the Android devices, it is going to make your life much more miserable...

So, actually the complete guide to support multiple resolutions is stated clearly here, which includes the 3 strategies:
a) Stretching the stage
b) Letterbox
c) Smart Object Placement

In this post, particularly, I will demo a quick and an easy approach - Stretching the stage. Just in case you are still getting stuck with the guides, here's a simple working solution for your reference (which i actually use it in all of my games :))


public class myGame extends Sprite
{
    private var mStarling:Starling;
    public function myGame()
    {
        super();
           
        // support autoOrients
        stage.align = StageAlign.TOP_LEFT;
        stage.scaleMode = StageScaleMode.NO_SCALE;
           
        var screenWidth:int  = stage.fullScreenWidth;
        var screenHeight:int = stage.fullScreenHeight;
        var viewPort:Rectangle = new Rectangle(0, 0, screenWidth, screenHeight)
           
        mStarling = new Starling(Game, stage, viewPort);
        mStarling.stage.stageWidth  = 640;
        mStarling.stage.stageHeight = 960;
           
        // set anti-aliasing (higher the better quality but slower performance)
        mStarling.antiAliasing = 1;
           
        // start it!
        mStarling.start();
    }

}

What is actually done is that, in the codes, i have defined my default device to be a screen with the width = 640px and the height = 960px (ratio w:h = 2:3). With this, all my game elements (buttons, background images, etc) would be designed based on this resolution. Then, if the game is loaded into a device with a different screen size (and pixel density), the Starling would help me re-size accordingly. It could be a compromise, but it will effectively save you a lot of time.

Isn't that easy and convenient compared to that in the Java Eclipse?

No comments:

Post a Comment