A TextStyle class manages all of the style settings for a Text object.
Text Game Objects create a TextStyle instance automatically, which is
accessed via the Text.style
property. You do not normally need to
instantiate one yourself.
new TextStyle(text, style)
name | type | description |
---|---|---|
text | Phaser.GameObjects.Text |
The Text object that this TextStyle is styling. |
style | Phaser.Types.GameObjects.Text.TextStyle |
The style settings to set. |
The text alignment.
The background color.
The amount of horizontal padding added to the width of the text when calculating the font metrics.
The amount of vertical padding added to the height of the text when calculating the font metrics.
The text fill color.
The fixed height of the text.
0
means no fixed height.
The fixed width of the text.
0
means no fixed with.
The font family.
The font size.
The font style.
The maximum number of lines to draw.
The Text object that this TextStyle is styling.
The resolution the text is rendered to its internal canvas at. The default is 0, which means it will use the resolution set in the Game Config.
Whether the text should render right to left.
The shadow blur radius.
The shadow color.
Whether shadow fill is enabled or not.
The horizontal shadow offset.
The vertical shadow offset.
Whether shadow stroke is enabled or not.
The text stroke color.
The text stroke thickness.
The test string to use when measuring the font.
A custom function that will be responsible for wrapping the text. It will receive two arguments: text (the string to wrap), textObject (this Text instance). It should return the wrapped lines either as an array of lines or as a string with newline characters in place to indicate where breaks should happen. Setting this directly will not re-run the word wrapping algorithm. To change the callback and re-wrap, use Phaser.GameObjects.TextStyle#setWordWrapCallback.
The scope that will be applied when the wordWrapCallback is invoked. Setting this directly will not re-run the word wrapping algorithm. To change the callback and re-wrap, use Phaser.GameObjects.TextStyle#setWordWrapCallback.
Whether or not to use the advanced wrapping algorithm. If true, spaces are collapsed and whitespace is trimmed from lines. If false, spaces and whitespace are left as is. Setting this property directly will not re-run the word wrapping algorithm. To change the advanced setting and re-wrap, use Phaser.GameObjects.TextStyle#setWordWrapWidth.
The maximum width of a line of text in pixels. Null means no line wrapping. Setting this property directly will not re-run the word wrapping algorithm. To change the width and re-wrap, use Phaser.GameObjects.TextStyle#setWordWrapWidth.
Destroy this Text Style.
Get the current text metrics.
The text metrics.
Set the alignment of the text in this Text object.
The argument can be one of: left
, right
, center
or justify
.
Alignment only works if the Text object has more than one line of text.
name | type | arguments | Default | description |
---|---|---|---|---|
align | string | <optional> | 'left' |
The text alignment for multi-line text. |
The parent Text object.
Set the background color.
name | type | description |
---|---|---|
color | string |
The background color. |
The parent Text object.
Set the text fill color.
name | type | description |
---|---|---|
color | string | CanvasGradient | CanvasPattern |
The text fill color. |
The parent Text object.
Set the text fill color.
name | type | description |
---|---|---|
color | string | CanvasGradient | CanvasPattern |
The text fill color. |
The parent Text object.
Set a fixed width and height for the text.
Pass in 0
for either of these parameters to disable fixed width or height respectively.
name | type | description |
---|---|---|
width | number |
The fixed width to set. |
height | number |
The fixed height to set. |
The parent Text object.
Set the font.
If a string is given, the font family is set.
If an object is given, the fontFamily
, fontSize
and fontStyle
properties of that object are set.
name | type | arguments | Default | description |
---|---|---|---|---|
font | string | object |
The font family or font settings to set. |
||
updateText | boolean | <optional> | true |
Whether to update the text immediately. |
The parent Text object.
Set the font family.
name | type | description |
---|---|---|
family | string |
The font family. |
The parent Text object.
Set the font size. Can be a string with a valid CSS unit, i.e. 16px
, or a number.
name | type | description |
---|---|---|
size | number | string |
The font size. |
The parent Text object.
Set the font style.
name | type | description |
---|---|---|
style | string |
The font style. |
The parent Text object.
Set the maximum number of lines to draw.
name | type | arguments | description |
---|---|---|---|
max | number | <optional> |
The maximum number of lines to draw. |
The parent Text object.
Set the resolution used by the Text object.
It allows for much clearer text on High DPI devices, at the cost of memory because it uses larger internal Canvas textures for the Text.
Please use with caution, as the more high res Text you have, the more memory it uses up.
name | type | description |
---|---|---|
value | number |
The resolution for this Text object to use. |
The parent Text object.
Set the shadow settings.
Calling this method always re-measures the parent Text object, so only call it when you actually change the shadow settings.
name | type | arguments | Default | description |
---|---|---|---|---|
x | number | <optional> | 0 |
The horizontal shadow offset. |
y | number | <optional> | 0 |
The vertical shadow offset. |
color | string | <optional> | '#000' |
The shadow color. |
blur | number | <optional> | 0 |
The shadow blur radius. |
shadowStroke | boolean | <optional> | false |
Whether to stroke the shadow. |
shadowFill | boolean | <optional> | true |
Whether to fill the shadow. |
The parent Text object.
Set the shadow blur radius.
name | type | arguments | description |
---|---|---|---|
blur | number | <optional> |
The shadow blur radius. |
The parent Text object.
Set the shadow color.
name | type | arguments | Default | description |
---|---|---|---|---|
color | string | <optional> | '#000' |
The shadow color. |
The parent Text object.
Enable or disable shadow fill.
name | type | description |
---|---|---|
enabled | boolean |
Whether shadow fill is enabled or not. |
The parent Text object.
Set the shadow offset.
name | type | arguments | description |
---|---|---|---|
x | number | <optional> |
The horizontal shadow offset. |
y | number | <optional> |
The vertical shadow offset. |
The parent Text object.
Enable or disable shadow stroke.
name | type | description |
---|---|---|
enabled | boolean |
Whether shadow stroke is enabled or not. |
The parent Text object.
Set the stroke settings.
name | type | description |
---|---|---|
color | string | CanvasGradient | CanvasPattern |
The stroke color. |
thickness | number |
The stroke thickness. |
The parent Text object.
Set the text style.
name | type | arguments | Default | description |
---|---|---|---|---|
style | Phaser.Types.GameObjects.Text.TextStyle |
The style settings to set. |
||
updateText | boolean | <optional> | true |
Whether to update the text immediately. |
setDefaults | boolean | <optional> | false |
Use the default values if not set, or the local values. |
The parent Text object.
text.setStyle({
fontSize: '64px',
fontFamily: 'Arial',
color: '#ffffff',
align: 'center',
backgroundColor: '#ff00ff'
});
Set the test string to use when measuring the font.
name | type | description |
---|---|---|
string | string |
The test string to use when measuring the font. |
The parent Text object.
Set a custom callback for wrapping lines.
Pass in null to remove wrapping by callback.
name | type | arguments | Default | description |
---|---|---|---|---|
callback | TextStyleWordWrapCallback |
A custom function that will be responsible for wrapping the text. It will receive two arguments: text (the string to wrap), textObject (this Text instance). It should return the wrapped lines either as an array of lines or as a string with newline characters in place to indicate where breaks should happen. |
||
scope | object | <optional> | null |
The scope that will be applied when the callback is invoked. |
The parent Text object.
Set the width (in pixels) to use for wrapping lines.
Pass in null to remove wrapping by width.
name | type | arguments | Default | description |
---|---|---|---|---|
width | number | null |
The maximum width of a line in pixels. Set to null to remove wrapping. |
||
useAdvancedWrap | boolean | <optional> | false |
Whether or not to use the advanced wrapping algorithm. If true, spaces are collapsed and whitespace is trimmed from lines. If false, spaces and whitespace are left as is. |
The parent Text object.
Synchronize the font settings to the given Canvas Rendering Context.
name | type | description |
---|---|---|
canvas | HTMLCanvasElement |
The Canvas Element. |
context | CanvasRenderingContext2D |
The Canvas Rendering Context. |
Synchronize the shadow settings to the given Canvas Rendering Context.
name | type | description |
---|---|---|
context | CanvasRenderingContext2D |
The Canvas Rendering Context. |
enabled | boolean |
Whether shadows are enabled or not. |
Synchronize the text style settings to the given Canvas Rendering Context.
name | type | description |
---|---|---|
canvas | HTMLCanvasElement |
The Canvas Element. |
context | CanvasRenderingContext2D |
The Canvas Rendering Context. |
Build a JSON representation of this Text Style.
A JSON representation of this Text Style.
Update the style settings for the parent Text object.
name | type | description |
---|---|---|
recalculateMetrics | boolean |
Whether to recalculate font and text metrics. |
The parent Text object.