Author Topic: Scaling for Mobile Devices With Flixel  (Read 3720 times)

OldmanBiles

  • Member
  • **
  • Posts: 15
  • Karma: +0/-0
    • View Profile
Scaling for Mobile Devices With Flixel
« on: Mon, Feb 27, 2012 »
Hi all, I joined up to the forums looking for help but I did say i'd give something back eventually. So here it is!

I've recently just finished a little game with Flixel on the android market.
Apart from some speed issues on older devices (mostly to do with Flixel not being completely brilliant on older, slower mobile devices) The end result is not too bad for a few days of work. One thing I wanted to share was the code I used to automatically scale the screen size based on the device resolution.
I ended up rewriting the entire game after I tried to test the game on a tablet and the whole thing didn't scale. Obviously you still have to scale and reposition the sprites and tilemaps based on screen size anyway along with handling camera bounds, etc.
Anyway here's the code, remember it has to be an AIR application.
Code: [Select]
package
{
import org.flixel.FlxGame;

/**
* ...
* @author OldManBiles
*/
public class Main extends FlxGame
{

public function Main():void
{
super(100, 100, setUpScreen, 1);
}

}

}
Code: [Select]
package 
{
import flash.display.StageDisplayState;
import flash.system.Capabilities;
import org.flixel.*

/**
* ...
* @author OldManBiles
*/
public class setUpScreen extends FlxState
{
public function setUpScreen()
{
FlxG.stage.displayState = StageDisplayState.FULL_SCREEN;
FlxG.stage.stageHeight = Capabilities.screenResolutionY;
FlxG.stage.stageWidth = Capabilities.screenResolutionX;
FlxG.width = FlxG.stage.stageWidth / FlxCamera.defaultZoom;
                        FlxG.height = FlxG.stage.stageHeight / FlxCamera.defaultZoom;
        }

override public function update():void
{
FlxG.switchState(new mainState());

}
}

}
Code: [Select]
package 
{
import flash.events.Event;
import org.flixel.*

/**
* ...
* @author OldManBiles
*/
public class mainState extends FlxState
{
private var background:FlxSprite;
private var sprite:FlxSprite;


public function mainState()
{
background = new FlxSprite(0, 0)
background.makeGraphic(FlxG.width, FlxG.height, 0xFFFF8000, true);
add(background);

sprite = new FlxSprite(0, 0)
sprite.x = (FlxG.width / 2) - (sprite.width / 2);
sprite.y = (FlxG.height / 2) - (sprite.height / 2);
add(sprite);
}

}

}

The SetUpScreen state is where the magic happens, which is why it is always called before everything else. I call the Capabilities function available within AIR which allows you to return the screenresolution of the current device. I then set the actual flash stage width and then the flixel stage width ( I made the critical mistake of forgetting to set the actual flash stage before!).

I hope this helps.

Adam.

test84

  • Key Contributor
  • *****
  • Posts: 1328
  • Karma: +0/-0
  • ت
    • View Profile
    • My personal site.
Re: Scaling for Mobile Devices With Flixel
« Reply #1 on: Tue, Jun 28, 2016 »
Could anyone get this to work? I did what he suggested but nothing scales.
blog, twitter, Check out my award winning game, Rot Gut: