API Docs for: 1.6.0
Show:

Text Class

Extends Sprite
Defined in: src/pixi/text/Text.js:6
Module: PIXI

A Text Object will create a line(s) of text. To split a line you can use '\n' or add a wordWrap property set to true and and wordWrapWidth property with a value in the style object

Constructor

Text

(
  • text
  • [style]
)

Defined in src/pixi/text/Text.js:6

Parameters:

  • text String

    The copy that you would like the text to display

  • [style] Object optional

    The style parameters

    • [font] String optional

      default 'bold 20px Arial' The style and size of the font

    • [fill='black'] String | Number optional

      A canvas fillstyle that will be used on the text e.g 'red', '#00FF00'

    • [align='left'] String optional

      Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text

    • [stroke] String | Number optional

      A canvas fillstyle that will be used on the text stroke e.g 'blue', '#FCFF00'

    • [strokeThickness=0] Number optional

      A number that represents the thickness of the stroke. Default is 0 (no stroke)

    • [wordWrap=false] Boolean optional

      Indicates if word wrap should be used

    • [wordWrapWidth=100] Number optional

      The width at which text will wrap, it needs wordWrap to be set to true

    • [dropShadow=false] Boolean optional

      Set a drop shadow for the text

    • [dropShadowColor='#000000'] String optional

      A fill style to be used on the dropshadow e.g 'red', '#00FF00'

    • [dropShadowAngle=Math.PI/4] Number optional

      Set a angle of the drop shadow

    • [dropShadowDistance=5] Number optional

      Set a distance of the drop shadow

Methods

_renderCanvas

(
  • renderSession
)
private

Inherited from DisplayObject but overwritten in src/pixi/display/Sprite.js:311

Renders the object using the Canvas renderer

Parameters:

  • renderSession RenderSession

_renderWebGL

(
  • renderSession
)
private

Inherited from DisplayObject but overwritten in src/pixi/text/Text.js:244

Renders the object using the WebGL renderer

Parameters:

  • renderSession RenderSession

addChild

(
  • child
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:69

Adds a child to the container.

Parameters:

addChildAt

(
  • child
  • index
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:80

Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown

Parameters:

  • child DisplayObject

    The child to add

  • index Number

    The index to place the child in

click

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:207

A callback that is used when the users clicks on the displayObject with their mouse

Parameters:

destroy

(
  • destroyBaseTexture
)

Defined in src/pixi/text/Text.js:360

Destroys this text object

Parameters:

  • destroyBaseTexture Boolean

    whether to destroy the base texture as well

getBounds

(
  • matrix
)
Rectangle

Inherited from DisplayObject but overwritten in src/pixi/display/Sprite.js:166

Returns the framing rectangle of the sprite as a PIXI.Rectangle object

Parameters:

  • matrix Matrix

    the transformation matrix of the sprite

Returns:

Rectangle:

the framing rectangle

getChildAt

(
  • index
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:136

Returns the child at the specified index

Parameters:

  • index Number

    The index to get the child from

getLocalBounds

() Rectangle

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:473

Retrieves the local bounds of the displayObject as a rectangle object

Returns:

Rectangle:

the rectangular bounding area

mousedown

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:213

A callback that is used when the user clicks the mouse down over the sprite

Parameters:

mouseout

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:239

A callback that is used when the users mouse leaves the displayObject

Parameters:

mouseover

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:233

A callback that is used when the users mouse rolls over the displayObject

Parameters:

mouseup

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:219

A callback that is used when the user releases the mouse that was over the displayObject for this callback to be fired the mouse must have been pressed down over the displayObject

Parameters:

mouseupoutside

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:226

A callback that is used when the user releases the mouse that was over the displayObject but is no longer over the displayObject for this callback to be fired, The touch must have started over the displayObject

Parameters:

onTextureUpdate

(
  • event
)
private

Inherited from Sprite: src/pixi/display/Sprite.js:149

When the texture is updated, this event will fire to update the scale and frame

Parameters:

  • event Object

removeChild

(
  • child
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:154

Removes a child from the container.

Parameters:

removeChildAt

(
  • index
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:165

Removes a child from the specified index position in the child list of the container.

Parameters:

  • index Number

    The index to get the child from

removeChildren

(
  • beginIndex
  • endIndex
)

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:182

Removes all child instances from the child list of the container.

Parameters:

  • beginIndex Number

    The beginning position. Predefined value is 0.

  • endIndex Number

    The ending position. Predefined value is children's array length.

removeStageReference

()

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:337

removes the current stage reference of the container

setInteractive

(
  • interactive
)
deprecated

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:280

Deprecated: Simply set the `interactive` property directly

[Deprecated] Indicates if the sprite will have touch and mouse interactivity. It is false by default Instead of using this function you can now simply set the interactive property to true or false

Parameters:

  • interactive Boolean

setStageReference

(
  • stage
)

Inherited from DisplayObject but overwritten in src/pixi/display/DisplayObjectContainer.js:319

Sets the container's stage reference, the stage this object is connected to

Parameters:

  • stage Stage

    the stage that the container will have as its current stage reference

setStyle

(
  • [style]
  • [style.font='bold
)

Defined in src/pixi/text/Text.js:58

Set the style of the text

Parameters:

  • [style] Object optional

    The style parameters

    • [fill='black'] Object optional

      A canvas fillstyle that will be used on the text eg 'red', '#00FF00'

    • [align='left'] String optional

      Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text

    • [stroke='black'] String optional

      A canvas fillstyle that will be used on the text stroke eg 'blue', '#FCFF00'

    • [strokeThickness=0] Number optional

      A number that represents the thickness of the stroke. Default is 0 (no stroke)

    • [wordWrap=false] Boolean optional

      Indicates if word wrap should be used

    • [wordWrapWidth=100] Number optional

      The width at which text will wrap

    • [dropShadow=false] Boolean optional

      Set a drop shadow for the text

    • [dropShadowColor='#000000'] String optional

      A fill style to be used on the dropshadow e.g 'red', '#00FF00'

    • [dropShadowAngle=Math.PI/4] Number optional

      Set a angle of the drop shadow

    • [dropShadowDistance=5] Number optional

      Set a distance of the drop shadow

  • [style.font='bold String

    20pt Arial'] The style and size of the font

setText

(
  • text
)

Defined in src/pixi/text/Text.js:96

Set the copy for the text object. To split a line you can use '\n'

Parameters:

  • text String

    The copy that you would like the text to display

setTexture

(
  • texture
)

Inherited from Sprite: src/pixi/display/Sprite.js:127

Sets the texture of the sprite

Parameters:

  • texture Texture

    The PIXI texture that is displayed by the sprite

swapChildren

(
  • child
  • child2
)
private

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:110

[NYI] Swaps the depth of 2 displayObjects

Parameters:

tap

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:250

A callback that is used when the users taps on the sprite with their finger basically a touch version of click

Parameters:

touchend

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:263

A callback that is used when the user releases a touch over the displayObject

Parameters:

touchendoutside

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:269

A callback that is used when the user releases the touch that was over the displayObject for this callback to be fired, The touch must have started over the sprite

Parameters:

touchstart

(
  • interactionData
)

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:257

A callback that is used when the user touches over the displayObject

Parameters:

updateText

() private

Defined in src/pixi/text/Text.js:109

Renders text and updates it when needed

updateTexture

() private

Defined in src/pixi/text/Text.js:225

Updates texture size based on canvas size

updateTransform

() private

Defined in src/pixi/text/Text.js:262

Updates the transform of this object

wordWrap

(
  • text
)
private

Defined in src/pixi/text/Text.js:312

Applies newlines to a string to have it optimally fit into the horizontal bounds set by the Text object's wordWrapWidth property.

Parameters:

  • text String

Properties

_bounds

Rectangle private

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:174

The original, cached bounds of the object

_currentBounds

Rectangle private

Inherited from DisplayObject but overwritten in src/pixi/display/DisplayObject.js:182

The most up-to-date bounds of the object

_height

Number private

Inherited from Sprite: src/pixi/display/Sprite.js:50

The height of the sprite (this is initially set by the texture)

_interactive

Boolean private

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:114

[read-only] Whether or not the object is interactive, do not toggle directly! use the interactive property

_width

Number private

Inherited from Sprite: src/pixi/display/Sprite.js:41

The width of the sprite (this is initially set by the texture)

alpha

Number

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:46

The opacity of the object.

anchor

Point

Inherited from Sprite: src/pixi/display/Sprite.js:22

The anchor sets the origin point of the texture. The default is 0,0 this means the texture's origin is the top left Setting than anchor to 0.5,0.5 means the textures origin is centred Setting the anchor to 1,1 would mean the textures origin points will be the bottom right corner

blendMode

Number

Inherited from Sprite: src/pixi/display/Sprite.js:69

The blend mode to be applied to the sprite

Default: PIXI.blendModes.NORMAL;

buttonMode

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:71

This is used to indicate if the displayObject should display a mouse hand cursor on rollover

cacheAsBitmap

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:388

Set weather or not a the display objects is cached as a bitmap. This basically takes a snap shot of the display object as it is at that moment. It can provide a performance benefit for complex static displayObjects To remove filters simply set this property to 'null'

canvas

HTMLCanvasElement

Defined in src/pixi/text/Text.js:30

The canvas element that everything is drawn to

children

Array

Inherited from DisplayObjectContainer: src/pixi/display/DisplayObjectContainer.js:18

[read-only] The array of children of this container.

color

Array<> private

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:143

[NYI] Unknown

context

HTMLCanvasElement 2d Context

Defined in src/pixi/text/Text.js:38

The canvas 2d context that everything is drawn with

defaultCursor

String

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:124

This is the cursor that will be used when the mouse is over this object. To enable this the element must have interaction = true and buttonMode = true

dynamic

Boolean private

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:152

[NYI] Holds whether or not this object is dynamic, for rendering optimization

filterArea

Rectangle

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:165

The area the filter is applied to like the hitArea this is used as more of an optimisation rather than figuring out the dimensions of the displayObject each frame you can set this rectangle

filters

Array An array of filters

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:354

Sets the filters for the displayObject.

  • IMPORTANT: This is a webGL only feature and will be ignored by the canvas renderer. To remove filters simply set this property to 'null'

height

Number

Inherited from DisplayObjectContainer but overwritten in src/pixi/display/Sprite.js:111

The height of the sprite, setting this will actually modify the scale to achieve the value set

hitArea

Rectangle | Circle | Ellipse | Polygon

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:62

This is the defined area that will pick up mouse / touch events. It is null by default. Setting it is a neat way of optimising the hitTest function that the interactionManager will use (as it will not need to hit test all the children)

interactive

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:293

Indicates if the sprite will have touch and mouse interactivity. It is false by default

Default: false

mask

Graphics

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:334

Sets a mask for the displayObject. A mask is an object that limits the visibility of an object to the shape of the mask applied to it. In PIXI a regular mask must be a PIXI.Graphics object. This allows for much faster masking in canvas as it utilises shape clipping. To remove a mask, set this property to null.

parent

DisplayObjectContainer

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:87

[read-only] The display object container that contains this display object.

pivot

Point

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:30

The pivot point of the displayObject that it rotates around

position

Point

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:14

The coordinate of the object relative to the local coordinates of the parent.

renderable

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:79

Can this object be rendered

rotation

Number

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:38

The rotation of the object in radians.

scale

Point

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:22

The scale factor of the object.

stage

Stage

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:96

[read-only] The stage the display object is connected to, or undefined if it is not connected to the stage.

texture

Texture

Inherited from Sprite: src/pixi/display/Sprite.js:33

The texture that the sprite is using

tint

Number

Inherited from Sprite: src/pixi/display/Sprite.js:60

The tint applied to the sprite. This is a hex value

Default: 0xFFFFFF

visible

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:54

The visibility of the object.

width

Number

Inherited from DisplayObjectContainer but overwritten in src/pixi/display/Sprite.js:95

The width of the sprite, setting this will actually modify the scale to achieve the value set

worldAlpha

Number

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:105

[read-only] The multiplied alpha of the displayObject

worldTransform

Mat3 private

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:133

[read-only] Current transform of the object based on world (parent) factors

worldVisible

Boolean

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:313

[read-only] Indicates if the sprite is globaly visible.

x

Number

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:599

The position of the displayObject on the x axis relative to the local coordinates of the parent.

y

Number

Inherited from DisplayObject: src/pixi/display/DisplayObject.js:614

The position of the displayObject on the y axis relative to the local coordinates of the parent.