Scene From Object

Demonstrates how to define a Scene using a standard JavaScript object within the Game Configuration, mapping lifecycle functions like preload and create.

800 × 600

GitHub

function preload ()
{
        this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
    this.load.image('face', 'assets/pics/bw-face.png');
}

function create ()
{
    this.add.image(400, 300, 'face');
}

const config = {
    scale: { mode: Phaser.Scale.FIT },
    type: Phaser.CANVAS,
    parent: 'game-container',
    width: 800,
    height: 600,
    scene: {
        preload: preload,
        create: create
    }
};

const game = new Phaser.Game(config);

More in Scenes52 examples

Scene Injection MapDemonstrates how to remap standard Scene systems like 'add' and 'load' to custom property names using the scene configuration map.

Scene Injection Map with UTF-8Demonstrates how to use the Scene injection map to alias standard Scene systems, such as 'add' and 'load', to custom UTF-8 property names.

Scene Layering and ManagementThis example demonstrates how to manage multiple active scenes simultaneously. It shows how to toggle scene visibility and active states, and how to manipulate rendering order using bringToTop, moveUp, and moveDown.

Scene Transition BasicsLearn how to use scene transitions to move between Scenes. This example demonstrates passing data, using transition update callbacks for custom animations, and handling transition events.