How to Create Repeating/Tiled Backgrounds in Phaser 3.60

How to Create Repeating/Tiled Backgrounds in Phaser 3.60

Hey Game Dev wizards! Get ready to level up your game design with mesmerizing repeating/tiled backgrounds in Phaser 3.60.

To create repeating / tiled background in Phaser 3.60 we will be using "Phaser.GameObjects.TileSprite". This is an example of how to use TileSprites:

this.background = this.add.tileSprite(posX, posY, width, height, 'textureKey'); 
this.background.setOrigin(0, 0);

Parameters:

  • posX: The horizontal position of the Game Object.

  • posY: The vertical position of the Game Object.

  • width: The width of the Game Object.

  • height: The height of the Game Object.

  • 'textureKey': The key of the Texture to be used for rendering, as stored in the Texture Manager.