Cannot change scene in Phaser 3 after clicking an image

Viewed 577

I am trying to navigate from one scene to another in Phaser 3 by setting up a click event, but there is a problem with calling this.scene.start('entryLevel');, when I click the image I get that:

this.scene.start is not a function

and I can't figure out why, how can I fix this? Here is my code:

class MainMenu extends Phaser.Scene {
    constructor() {
        super('bootGame')
    }

    preload() {
        this.load.image('menuBackground', 'assets/world/menubackground.png');
        this.load.image('play_button', 'assets/world/play_button.png');
        this.load.audio('menu_music', 'assets/music/menu_music.mp3');
    }

    onObjectClicked() {
        this.scene.start('entryLevel');
    }

    create() {
        this.add.image(400, 300, 'menuBackground');
        var playButton = this.add.image(this.game.renderer.width / 2, this.game.renderer.height / 3, 'play_button').setDepth(1);
        playButton.setInteractive();
        this.input.on('gameobjectdown', this.onObjectClicked);

        this.sound.play('menu_music', {
            loop: true
        });
    }
}
1 Answers

I think this can be a scoping issue.

Try if the following works for you:

const self = this;
this.input.on('gameobjectdown', function () {
   self.scene.start('entryLevel');
});

I hope that helps!

Related