Hysteria Posted May 13, 2018 Share Posted May 13, 2018 Hi there fellow coders! I'm in the making of a new game and I've run into some issues while trying to implement multiple scenes. When I run the following code I get the error " TypeError: this.scene.start is not a function ". var SceneMainMenu = new Phaser.Class({ Extends: Phaser.Scene, initialize: function SceneMainMenu () { Phaser.Scene.call(this, { key: 'sceneMainMenu' }); }, preload: function () { this.load.image('imgButtonStartNormal', 'img/button-start-normal.png'); this.load.image('imgButtonStartHover', 'img/button-start-hover.png'); this.load.image('imgButtonStartClicked', 'img/button-start-clicked.png'); }, create: function () { this.add.text(75, 170, 'Coffee Island', { fontSize: '100px', color: '#0000FF' }); // Start Button btnStart = this.add.sprite(790, 160, 'imgButtonStartNormal').setInteractive(); btnStart.setDisplaySize(32,32); btnStart.on('pointerover', function (event) { btnStart.setTexture('imgButtonStartHover');/* Do something when the mouse enters */ }); btnStart.on('pointerout', function (event) { btnStart.setTexture('imgButtonStartNormal');/* Do something when the mouse exits. */ }); btnStart.on('pointerdown', function(event){ btnStart.setTexture('imgButtonStartClicked'); this.scene.start(SceneMainGame);}); // Start the main game. } }); I believe the cause is that "this" in this context is a reference to the sprite, not the actual scene, but I''ve also tried to do something like "SceneMainMenu.scene.start(SceneMainGame); and it doesn't work either. Any sort of help will be appreciated. Thanks!~ Link to comment Share on other sites More sharing options...
samme Posted May 13, 2018 Share Posted May 13, 2018 btnStart.on('pointerdown', function (event) { // ... this.scene.start(SceneMainGame); }, this); Link to comment Share on other sites More sharing options...
Hysteria Posted May 13, 2018 Author Share Posted May 13, 2018 Thanks for the quick answer samme! Now the scene actually changes, but the preload function for the new scene doesn't seem to be loading, and I'm stuck with a black screen. var SceneMainGame = new Phaser.Class({ Extends: Phaser.Scene, initialize: function sceneMainGame () { Phaser.Scene.call(this, { key: 'sceneMainGame' }); }, preload: function () { // ... console.log("This is never displayed!"); this.load.image('imgBackground', 'img/background.png'); // ... }, create: function () { // ... console.log("This is never displayed either!"); this.add.image(480, 320, 'imgBackground'); // ... } }); Edit 1: I forgot to had that the console doesn't display any error messages. Edit 2: I've tried to change the order of the scenes and the MainGame scene loads just fine, which indicates that the error source it's something to do with the scene transition. Link to comment Share on other sites More sharing options...
Hysteria Posted May 14, 2018 Author Share Posted May 14, 2018 I still have no idea why the black screen keeps on showing and the second scene doesn't load properly. Any help would be appreciated. ? Link to comment Share on other sites More sharing options...
rich Posted May 15, 2018 Share Posted May 15, 2018 Use the Scene key to swap to it: this.scene.start('sceneMainGame'); and make sure that your main game Scene has been added to your list of Scenes in your game config. Link to comment Share on other sites More sharing options...
Hysteria Posted May 15, 2018 Author Share Posted May 15, 2018 Thanks rich, that did the trick! The issue was that I thought the parameter "this.scene.start();" needed was the Phaser.Scene class, but it was the key for the Phaser.Scene class. Everything works like a charm now ~ Link to comment Share on other sites More sharing options...
Recommended Posts