Adding the ability to display "Text" objects from Tiled
I honestly don't believe text objects look good on map, and in real maps, I think text should be written on tiles. However, for a variety of use cases (like in test maps in the /maps/test directory, it can be useful to be able to display some text easily on a map. This PR adds the ability to display this text. Note: the "font" support cannot work correctly, as Tiled is listing fonts from the local system, and those fonts are not available in a browser.
This commit is contained in:
parent
e37ab7d8ad
commit
22cb41dc29
4 changed files with 247 additions and 0 deletions
45
front/src/Phaser/Components/TextUtils.ts
Normal file
45
front/src/Phaser/Components/TextUtils.ts
Normal file
|
@ -0,0 +1,45 @@
|
|||
import {ITiledMapObject} from "../Map/ITiledMap";
|
||||
import Text = Phaser.GameObjects.Text;
|
||||
import {GameScene} from "../Game/GameScene";
|
||||
import TextStyle = Phaser.GameObjects.TextStyle;
|
||||
|
||||
export class TextUtils {
|
||||
public static createTextFromITiledMapObject(scene: GameScene, object: ITiledMapObject): void {
|
||||
if (object.text === undefined) {
|
||||
throw new Error('This object has not textual representation.');
|
||||
}
|
||||
const options: {font?: string} = {};
|
||||
let font = '';
|
||||
if (object.text.italic) {
|
||||
font += 'italic ';
|
||||
}
|
||||
// Note: there is no support for "strikeout" and "underline"
|
||||
let fontSize: number = 16;
|
||||
if (object.text.pixelsize) {
|
||||
font += object.text.pixelsize+'px ';
|
||||
fontSize = object.text.pixelsize;
|
||||
} else {
|
||||
font += '16px ';
|
||||
}
|
||||
if (object.text.fontfamily) {
|
||||
font += '"'+object.text.fontfamily+'"';
|
||||
}
|
||||
if (font !== '') {
|
||||
options.font = font;
|
||||
}
|
||||
const textElem = scene.add.text(object.x, object.y, object.text.text, options);
|
||||
textElem.setFontSize(fontSize);
|
||||
let color = '#000000';
|
||||
if (object.text.color !== undefined) {
|
||||
color = object.text.color;
|
||||
}
|
||||
textElem.setColor(color);
|
||||
if (object.text.wrap) {
|
||||
textElem.setWordWrapWidth(textElem.width);
|
||||
}
|
||||
textElem.setAngle(object.rotation);
|
||||
if (object.text.halign !== undefined) {
|
||||
textElem.setAlign(object.text.halign);
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue