[SOLVED] Flash fullscreen mode: center vertically

#1

Hello,

I’d like to display my swf in fullscreen mode but I want to keep the width/height ratio to avoid any distortion. So, if the screen ratio does not match the game ratio (16:9), I would like to center the content of the game vertically, I mean having the same border at the top and at the bottom.

So, in my main class, I set up the stage like this:

stage.align = flash.display.StageAlign.TOP;
stage.scaleMode = flash.display.StageScaleMode.SHOW_ALL;
stage.displayState = StageDisplayState.NORMAL;

And then I listen to the Event.FULLSCREEN to adjust the Lib.current.y value if necessary:

// exit fullscreen
if(Lib.current.stage.displayState == StageDisplayState.NORMAL) {
     
      Lib.current.y = 0;

} 
// enter fullscreen
else {

      var winWidth = openfl.system.Capabilities.screenResolutionX, // screen width
          winHeight = openfl.system.Capabilities.screenResolutionY, // screen height
          baseWidth:Int = 960, // width of the game in normal mode
          baseHeight:Int = 540; // height of the game in normal mode

    var height:Float = (winWidth * baseHeight) / baseWidth; // The height of the game in fullscreen mode
     
    if(winHeight > height) {
                
         var marginY:Int = Math.floor( (winHeight - height) / 2 );
         Lib.current.y = marginY;
    }
}

This code does not work. What I get is a bigger margin at the top than at the bottom. I don’t understand why? How could I vertically center the game?

Thanks!

1 Like
#2

If you only need it to work in Flash:

stage.scaleMode = StageScaleMode.SHOW_ALL;
stage.align = untyped "";

If you’re compiling for multiple targets, use this.

#3

I only target flash. Thank you for the tip, it works :slight_smile: !

#4

Do not forget to make your post solved