UNPKG

pixi.js

Version:

<p align="center"> <a href="https://pixijs.com" target="_blank" rel="noopener noreferrer"> <img height="150" src="https://files.pixijs.download/branding/pixijs-logo-transparent-dark.svg?v=1" alt="PixiJS logo"> </a> </p> <br/> <p align="center">

1 lines 10.8 kB
{"version":3,"file":"BitmapFont.mjs","sources":["../../../src/scene/text-bitmap/BitmapFont.ts"],"sourcesContent":["import { Rectangle } from '../../maths/shapes/Rectangle';\nimport { Texture } from '../../rendering/renderers/shared/texture/Texture';\nimport { AbstractBitmapFont } from './AbstractBitmapFont';\nimport { BitmapFontManager } from './BitmapFontManager';\n\nimport type { FontMetrics } from '../text/canvas/CanvasTextMetrics';\nimport type { BitmapFontData } from './AbstractBitmapFont';\nimport type { BitmapFontInstallOptions } from './BitmapFontManager';\n\n/**\n * Options for creating a BitmapFont. Used when loading or creating bitmap fonts from existing textures and data.\n * @example\n * ```ts\n * import { BitmapFont, Texture } from 'pixi.js';\n *\n * // Create a bitmap font from loaded textures and data\n * const font = new BitmapFont({\n * // Font data containing character metrics and layout info\n * data: {\n * pages: [{ id: 0, file: 'font.png' }],\n * chars: {\n * '65': { // 'A'\n * id: 65,\n * page: 0,\n * x: 0,\n * y: 0,\n * width: 32,\n * height: 32,\n * xOffset: 0,\n * yOffset: 0,\n * xAdvance: 32,\n * letter: 'A'\n * }\n * // ... other characters\n * },\n * fontSize: 32,\n * lineHeight: 36,\n * baseLineOffset: 26,\n * fontFamily: 'MyFont',\n * // Optional distance field info for MSDF/SDF fonts\n * distanceField: {\n * type: 'msdf',\n * range: 4\n * }\n * },\n * // Array of textures containing the font glyphs\n * textures: [\n * Texture.from('font.png')\n * ]\n * });\n * ```\n * @category text\n * @standard\n */\nexport interface BitmapFontOptions\n{\n /**\n * The bitmap font data containing character metrics, layout information,\n * and font properties. This includes character positions, dimensions,\n * kerning data, and general font settings.\n */\n data: BitmapFontData;\n\n /**\n * Array of textures containing the font glyphs. Each texture corresponds\n * to a page in the font data. For simple fonts this is typically just\n * one texture, but complex fonts may split glyphs across multiple textures.\n */\n textures: Texture[];\n}\n\n/**\n * A BitmapFont object represents a particular font face, size, and style.\n * This class handles both pre-loaded bitmap fonts and dynamically generated ones.\n * @example\n * ```ts\n * import { BitmapFont, Texture } from 'pixi.js';\n *\n * // Create a bitmap font from loaded textures and data\n * const font = new BitmapFont({\n * data: {\n * pages: [{ id: 0, file: 'font.png' }],\n * chars: {\n * '65': { // 'A'\n * id: 65,\n * page: 0,\n * x: 0,\n * y: 0,\n * width: 32,\n * height: 32,\n * xOffset: 0,\n * yOffset: 0,\n * xAdvance: 32,\n * letter: 'A'\n * }\n * },\n * fontSize: 32,\n * lineHeight: 36,\n * baseLineOffset: 26,\n * fontFamily: 'MyFont',\n * distanceField: {\n * type: 'msdf',\n * range: 4\n * }\n * },\n * textures: [Texture.from('font.png')]\n * });\n *\n * // Install a font for global use\n * BitmapFont.install({\n * name: 'MyCustomFont',\n * style: {\n * fontFamily: 'Arial',\n * fontSize: 32,\n * fill: '#ffffff',\n * stroke: { color: '#000000', width: 2 }\n * }\n * });\n *\n * // Uninstall when no longer needed\n * BitmapFont.uninstall('MyCustomFont');\n * ```\n * @category text\n * @standard\n */\nexport class BitmapFont extends AbstractBitmapFont<BitmapFont>\n{\n /**\n * The URL from which the font was loaded, if applicable.\n * This is useful for tracking font sources and reloading.\n * @example\n * ```ts\n * console.log(font.url); // 'fonts/myFont.fnt'\n * ```\n */\n public url?: string;\n\n constructor(options: BitmapFontOptions, url?: string)\n {\n super();\n\n const { textures, data } = options;\n\n Object.keys(data.pages).forEach((key: string) =>\n {\n const pageData = data.pages[parseInt(key, 10)];\n\n const texture = textures[pageData.id];\n\n this.pages.push({ texture });\n });\n\n Object.keys(data.chars).forEach((key: string) =>\n {\n const charData = data.chars[key];\n const {\n frame: textureFrame,\n source: textureSource,\n } = textures[charData.page];\n\n const frameReal = new Rectangle(\n charData.x + textureFrame.x,\n charData.y + textureFrame.y,\n charData.width,\n charData.height,\n );\n\n const texture = new Texture({\n source: textureSource,\n frame: frameReal\n });\n\n this.chars[key] = {\n id: key.codePointAt(0),\n xOffset: charData.xOffset,\n yOffset: charData.yOffset,\n xAdvance: charData.xAdvance,\n kerning: charData.kerning ?? {},\n texture,\n };\n });\n\n this.baseRenderedFontSize = data.fontSize;\n\n (this.baseMeasurementFontSize as number) = data.fontSize;\n (this.fontMetrics as FontMetrics) = {\n ascent: 0,\n descent: 0,\n fontSize: data.fontSize,\n };\n (this.baseLineOffset as number) = data.baseLineOffset;\n (this.lineHeight as number) = data.lineHeight;\n (this.fontFamily as string) = data.fontFamily;\n (this.distanceField as { type: string, range: number }) = data.distanceField ?? {\n type: 'none',\n range: 0,\n };\n\n this.url = url;\n }\n\n /** Destroys the BitmapFont object. */\n public override destroy(): void\n {\n super.destroy();\n\n for (let i = 0; i < this.pages.length; i++)\n {\n const { texture } = this.pages[i];\n\n texture.destroy(true);\n }\n\n (this.pages as null) = null;\n }\n\n /**\n * Generates and installs a bitmap font with the specified options.\n * The font will be cached and available for use in BitmapText objects.\n * @param options - Setup options for font generation\n * @returns Installed font instance\n * @example\n * ```ts\n * // Install a basic font\n * BitmapFont.install({\n * name: 'Title',\n * style: {\n * fontFamily: 'Arial',\n * fontSize: 32,\n * fill: '#ffffff'\n * }\n * });\n *\n * // Install with advanced options\n * BitmapFont.install({\n * name: 'Custom',\n * style: {\n * fontFamily: 'Arial',\n * fontSize: 24,\n * fill: '#00ff00',\n * stroke: { color: '#000000', width: 2 }\n * },\n * chars: [['a', 'z'], ['A', 'Z'], ['0', '9']],\n * resolution: 2,\n * padding: 4,\n * textureStyle: {\n * scaleMode: 'nearest'\n * }\n * });\n * ```\n */\n public static install(options: BitmapFontInstallOptions)\n {\n BitmapFontManager.install(options);\n }\n /**\n * Uninstalls a bitmap font from the cache.\n * This frees up memory and resources associated with the font.\n * @param name - The name of the bitmap font to uninstall\n * @example\n * ```ts\n * // Remove a font when it's no longer needed\n * BitmapFont.uninstall('MyCustomFont');\n *\n * // Clear multiple fonts\n * ['Title', 'Heading', 'Body'].forEach(BitmapFont.uninstall);\n * ```\n */\n public static uninstall(name: string)\n {\n BitmapFontManager.uninstall(name);\n }\n}\n"],"names":[],"mappings":"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"}