Skip to main content

Labels

A Label is text of any length.

The text property is what will be shown. The position property is where the label will be shown.

This demo has a game area that is 200 pixels wide and 400 pixels high. The position coordinate { x: 0, y: 0 } is the upper left, and { x: 200, y: 400 } is the lower right. The position coordinate { x: 100, y: 200 } is the center of the scene. By default, the label will be centered on the position you specify.

For the label to be visible, it must be added to the scene using the scene.addChild() method. Because the scene contains the label, the scene is the parent and the label is the child.

Loading...
Explore:
  • Move the label further down the scene by changing the value of y on the label's position.
  • Add another label.
  • Customize the label's appearance with fontColor, backgroundColor, and fontSize.
  • By default, long labels will wrap to fit the width of the scene. You can change this behavior by setting preferredMaxLayoutWidth.
  • What happens if you forget to add the label to the scene and don't use the scene.addChild() method? Your code will run, but the label will not display.
  • What happens if you omit the position property? The position will default to { x: 0, y: 0 }, and the label will centered on the upper-left corner -- not a good look!