Create Container
Demonstrates how to group multiple images into a Container and apply transforms, such as rotation, to the entire group at once.
800 × 600
class Example extends Phaser.Scene
{
preload ()
{
this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
this.load.image('lemming', 'assets/sprites/lemming.png');
}
create ()
{
// Create some images
// Positions are relative to the Container x/y
const image0 = this.add.image(0, 0, 'lemming');
const image1 = this.add.image(-100, -100, 'lemming');
const image2 = this.add.image(100, -100, 'lemming');
const image3 = this.add.image(100, 100, 'lemming');
const image4 = this.add.image(-100, 100, 'lemming');
const container = this.add.container(400, 300, [ image0, image1, image2, image3, image4 ]);
this.tweens.add({
targets: container,
angle: 360,
duration: 6000,
yoyo: true,
repeat: -1
});
}
}
const config = {
scale: { mode: Phaser.Scale.FIT },
type: Phaser.CANVAS,
width: 800,
height: 600,
backgroundColor: '#010101',
parent: 'game-container',
scene: Example
};
const game = new Phaser.Game(config);