So something I’ve found recently is that FlashPunk is pretty good for prototyping for mobile games. Getting something up and running is quicker than tools like Unity and AS3 has support for pretty much all the common features smartphones have these days. Plus it’s always nice to have something you can show off to people when out and about. Of course, due to FP’s CPU blitting, you’ll never achieve 30+ FPS at native res but given most devs work at 320 x 240 and scale upwards this shouldn’t be a problem on any supported iOS/flagship android device (Nexus 7/10, HTC One, Galaxy IV etc).
Here’s a basic Main.as to help you get started with a mobile/desktop hybrid project that will handle any (almost) resolution you throw at it (remember to set the flag of what platform you’re targeting to TRUE):
package
{
import flash.system.Capabilities;
import net.flashpunk.Engine;
import net.flashpunk.FP;
[SWF(width = "640", height = "480")] //Resolution of the game (Desktop version)
public class Main extends Engine
{
public static const MOBILE:Boolean = false;
public static const AIRPACKAGE:Boolean = false;
public static const IOS:Boolean = false;
public static const ANDROID:Boolean = false;
//Used for packaging desktop AIR, iOS and Android apps. Set in the constructor, ensures game always scales to correct size regardless
//of device.
private var screenResolutionX:int;
private var screenResolutionY:int;
private var screenScale:int;
public function Main():void
{
if (MOBILE || AIRPACKAGE)
{
//Grab screen resolution of device
screenResolutionX = Capabilities.screenResolutionX;
screenResolutionY = Capabilities.screenResolutionY;
if (IOS)
{
if (Capabilities.screenResolutionX == 640) {screenScale = 2;} //iPhone 4 expample
}
else if (ANDROID)
{
if (Capabilities.screenDPI >= 410) {screenScale = 8;} //HTC One Example
}
else if (AIRPACKAGE)
{
//TODO: Grab common resolutions for PC screens.
screenScale = 4;
}
}
else
{
//Default size for desktop is 320 x 480, scaled by 2
screenResolutionX = 320;
screenResolutionY = 240;
screenScale = 2;
}
//Initalize game. Tip - when working on Mobile, be sure to divide screen resolution by screen scale,
//This saves processing power (important as Flashpunk uses the CPU to render atm) and helps enhance the
//game's pixel art look.
super(screenResolutionX, screenResolutionY, 30, false);
FP.screen.scale = screenScale;
//FP.console.enable();
}
So a few things here. First, this type of scaling is suited to a certain type of game, like the single screen puzzle game I’m currently making and which this code sample is from. Very few objects use fixed x and y positions making it easier for things to re-position according to resolution and aspect ratio. Games like platformers which benefit from having a fixed viewpoint will most likely need to find another way. Secondly, you’ll need to test on-device/use a simulator for the mobile build as annoyingly the ADL reads the screen resolution of the desktop and not the test device. There’s a great tutorial that comes bundled with the mobile project template on how to get that running.
Lastly, about how to tell what scaleSize to use. On iOS this is pretty easy: 1x For iPhone 3GS (assuming that’s the base), 2x For iPhone 4/S & 5, 4x for iPad 1/2/Mini and 8x For iPad 3/4. On android, not so much: Google themselves say that instead of resolutions you should be using DPI values instead. It’ll take a bit of experimenting to get things right (for example, what looks good at 2x on my nexus 7 looks absolutely tiny on the HTC One).
Hope this helps Also feel free to correct me if I’m wrong on anything. Happy making!