Ourcade
Phaser 3

Official Examples

TypeScript

Resources
Articles
Videos
Templates
Learn Phaser 3 Roadmap
  Courses
Memory Match Extras
BoundsAtZero.ts index.html main.ts
Phaser v3.24.1
  • Phaser 3

  • TypeScript

  • Camera

  • Bounds At Zero

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
import Phaser from 'phaser'
 
export default class BoundsAtZero extends Phaser.Scene
{
    private player!: Phaser.Physics.Arcade.Image
    private text!: Phaser.GameObjects.Text
    private cursors!: Phaser.Types.Input.Keyboard.CursorKeys
 
    preload()
    {
        this.load.image('bg','/assets/pics/uv-grid-diag.png')
        this.load.image('block','/assets/sprites/block.png')
    }
 
    create()
    {
        //  Set the camera and physics bounds to be the size of 4x4 bg images
        this.cameras.main.setBounds(-1024, -1024, 1024 * 2, 1024 * 2)
        this.physics.world.setBounds(-1024, -1024, 1024 * 2, 1024 * 2)
    
        this.add.image(-1024, -1024, 'bg').setOrigin(0)
        this.add.image(0, -1024, 'bg').setOrigin(0)
        this.add.image(-1024, 0, 'bg').setOrigin(0)
        this.add.image(0, 0, 'bg').setOrigin(0)
    
        this.cursors = this.input.keyboard.createCursorKeys()
    
        this.player = this.physics.add.image(0, 0, 'block')
    
        this.player.setCollideWorldBounds(true)
    
        this.cameras.main.startFollow(this.player, true)
Enter to Rename, Shift+Enter to Preview