d.mora.olazul Posted September 27, 2018 Share Posted September 27, 2018 (edited) Hello, I am new in phaser and I am building a little game like Super Mario Bros, I have the move, controllers and more. I load a JSON tilemap, made with the Tiled software, the map has a specific width, I need to use a larger map. How can load a more large tilemap or well update the current tilemap when the player advances a specific distance so that it seems to be a very long map? I found examples that to use Infinitely Scrolling, but in my case, I need to use a specific map. Thank you very much. This is my code class MainScene extends Phaser.Scene { constructor() { super({key: 'MainScene'}); this.map; this.player; this.cursors; this.groundlayer; this.text; } preload() { this.load.tilemapTiledJSON('map', '/assets/jsons/map.json'); this.load.spritesheet('tiles', 'assets/img/tiles.png', { frameWidth: 70, frameHeight: 70 }); this.load.image('coin', 'assets/img/coinGold.png'); this.load.atlas('player', 'assets/img/player.png', 'assets/jsons/player.json'); } create() { this.map = this.make.tilemap({key: 'map'}); // tiles for the ground layer var groundTiles = this.map.addTilesetImage('tiles'); // create the ground layer this.groundLayer = this.map.createDynamicLayer('World', groundTiles, 0, 0); // the player will collide with this layer this.groundLayer.setCollisionByExclusion([-1]); // set the boundaries of our game world this.physics.world.bounds.width = this.groundLayer.width; this.physics.world.bounds.height = this.groundLayer.height; // create the player sprite this.player = this.physics.add.sprite(200, 200, 'player'); this.player.setScale(0.5, 0.5); this.player.body.setGravityY(250); this.player.setBounce(0.2); // our player will bounce from items this.player.setCollideWorldBounds(true); // don't go out of the map this.physics.add.collider(this.groundLayer, this.player); this.camera(); } camera() { // set bounds so the camera won't go outside the game world this.cameras.main.setBounds(0, 0, this.map.widthInPixels, this.map.heightInPixels); // make the camera follow the player this.cameras.main.startFollow(this.player); // set background color, so the sky is not black this.cameras.main.setBackgroundColor('#ccccff'); } controllers() { var cursors = this.input.keyboard.createCursorKeys(); if (cursors.left.isDown) { // if the left arrow key is down this.player.body.setVelocityX(-200); // move left } else if (cursors.right.isDown) { // if the right arrow key is down this.player.body.setVelocityX(200); // move right } else { this.player.setVelocityX(0); } if ((cursors.space.isDown || cursors.up.isDown) && this.player.body.onFloor()) { this.player.body.setVelocityY(-500); // jump up } } update(time, delta) { // this.controllers(); } } assets.zip Edited September 27, 2018 by d.mora.olazul update Link to comment Share on other sites More sharing options...
Recommended Posts