How can my flash app fit correctly in all Android devices?

Question

I am making a Flash game for Android devices. I made my game to fit the dimensions of an HTC EVO 4G, but when I play it on a different device such as a Motorola Droid 2 with different dimensions; it does not fill up the whole screen. How do I make it so that my flash game fits the screen correctly of all Android devices?

Answer 1

You need to avoid using absolute numbers. So instead of setting your game to run at 800px in width, you make it run at stage.stageWidth and you use resize functions (add an Event.RESIZE listener to stage ) to make sure everything fits within that. The idea is to completely eliminate any hard values. Everything should be relative.

You should also avoid setting the stage size on mobile devices entirely. I cannot remember if that will even work in AIR, honestly. Avoid setting stage size, and avoid setting stage.scaleMode too

So you want to center something? On the 800px screen, you may have set the x value to 450px for a 100px wide object. Now, you need to set it to (stage.stageWidth - object.width ) / 2 . Things like that. My guess is you will have to rewrite a significant portion of your game to do this.

It's also worth noting that your assets are likely too small for higher-resolution screens. The EVO 4G was just 217 dpi. Nowadays, there isn't a high-end phone out there lower than 320 dpi (the iPhone) with many in the mid-400's. Android currently supports as high as 680 dpi, I believe.

Long story short, if you are programming for a single screen size, you are doing it completely wrong. Everything you do, no matter what device or platform or os or technology, should be screen-independent at this point.

Answer 2

There may be an easier way to do this but you can listen for the Resize event which will give you the correct stage size for the device you are on. Once it has been fired, you can calculate the your new scale factor based on the new size then apply that scaling to your display objects. The 800 x 480 is just going to be whatever resolution you are targeting to being with, you can make constants for these values. I've tried it and it works but like I said there may be an easier way.

public class MyApp extends Sprite
{

    public static var _scaleFactorX:Number = 1.0;
    public static var _scaleFactorY:Number = 1.0;

    public function MyApp ()
    {
        super();

        // support autoOrients
        stage.align = StageAlign.TOP_LEFT;
        stage.scaleMode = StageScaleMode.NO_SCALE;

        this.stage.addEventListener(flash.events.Event.RESIZE, resize);
    }

    public function init():void
    {
        // Set up our scale factor
        _scaleFactorX = this.stage.stageWidth / 800;
        _scaleFactorY = this.stage.stageHeight / 480;
    }

    protected function resize(event:Event):void
    {
        this.stage.removeEventListener(flash.events.Event.RESIZE, resize);
        init();
    }
}

Answer 3

Set the stage scale mode to "no border":

import flash.display.StageScaleMode;

 stage.scaleMode = StageScaleMode.NO_BORDER;

Answer 4

You could try this tutorial

Very simple and well defined. I'm using the same approach for my projects and works fine.