The Tile Sprite is a built-in Phaser object type: Phaser.GameObjects.TileSprite. This type allows creating objects with repeating textures, like background elements.
A Tile Sprite is created in code using the tileSprite factory. This is how the scene compiler generates the code of a Tile Sprite:
// x = 0, y = 600, width = 600, height = 800, texture = "rocks_1"
const rocks = this.add.tileSprite(0, 600, 800, 225, "rocks_1");
To create a Tile Sprite object in the scene, you can drop a TileSprite built-in block on the scene.
Or convert an Image or Sprite into a Tile Sprite.
Tile Sprite properties
The Tile Sprite type shares properties with other object types:
- Variable properties
- Lists properties
- Transform properties
- Origin properties
- Size properties
- Flip properties
- Visible property
- Alpha properties
- Texture property
But also it has particular properties:
- The width and height size properties. If the size of the object is bigger than the original texture, then the object is rendered repeating the texture. You can change these properties in the Inspector view or using the Resize manipulator tool: press the
Zkey or select Tools → Resize Tool in the context menu. - The tilePositionX and tilePositionY properties. It changes the offset of the original texture rendering. You can modify it in the Inspector view.
- The tileScaleX and tileScaleY properties. It changes the scale of the original texture rendering (not the scale of the object). You can modify it in the Inspector view.