Skip to content

Phaser: GameObjects

This post is part of a Phaser series. Click here to see the first post of the series.

Inside the create function we can add GameObjects to the game.

For example we can draw shapes, like a circle:

function create() {
  const circle =, 100, 90, 0xffffff)

This adds a white circle at position (100, 100), with a diameter of 90. Those numbers are expressed in pixels.

The circle variable contains a reference to the newly added circle.

this in the context of the function refers to the scene object.

Another example is this.add.text(), which adds text to the game:

const text = this.add.text(130, 100, 'test')

You can customize how text looks, by passing a set of options:

const text = this.add.text(50, 100, 'Test', {
  font: '20px Arial',
  fill: '#FFFFFF'

Any GameObject as a set of properties. For example we can access the x and y axis positions, in the 2D space, using text.x and text.y.



You might be interested in those things I do:

  • Learn to code in THE VALLEY OF CODE, your your web development manual
  • Find a ton of Web Development projects to learn modern tech stacks in practice in THE VALLEY OF CODE PRO
  • I wrote 16 books for beginner software developers, DOWNLOAD THEM NOW
  • Every year I organize a hands-on cohort course coding BOOTCAMP to teach you how to build a complex, modern Web Application in practice (next edition February-March-April-May 2024)
  • Learn how to start a solopreneur business on the Internet with SOLO LAB (next edition in 2024)
  • Find me on X

Related posts that talk about phaser: