PixiJS

Class: BitmapFont

PIXI.BitmapFont

BitmapFont represents a typeface available for use with the BitmapText class. Use the install method for adding a font to be used.

new PIXI.BitmapFont (data, textures)

BitmapFont.ts:111
Name Type Description
data PIXI.BitmapFontData
textures Array<PIXI.Texture> | ObjectPIXI.Texture>

Members

PIXI.BitmapFont.ALPHA Array> static

This character set includes all the letters in the alphabet (both lower- and upper- case).

Example

 BitmapFont.from("ExampleFont", style, { chars: BitmapFont.ALPHA })

PIXI.BitmapFont.ALPHANUMERIC Array> static

This character set is the union of BitmapFont.ALPHA and BitmapFont.NUMERIC.

PIXI.BitmapFont.ASCII Array> static

This character set consists of all the ASCII table.

See:

PIXI.BitmapFont.available ObjectPIXI.BitmapFont> static

Collection of available/installed fonts.

PIXI.BitmapFont.defaultOptions PIXI.IBitmapFontOptions static

Collection of default options when using BitmapFont.from.

Properties:
Name Type Attributes Value Description
chars string | Array | Array> <constant>
 PIXI

.BitmapFont.ALPHANUMERIC
padding number <constant>
 4
resolution number <constant>
 1
textureHeight number <constant>
 512
textureWidth number <constant>
 512

PIXI.BitmapFont.NUMERIC Array> static

This character set includes all decimal digits (from 0 to 9).

Example

 BitmapFont.from("ExampleFont", style, { chars: BitmapFont.NUMERIC })

chars object

The map of characters by character code.

font string

The name of the font face.

lineHeight number

The line-height of the font face in pixels.

size number

The size of the font face in pixels.

Methods

PIXI.BitmapFont.from (name, style, options) PIXI.BitmapFont static

BitmapFont.ts:312

Generates a bitmap-font for the given style and character set. This does not support kernings yet. With style properties, only the following non-layout properties are used:

  • (PIXI.TextStyle#dropShadow|dropShadow)
  • (PIXI.TextStyle#dropShadowDistance|dropShadowDistance)
  • (PIXI.TextStyle#dropShadowColor|dropShadowColor)
  • (PIXI.TextStyle#dropShadowBlur|dropShadowBlur)
  • (PIXI.TextStyle#dropShadowAngle|dropShadowAngle)
  • (PIXI.TextStyle#fill|fill)
  • (PIXI.TextStyle#fillGradientStops|fillGradientStops)
  • (PIXI.TextStyle#fillGradientType|fillGradientType)
  • (PIXI.TextStyle#fontFamily|fontFamily)
  • (PIXI.TextStyle#fontSize|fontSize)
  • (PIXI.TextStyle#fontVariant|fontVariant)
  • (PIXI.TextStyle#fontWeight|fontWeight)
  • (PIXI.TextStyle#lineJoin|lineJoin)
  • (PIXI.TextStyle#miterLimit|miterLimit)
  • (PIXI.TextStyle#stroke|stroke)
  • (PIXI.TextStyle#strokeThickness|strokeThickness)
  • (PIXI.TextStyle#textBaseline|textBaseline)
Name Type Attributes Default Description
name string

The name of the custom font to use with BitmapText.
style object | PIXI.TextStyle <optional>

Style options to render with BitmapFont.
options PIXI.IBitmapFontOptions <optional>

Setup options for font or name of the font.
options.chars string | Array | Array> <optional>
 PIXI.BitmapFont.ALPHANUMERIC

characters included in the font set. You can also use ranges. For example, [['a', 'z'], ['A', 'Z'], "!@#$%^&*()~{}[] "]. Don't forget to include spaces ' ' in your character set!
options.resolution number <optional>
 1

Render resolution for glyphs.
options.textureWidth number <optional>
 512

Optional width of atlas, smaller values to reduce memory.
options.textureHeight number <optional>
 512

Optional height of atlas, smaller values to reduce memory.
options.padding number <optional>
 4

Padding between glyphs on texture atlas.
Returns:
Type Description
PIXI.BitmapFont Font generated by style options.
Example

 PIXI.BitmapFont.from("TitleFont", {
     fontFamily: "Arial",
     fontSize: 12,
     strokeThickness: 2,
     fill: "purple"
 });

 const title = new PIXI.BitmapText("This is the title", { fontName: "TitleFont" });

PIXI.BitmapFont.install (data, textures) PIXI.BitmapFont static

BitmapFont.ts:246

Register a new bitmap font.

Name Type Description
data XMLDocument | string | PIXI.BitmapFontData

The characters map that could be provided as xml or raw string.
textures ObjectPIXI.Texture> | PIXI.Texture | Array<PIXI.Texture>

List of textures for each page.
Returns:
Type Description
PIXI.BitmapFont Result font object with font, size, lineHeight and char fields.

PIXI.BitmapFont.uninstall (name) void static

BitmapFont.ts:293

Remove bitmap font by name.

Name Type Description
name string

destroy () void

BitmapFont.ts:224

Remove references to created glyph textures.