new RetroFont(game, key, characterWidth, characterHeight, chars, charsPerRow, xSpacing, ySpacing, xOffset, yOffset)
A Retro Font is similar to a BitmapFont, in that it uses a texture to render the text. However unlike a BitmapFont every character in a RetroFont is the same size. This makes it similar to a sprite sheet. You typically find font sheets like this from old 8/16-bit games and demos.
Parameters:
Name | Type | Argument | Default | Description |
---|---|---|---|---|
game |
Phaser.Game | Current game instance. |
||
key |
string | The font set graphic set as stored in the Game.Cache. |
||
characterWidth |
number | The width of each character in the font set. |
||
characterHeight |
number | The height of each character in the font set. |
||
chars |
string | The characters used in the font set, in display order. You can use the TEXT_SET consts for common font set arrangements. |
||
charsPerRow |
number |
<optional> |
The number of characters per row in the font set. If not given charsPerRow will be the image width / characterWidth. |
|
xSpacing |
number |
<optional> |
0 | If the characters in the font set have horizontal spacing between them set the required amount here. |
ySpacing |
number |
<optional> |
0 | If the characters in the font set have vertical spacing between them set the required amount here. |
xOffset |
number |
<optional> |
0 | If the font set doesn't start at the top left of the given image, specify the X coordinate offset here. |
yOffset |
number |
<optional> |
0 | If the font set doesn't start at the top left of the given image, specify the Y coordinate offset here. |
- Source:
Extends
Members
-
<static, constant> ALIGN_CENTER :string
-
Align each line of multi-line text in the center.
Type:
- string
- Source:
-
<static, constant> ALIGN_LEFT :string
-
Align each line of multi-line text to the left.
Type:
- string
- Source:
-
<static, constant> ALIGN_RIGHT :string
-
Align each line of multi-line text to the right.
Type:
- string
- Source:
-
<static, constant> TEXT_SET1 :string
-
Text Set 1 = !"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`abcdefghijklmnopqrstuvwxyz{|}~
Type:
- string
- Source:
-
<static, constant> TEXT_SET2 :string
-
Text Set 2 = !"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ
Type:
- string
- Source:
-
<static, constant> TEXT_SET3 :string
-
Text Set 3 = ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789
Type:
- string
- Source:
-
<static, constant> TEXT_SET4 :string
-
Text Set 4 = ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789
Type:
- string
- Source:
-
<static, constant> TEXT_SET5 :string
-
Text Set 5 = ABCDEFGHIJKLMNOPQRSTUVWXYZ.,/() '!?-*:0123456789
Type:
- string
- Source:
-
<static, constant> TEXT_SET6 :string
-
Text Set 6 = ABCDEFGHIJKLMNOPQRSTUVWXYZ!?:;0123456789"(),-.'
Type:
- string
- Source:
-
<static, constant> TEXT_SET7 :string
-
Text Set 7 = AGMSY+:4BHNTZ!;5CIOU.?06DJPV,(17EKQW")28FLRX-'39
Type:
- string
- Source:
-
<static, constant> TEXT_SET8 :string
-
Text Set 8 = 0123456789 .ABCDEFGHIJKLMNOPQRSTUVWXYZ
Type:
- string
- Source:
-
<static, constant> TEXT_SET9 :string
-
Text Set 9 = ABCDEFGHIJKLMNOPQRSTUVWXYZ()-0123456789.:,'"?!
Type:
- string
- Source:
-
<static, constant> TEXT_SET10 :string
-
Text Set 10 = ABCDEFGHIJKLMNOPQRSTUVWXYZ
Type:
- string
- Source:
-
<static, constant> TEXT_SET11 :string
-
Text Set 11 = ABCDEFGHIJKLMNOPQRSTUVWXYZ.,"-+!?()':;0123456789
Type:
- string
- Source:
-
align
-
- Source:
Properties:
Name Type Description align
string Alignment of the text when multiLine = true or a fixedWidth is set. Set to RetroFont.ALIGN_LEFT (default), RetroFont.ALIGN_RIGHT or RetroFont.ALIGN_CENTER.
-
autoUpperCase
-
- Default Value:
- true
- Source:
Properties:
Name Type Description autoUpperCase
boolean Automatically convert any text to upper case. Lots of old bitmap fonts only contain upper-case characters, so the default is true.
-
characterHeight
-
- Source:
Properties:
Name Type Description characterHeight
number The height of each character in the font set.
-
characterPerRow
-
- Source:
Properties:
Name Type Description characterPerRow
number The number of characters per row in the font set.
-
characterSpacingX
-
- Source:
Properties:
Name Type Description characterSpacingX
number If the characters in the font set have horizontal spacing between them set the required amount here.
-
characterSpacingY
-
- Source:
Properties:
Name Type Description characterSpacingY
number If the characters in the font set have vertical spacing between them set the required amount here.
-
characterWidth
-
- Source:
Properties:
Name Type Description characterWidth
number The width of each character in the font set.
-
customSpacingX
-
- Default Value:
- 0
- Source:
Properties:
Name Type Description customSpacingX
number Adds horizontal spacing between each character of the font, in pixels.
-
customSpacingY
-
- Default Value:
- 0
- Source:
Properties:
Name Type Description customSpacingY
number Adds vertical spacing between each line of multi-line text, set in pixels.
-
fixedWidth
-
If you need this RetroFont image to have a fixed width you can set the width in this value. If text is wider than the width specified it will be cropped off.
- Source:
Properties:
Name Type Description fixedWidth
number -
fontSet
-
- Source:
Properties:
Name Type Description fontSet
HTMLImage A reference to the image stored in the Game.Cache that contains the font.
-
frameData
-
- Source:
Properties:
Name Type Description frameData
Phaser.FrameData The FrameData representing this Retro Font.
-
game
-
- Inherited From:
- Source:
Properties:
Name Type Description game
Phaser.Game A reference to the currently running game.
-
key
-
- Inherited From:
- Source:
Properties:
Name Type Description key
string The key of the RenderTexture in the Cache, if stored there.
-
multiLine
-
- Default Value:
- false
- Source:
Properties:
Name Type Description multiLine
boolean If set to true all carriage-returns in text will form new lines (see align). If false the font will only contain one single line of text (the default)
-
<readonly> offsetX
-
- Source:
Properties:
Name Type Description offsetX
number If the font set doesn't start at the top left of the given image, specify the X coordinate offset here.
-
<readonly> offsetY
-
- Source:
Properties:
Name Type Description offsetY
number If the font set doesn't start at the top left of the given image, specify the Y coordinate offset here.
-
<readonly> stamp
-
- Source:
Properties:
Name Type Description stamp
Phaser.Image The image that is stamped to the RenderTexture for each character in the font.
-
type
-
- Source:
Properties:
Name Type Description type
number Base Phaser object type.
Methods
-
buildRetroFontText()
-
Updates the texture with the new text.
- Source:
-
getLongestLine() → {number}
-
Works out the longest line of text in _text and returns its length
- Source:
Returns:
The length of the longest line of text.
- Type
- number
-
pasteLine(line, x, y, customSpacingX)
-
Internal function that takes a single line of text (2nd parameter) and pastes it into the BitmapData at the given coordinates. Used by getLine and getMultiLine
Parameters:
Name Type Description line
string The single line of text to paste.
x
number The x coordinate.
y
number The y coordinate.
customSpacingX
number Custom X spacing.
- Source:
-
<protected> removeUnsupportedCharacters(stripCR) → {string}
-
Internal helper function that removes all unsupported characters from the _text String, leaving only characters contained in the font set.
Parameters:
Name Type Argument Default Description stripCR
boolean <optional>
true Should it strip carriage returns as well?
- Source:
Returns:
A clean version of the string.
- Type
- string
-
render(displayObject, position, clear)
-
This function will draw the display object to the texture.
Parameters:
Name Type Description displayObject
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapText | Phaser.Group The display object to render to this texture.
position
Phaser.Point A Point object containing the position to render the display object at.
clear
boolean If true the texture will be cleared before the display object is drawn.
- Inherited From:
- Source:
-
renderXY(displayObject, x, y, clear)
-
This function will draw the display object to the texture.
Parameters:
Name Type Description displayObject
Phaser.Sprite | Phaser.Image | Phaser.Text | Phaser.BitmapText | Phaser.Group The display object to render to this texture.
x
number The x position to render the object at.
y
number The y position to render the object at.
clear
boolean If true the texture will be cleared before the display object is drawn.
- Inherited From:
- Source:
-
resize(width, height)
-
Resize this RenderTexture to the given width and height.
Parameters:
Name Type Description width
number The new width of the RenderTexture.
height
number The new height of the RenderTexture.
- Inherited From:
- Source:
-
setFixedWidth(width, lineAlignment)
-
If you need this RetroFont to have a fixed width and custom alignment you can set the width here. If text is wider than the width specified it will be cropped off.
Parameters:
Name Type Argument Default Description width
number Width in pixels of this RetroFont. Set to zero to disable and re-enable automatic resizing.
lineAlignment
string <optional>
'left' Align the text within this width. Set to RetroFont.ALIGN_LEFT (default), RetroFont.ALIGN_RIGHT or RetroFont.ALIGN_CENTER.
- Source:
-
setText(content, multiLine, characterSpacing, lineSpacing, lineAlignment, allowLowerCase)
-
A helper function that quickly sets lots of variables at once, and then updates the text.
Parameters:
Name Type Argument Default Description content
string The text of this sprite.
multiLine
boolean <optional>
false Set to true if you want to support carriage-returns in the text and create a multi-line sprite instead of a single line.
characterSpacing
number <optional>
0 To add horizontal spacing between each character specify the amount in pixels.
lineSpacing
number <optional>
0 To add vertical spacing between each line of text, set the amount in pixels.
lineAlignment
string <optional>
'left' Align each line of multi-line text. Set to RetroFont.ALIGN_LEFT, RetroFont.ALIGN_RIGHT or RetroFont.ALIGN_CENTER.
allowLowerCase
boolean <optional>
false Lots of bitmap font sets only include upper-case characters, if yours needs to support lower case then set this to true.
- Source:
-
updateOffset(xOffset, yOffset)
-
Updates the x and/or y offset that the font is rendered from. This updates all of the texture frames, so be careful how often it is called. Note that the values given for the x and y properties are either ADDED to or SUBTRACTED from (if negative) the existing offsetX/Y values of the characters. So if the current offsetY is 8 and you want it to start rendering from y16 you would call updateOffset(0, 8) to add 8 to the current y offset.
Parameters:
Name Type Argument Default Description xOffset
number <optional>
0 If the font set doesn't start at the top left of the given image, specify the X coordinate offset here.
yOffset
number <optional>
0 If the font set doesn't start at the top left of the given image, specify the Y coordinate offset here.
- Source: