Implement multiple levels

Phaser 3
1

For my game I want multiple levels using the same tileset, but different layouts (defined using tiled).

What is the best way to organise my game code to achieve this?

Right now I’m trying a weird approach where I add the player and particles in the ‘gameScene’ class and the level specific stuff in the ‘levelOne’ scene class and running them in parralel, but it’s pretty confusing.

Should I just make each level it’s complete own scene, even if it means repeating the preloading of images and defining physics groups (for tiled objects)?

I already have the player movement and controls in a seperate class, which definetly is a good first step.

TLDR: Just need some guidance on how to start organising my code for a level-based game using scenes and classes. Thanks!

2

Hi,
You can make a PreloadScene so you just preloads your assets once.
You can make a scene per level, lot of people do it this way.
I personnaly don’t create a scene per level, i just destroy the map and the enemies, load a new one and reset the player’s position. My tiled maps contains objects layers with enemies position and doors that contains the next map with the next player position.

1 Like
3

Thanks for your help @BlunT76!

I’ve tried to implement this method where the game can load the tilemap via a loadLevel() function, which works when the level is first made.

loadLevel(key){
    
    this.level = this.make.tilemap({key: key});

    this.tileset = this.level.addTilesetImage("tileset", "tiles")
    this.platforms = this.level.createStaticLayer("platforms", this.tileset)}. . . . .

And then when the player switches to a new level (currently by pressing ‘H’ for testing), I tried to destroy the previous level before calling the loadLevel() function.

This is in the update function.

if (Phaser.Input.Keyboard.JustDown(this.keyH)) {
      this.level.removeAllLayers()
      this.loadLevel(this.key)
  }

However, when I try and load the new level, I get the error “layerData is undefined”.

I also tried to use “this.level.destroy()” but got the same error.

Anyone have any idea where I’ve gone wrong?

4

Here’s what i do when changing the level, perhaps your problem comes from calling it in the update method, and don’t forget to preload all yours levels

loadLevel(key){
  this.physics.world.colliders.destroy();
  this.level.destroy();
  this.level = this.make.tilemap({ key:key, tileWidth: 16, tileHeight: 16 });
  this.tileset = this.level.addTilesetImage(scene.map.tilesets[0].name, 'tiles', 16, 16); // only needed if you change the tileset
  this.platforms = this.level.createStaticLayer("platforms", this.tileset, 0, 0);
and recreate the colliders
}
1 Like