EmptyStone
EmptyStone

Reputation: 315

Phaser Switching to the previous scene

I'm trying to give my game an inventory scene that the player can go to at the press of a button. When they arrive at the scene, they can view their items, and press the same button to return to the previous scene.

I want the inventory scene to be accessible from all the other scenes, and I plan to use the switch method to get back to the previous scene.

this.scene.switch('previousSceneName');

The thing I don't know is how to make sure that the player always goes back to the specific scene they came from. So what do I put in the place of 'previousSceneName' to ensure that the player is always taken back to the right scene and not any other?

If it helps, I'm using Phaser 3 in VSCode employing arcade physics.

Upvotes: 0

Views: 324

Answers (1)

winner_joiner
winner_joiner

Reputation: 14695

The easy solution is just keep a global variable/gamestate, where you save the game scene key before switching to the inventory (or on game scene entering ), and on the way back use that variable.

 // somewhere in the Global-Scope
 var gloabalGameState = {};
 ...

 // in the game-scene (best in the `create` function)
 ...
 gloabalGameState.currentScene = this.scene.key;
 ...

 // in the inventory-scene 
 ...
 this.scene.switch(gloabalGameState.currentScene); 
 ...
 

Short Demo:
switch doesn't restart the scene

document.body.style = 'margin:0;';

var s1starts = 0;
var s2starts = 0;

class Scene1 extends Phaser.Scene {
  constructor(){
      super('S1')
  }
  
  create(){
     
      this.add.text(10,10, 'S1 scenestarts:'+ (++s1starts) )
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});


this.add.text(10, 90, 'Click to change' )
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});
        
        this.input.on('pointerdown', () => 
          this.scene.switch('S2')
        );
  }
}


class Scene2 extends Phaser.Scene {
  constructor(){
      super('S2')
  }
  
  create(){
      this.add.text(10,10, 'S2 scenestarts:' + (++s2starts))
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});
        
        this.add.text(10, 90, 'Click to change' )
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});
        
      this.input.on('pointerdown', () => 
          this.scene.switch('S1')
      );
  }
}

var config = {
    type: Phaser.AUTO,
    width: 536,
    height: 183,
    physics: {
        default: 'arcade',
        arcade: {            
            gravity:{ y: 100 },
            debug: true
        }
    },
    scene: [Scene1, Scene2],
    banner: false
}; 

function create () {
    this.add.text(10,10, 'DEMO TEXT')
        .setScale(1.5)
        .setOrigin(0)
        .setStyle({fontStyle: 'bold', fontFamily: 'Arial'});

    let graphics  = this.make.graphics();
    graphics.fillStyle(0xffffff);
    graphics.fillRect(0, 0, 10, 10);
    graphics.generateTexture('img', 10, 10);
    
    this.physics.add.image(50, 10, 'img');
}

new Phaser.Game(config);
console.clear();
<script src="//cdn.jsdelivr.net/npm/phaser/dist/phaser.min.js"></script>

Upvotes: 0

Related Questions