Auto-scrolling Level Using a Tilemap?

[bobonthenet]

I'm really stuck on how to create a level that automatically scrolls using a tilemap.  I've copied what I believe to be the relevant code.  The camera moves the way I want to and scrolls through the level but the player (rex) hits the end of the world before the map is complete and can't move any farther. Also the starfield is only created to the size of the screen and gets moved off to the left with the map. I don't want that. Any thoughts on what I need to do differently? It seems to me that this.layer.resizeWorld(); isn't doing it's thing, but I don't know.

create: function() {
  this.starfield = this.game.add.tileSprite(0, 0, 800, 600, 'starfield');
  //Rex
  this.rex = new DinosaursInSpace.Rex(this.game, 50, 500);
  this.game.add.existing(this.rex);
},  
update: function() {
  this.starfield.tilePosition.x -= this.SCROLL_SPEED;
  this.game.camera.x += this.SCROLL_SPEED;
},  
loadLevel: function() {
  this.map = this.game.add.tilemap('level1');
  this.map.addTilesetImage('ground_1x1');
  this.map.setCollisionBetween(1, 12);
  this.layer = this.map.createLayer('Tile Layer 1');
  this.layer.resizeWorld();
  this.game.physics.startSystem(Phaser.Physics.ARCADE);
}

 

[alessa]

On 9/3/2016 at 4:24 PM, bobonthenet said:

I'm really stuck on how to create a level that automatically scrolls using a tilemap.  I've copied what I believe to be the relevant code.  The camera moves the way I want to and scrolls through the level but the player (rex) hits the end of the world before the map is complete and can't move any farther. Also the starfield is only created to the size of the screen and gets moved off to the left with the map. I don't want that. Any thoughts on what I need to do differently? It seems to me that this.layer.resizeWorld(); isn't doing it's thing, but I don't know.

create: function() {
  this.starfield = this.game.add.tileSprite(0, 0, 800, 600, 'starfield');
  //Rex
  this.rex = new DinosaursInSpace.Rex(this.game, 50, 500);
  this.game.add.existing(this.rex);
},  
update: function() {
  this.starfield.tilePosition.x -= this.SCROLL_SPEED;
  this.game.camera.x += this.SCROLL_SPEED;
},  
loadLevel: function() {
  this.map = this.game.add.tilemap('level1');
  this.map.addTilesetImage('ground_1x1');
  this.map.setCollisionBetween(1, 12);
  this.layer = this.map.createLayer('Tile Layer 1');
  this.layer.resizeWorld();
  this.game.physics.startSystem(Phaser.Physics.ARCADE);
}

 

Did you actually figured out how to properly do this? Because I have one issue regarding collisions: apparently they work only when I approach the obstacles from top/bottom, if the player goes through them the callback for collision is not called.. Perhaps it has to do with updating manually the player position on every frame?