Bitmap Font Text upside down when setting a text size

Phaser 3
1

Hi

I’m playing around with bitmap text objects but something weird is happening.

Whenever I set the font size, the text appears upside down. It’s fine If I don’t set the font size, but ideally I’d like to use the same font at different sizes.

I know I could just rotate it, but I’d rather find out why its behaving this way and how to fix it without having to rotate it.

Here is my code:

var config = {
  type: Phaser.AUTO,
  width: 640,
  height: 480,
  scene: {
    preload: preload,
    create: create,
  }

};

var game = new Phaser.Game(config);

function preload() {
  this.load.bitmapFont('oxanium', 'assets/fonts/Oxanium_0.png', 'assets/fonts/Oxanium.fnt');
}

function create() {
  // right way up (no size parameter).
  let text = this.add.bitmapText(320, 180, 'oxanium', 'Hello world!');

  // upside down
  //text.setFontSize(32);

  // upside down (size parameter specified).
  //let text = this.add.bitmapText(320, 180, 'oxanium', 'Hello world!', 50);

  text.setOrigin(0.5);
}

assets/fonts/Oxanium_0.png
(White text on a transparent background, open the image in a new tab or download it to see it properly).

Oxanium_0

assets/fonts/Oxanium.fnt

Oxanium.fnt (33.9 KB)

2

The font file has size="-70". Try changing that to 70.

2 Likes
3

That did it. Thanks samme :slight_smile: