UNPKG

phaser3-bitmapfont-factory

Version:

Creates bitmapfonts in Phaser3 at runtime, using available browser fonts

47 lines (38 loc) 1.5 kB
import { Task } from "./types"; async function makeTexture(scene: Phaser.Scene, tasks: Task[], width: number, height: number): Promise<Phaser.Textures.Texture> { const key = tasks[0].key; const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d', { willReadFrequently: true }); canvas.width = width; canvas.height = height; for (let i = 0; i < tasks.length; i++) { const task = tasks[i]; const glyphs = task.glyphs; ctx.font = task.font; ctx.fillStyle = task.style.color ? task.style.color : 'white'; for (let j = 0; j < glyphs.length; j++) { const glyph = glyphs[j]; ctx.fillText(glyph.letter, glyph.printX, glyph.printY); } } function canvasToTexture(): Promise<Phaser.Textures.Texture> { return new Promise(resolve => { canvas.toBlob( blob => { const image = document.createElement('img'); const url = URL.createObjectURL(blob); image.onload = () => { scene.textures.addImage(key, image); let texture = scene.textures.get(key); URL.revokeObjectURL(url); resolve(texture); }; image.src = url; }, 'image/png' ); }); } return canvasToTexture(); } export { makeTexture }