Closed
Description
Version
- Phaser Version: 3.80.1
- Operating system: Windows 11
- Browser: Chrome, Edge
Description
When using a BitmapText with setMaxWidth if the max width is less than one of the word's width it creates additional empty lines changing the object's height. This does not happen with text game object.
Example Test Code
class MainScene extends Phaser.Scene {
constructor() {
super({ key: "MainScene" });
}
preload() {
this.load.bitmapFont('gothic', 'https://labs.phaser.io/assets/fonts/bitmap/gothic.png', 'https://labs.phaser.io/assets/fonts/bitmap/gothic.xml');
}
create() {
// Text
const text = this.add.text(100, 100, 'Hello Phaser', { fontFamily: 'Arial Black', fontSize: 32 });
text.style.setWordWrapWidth(30);
// Rectangle matches with game object size
this.add.rectangle(text.x, text.y, text.width, text.height, 0xff00ff, 0.3).setOrigin(0);
// Bitmap Text
const bitmapText = this.add.bitmapText(100, 400, 'gothic', 'Hello Phaser', 32);
bitmapText.setMaxWidth(30);
// Rectangle shows the extra empty line
this.add.rectangle(bitmapText.x, bitmapText.y, bitmapText.width, bitmapText.height, 0xff00ff, 0.3).setOrigin(0);
}
}
const game = new Phaser.Game({
type: Phaser.AUTO,
width: 800,
height: 800,
backgroundColor: '#111111',
scale: {
mode: Phaser.Scale.FIT,
autoCenter: Phaser.Scale.CENTER_BOTH
},
scene: [MainScene]
})
Test screenshot
The BitmapText (bottom) has 3 lines, should have only 2 like the text on the top.
Expected behaviour
Bitmap text should not add additional empty lines even if its text cant fit with the given max width.