Class Font

Represents a system or web font in Excalibur

If no options specified, the system sans-serif 10 pixel is used

If loading a custom web font be sure to have the font loaded before you use it https://erikonarheim.com/posts/dont-test-fonts/

Hierarchy

Graphic
- Font

Implements

FontRenderer

Index

Constructors

constructor

new Font(options?: FontOptions & GraphicOptions & RasterOptions): Font
Parameters
- options: FontOptions & GraphicOptions & RasterOptions = {}
Returns Font
Overrides Graphic.constructor
- Defined in Graphics/Font.ts:25

Properties

baseAlign

baseAlign: BaseAlign = BaseAlign.Alphabetic

bold

bold: boolean = false

color

color: Color = Color.Black

direction

direction: Direction = Direction.LeftToRight

family

family: string = 'sans-serif'

filtering

filtering: ImageFiltering = ImageFiltering.Blended

Set the font filtering mode, by default set to ImageFiltering.Blended regardless of the engine default smoothing

If you have a pixel style font that may be a reason to switch this to ImageFiltering.Pixel

`Readonly` id

id: number = ...

lineDash

lineDash: number[] = []

lineWidth

lineWidth: number = 1

opacity

opacity: number = 1

Gets or sets the opacity of the graphic, 0 is transparent, 1 is solid (opaque).

padding

padding: number = 2

quality

quality: number = 2

Font quality determines the size of the underlying raster text, higher quality means less jagged edges. If quality is set to 1, then just enough raster bitmap is generated to render the text.

You can think of quality as how zoomed in to the text you can get before seeing jagged edges.

(Default 2)

shadow

shadow: {
    blur?: number;
    color?: Color;
    offset?: Vector;
} = null

Type declaration

Optional blur?: number
Optional color?: Color
Optional offset?: Vector

showDebug

showDebug: boolean = false

Gets or sets wether to show debug information about the graphic

size

size: number = 10

smoothing

smoothing: boolean = false

strokeColor

strokeColor: Color

style

style: FontStyle = FontStyle.Normal

textAlign

textAlign: TextAlign = TextAlign.Left

tint

tint: Color = null

transform

transform: AffineMatrix = ...

unit

unit: FontUnit = FontUnit.Px

Accessors

flipHorizontal

get flipHorizontal(): boolean
Gets or sets the flipHorizontal, which will flip the graphic horizontally (across the y axis)

Returns boolean
Inherited from Graphic.flipHorizontal
- Defined in Graphics/Graphic.ts:77
set flipHorizontal(value: boolean): void
Parameters
- value: boolean
Returns void
Inherited from Graphic.flipHorizontal
- Defined in Graphics/Graphic.ts:81

flipVertical

get flipVertical(): boolean
Gets or sets the flipVertical, which will flip the graphic vertically (across the x axis)

Returns boolean
Inherited from Graphic.flipVertical
- Defined in Graphics/Graphic.ts:90
set flipVertical(value: boolean): void
Parameters
- value: boolean
Returns void
Inherited from Graphic.flipVertical
- Defined in Graphics/Graphic.ts:94

fontString

get fontString(): string
Returns string
- Defined in Graphics/Font.ts:104

height

get height(): number
Gets or sets the height of the graphic (always positive)

Returns number
Inherited from Graphic.height
- Defined in Graphics/Graphic.ts:183
set height(value: number): void
Parameters
- value: number
Returns void
Inherited from Graphic.height
- Defined in Graphics/Graphic.ts:192

localBounds

get localBounds(): BoundingBox
Gets a copy of the bounds in pixels occupied by the graphic on the the screen. This includes scale.

Returns BoundingBox
Overrides Graphic.localBounds
- Defined in Graphics/Font.ts:110

origin

get origin(): Vector
Gets or sets the origin of the graphic, if not set the center of the graphic is the origin

Returns Vector
Inherited from Graphic.origin
- Defined in Graphics/Graphic.ts:136
set origin(value: Vector): void
Parameters
- value: Vector
Returns void
Inherited from Graphic.origin
- Defined in Graphics/Graphic.ts:140

rotation

get rotation(): number
Gets or sets the rotation of the graphic

Returns number
Inherited from Graphic.rotation
- Defined in Graphics/Graphic.ts:103
set rotation(value: number): void
Parameters
- value: number
Returns void
Inherited from Graphic.rotation
- Defined in Graphics/Graphic.ts:107

scale

get scale(): Vector
Gets or sets the scale of the graphic, this affects the width and

Returns Vector
Inherited from Graphic.scale
- Defined in Graphics/Graphic.ts:121
set scale(value: Vector): void
Parameters
- value: Vector
Returns void
Inherited from Graphic.scale
- Defined in Graphics/Graphic.ts:125

width

get width(): number
Gets or sets the width of the graphic (always positive)

Returns number
Inherited from Graphic.width
- Defined in Graphics/Graphic.ts:174
set width(value: number): void
Parameters
- value: number
Returns void
Inherited from Graphic.width
- Defined in Graphics/Graphic.ts:187

Methods

`Protected` _drawImage

_drawImage(_ex: ExcaliburGraphicsContext, _x: number, _y: number): void
Meant to be overridden by the graphic implementation to draw the underlying image (HTMLCanvasElement or HTMLImageElement) to the graphics context without transform. Transformations like position, rotation, and scale are handled by Graphic._preDraw and Graphic._postDraw
Parameters
- _ex: ExcaliburGraphicsContext
  
  The excalibur graphics context
- _x: number
- _y: number
Returns void
Overrides Graphic._drawImage
- Defined in Graphics/Font.ts:114

`Protected` _flip

_flip(ex: ExcaliburGraphicsContext): void
Parameters
- ex: ExcaliburGraphicsContext
Returns void
Overrides Graphic._flip
- Defined in Graphics/Font.ts:126

`Protected` _postDraw

_postDraw(ex: ExcaliburGraphicsContext): void
Apply any additional work after Graphic._drawImage and restore the context state.
Parameters
- ex: ExcaliburGraphicsContext
Returns void
Overrides Graphic._postDraw
- Defined in Graphics/Font.ts:155

`Protected` _preDraw

_preDraw(ex: ExcaliburGraphicsContext, x: number, y: number): void
Apply affine transformations to the graphics context to manipulate the graphic before Graphic._drawImage
Parameters
- ex: ExcaliburGraphicsContext
- x: number
- y: number
Returns void
Inherited from Graphic._preDraw
- Defined in Graphics/Graphic.ts:232

`Protected` _rotate

_rotate(ex: ExcaliburGraphicsContext): void
Parameters
- ex: ExcaliburGraphicsContext
Returns void
Overrides Graphic._rotate
- Defined in Graphics/Font.ts:118

clone

clone(): Font
Returns a new instance of the graphic that has the same properties

Returns Font
Overrides Graphic.clone
- Defined in Graphics/Font.ts:55

cloneGraphicOptions

cloneGraphicOptions(): GraphicOptions
Returns GraphicOptions
Inherited from Graphic.cloneGraphicOptions
- Defined in Graphics/Graphic.ts:158

draw

draw(ex: ExcaliburGraphicsContext, x: number, y: number): void
Draw the whole graphic to the context including transform
Parameters
- ex: ExcaliburGraphicsContext
  
  The excalibur graphics context
- x: number
- y: number
Returns void
Inherited from Graphic.draw
- Defined in Graphics/Graphic.ts:210

isStale

isStale(): boolean
Returns boolean
Inherited from Graphic.isStale
- Defined in Graphics/Graphic.ts:63

measureText

measureText(text: string, maxWidth?: number): BoundingBox
Returns a BoundingBox that is the total size of the text including multiple lines

Does not include any padding or adjustment

Returns
BoundingBox
Parameters
- text: string
- Optional maxWidth: number
Returns BoundingBox
Implementation of FontRenderer.measureText
- Defined in Graphics/Font.ts:151

measureTextWithoutCache

measureTextWithoutCache(text: string, maxWidth?: number): BoundingBox
Parameters
- text: string
- Optional maxWidth: number
Returns BoundingBox
- Defined in Graphics/Font.ts:140

render

render(ex: ExcaliburGraphicsContext, text: string, colorOverride: Color, x: number, y: number, maxWidth?: number): void
Parameters
- ex: ExcaliburGraphicsContext
- text: string
- colorOverride: Color
- x: number
- y: number
- Optional maxWidth: number
Returns void
Implementation of FontRenderer.render
- Defined in Graphics/Font.ts:159

Class Font

Hierarchy

Implements

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

options: FontOptions & GraphicOptions & RasterOptions = {}

Returns Font

Properties

baseAlign

bold

color

direction

family

filtering

Readonly id

lineDash

lineWidth

opacity

padding

quality

shadow

Type declaration

Optional blur?: number

Optional color?: Color

Optional offset?: Vector

showDebug

size

smoothing

strokeColor

style

textAlign

tint

transform

unit

Accessors

flipHorizontal

Returns boolean

Parameters

value: boolean

Returns void

flipVertical

Returns boolean

Parameters

value: boolean

Returns void

fontString

Returns string

height

Returns number

Parameters

value: number

Returns void

localBounds

Returns BoundingBox

origin

Returns Vector

Parameters

value: Vector

Returns void

rotation

Returns number

Parameters

value: number

Returns void

scale

Returns Vector

Parameters

value: Vector

Returns void

width

Returns number

Parameters

value: number

Returns void

`Readonly` id

`Optional` blur?: number

`Optional` color?: Color

`Optional` offset?: Vector

`Protected` _drawImage

`Protected` _flip

`Protected` _postDraw

`Protected` _preDraw

`Protected` _rotate

`Optional` maxWidth: number

`Optional` maxWidth: number

`Optional` maxWidth: number