Skip to main content

Pixi Text

This node displays text using system fonts or loaded web fonts in the Pixi scene.

The Pixi Text renders text with various styling options in your Pixi scene.

The Pixi Text node creates a PIXI.Text object that displays text with customizable styling. It supports system fonts, web fonts, and various text formatting options for creating rich text content in your Pixi scene.

Inputs

Position

DataDescription
XHorizontal position
YVertical position

Transform

DataDescription
RotationRotation in radians
Scale XHorizontal scale
Scale YVertical scale
Pivot XHorizontal pivot
Pivot YVertical pivot
Anchor XHorizontal anchor
Anchor YVertical anchor

Appearance

DataDescription
AlphaTransparency
TintColor tint
VisibleVisibility
InteractiveInteraction enable

Text

DataDescription
Text ContentThe text string to display

Text Style

DataDescription
Font FamilyFont family name
Font SizeFont size in pixels
Fill ColorText fill color
AlignText alignment (left, center, right)
Font WeightFont weight
Font StyleFont style (normal, italic)
Letter SpacingCharacter spacing

Stroke

DataDescription
Stroke ColorStroke color
Stroke ThicknessStroke width

Layout

DataDescription
Word WrapEnable word wrapping
Wrap WidthMaximum width for wrapping
Line HeightLine spacing

Drop Shadow

DataDescription
Enable Drop ShadowShadow toggle
Shadow ColorShadow color
Shadow BlurShadow blur amount
Shadow AngleShadow angle in radians
Shadow DistanceShadow offset distance

Animation

DataDescription
Ticker EnabledAnimation ticker
Ticker SpeedAnimation speed
Animation TypeAnimation type
Custom Animation CodeCustom animation code

Outputs

SignalDescription
Pointer DownTriggered when pointer is pressed down
Pointer UpTriggered when pointer is released
Pointer TapTriggered when pointer taps the text
Pointer EnterTriggered when pointer enters the text
Pointer LeaveTriggered when pointer leaves the text
Pointer MoveTriggered when pointer moves over the text
DataDescription
Node ReferenceNode reference

Usage

Pixi Text nodes are used to display text content in your Pixi scene. They support:

  • System fonts and web fonts
  • Rich text styling (color, size, weight, style)
  • Text alignment and wrapping
  • Stroke and drop shadow effects
  • Interactive events
  • Animation capabilities

Font Loading

For web fonts, ensure they are loaded before creating the text node. You can use the Asset Preloader node to preload font files.

Performance Tips

  • Use system fonts when possible for better performance
  • Limit the number of different font families used
  • Consider using BitmapText for large amounts of text
  • Enable Word Wrap for dynamic text content
  • Use appropriate Font Size for your display needs

Example Use Cases

  1. UI Labels: Button text, form labels, and interface text
  2. Game Text: Score displays, player names, and game messages
  3. Dynamic Content: User-generated text and real-time updates
  4. Decorative Text: Titles, headings, and artistic text elements