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 = this.add.circle(100, 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
.
→ I wrote 17 books to help you become a better developer, download them all at $0 cost by joining my newsletter
→ JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025