Jump to content

Breakable Tiles in Phaser 2


Noid
 Share

Recommended Posts

I'm doing a platformer and I want to have breakable tiles. When the player touches the tile, the tile disappears( and the empty space stops colliding).

In phaser one I could set up a tile index callback which would set the tile index to 0 and recalculate collision, but in phaser 2 this doesn't seem to be possible.

 

Is there any way to remove a tile object from a tilemap layer? I can't find it in the docs.

Link to comment
Share on other sites

I would also like to see this answered. In 1.1.6 if you use 0 or null as the tile in puttile, the tile would be removed. Now the index for the tileset seems to have shifted (starts from 0 instead of 1), and using null gives an error in the render method. So how do we remove a tile in 2.0.1?

Link to comment
Share on other sites

Just set tile 0 of your tile set to be empty with no collision?

 

It depends how large the map is though, because when you modify the tilemap you're going to want to update the collision data too, and this isn't something you ever want to be doing in a main loop (depending on how large the map is). If it's a huge map then I'd use a Sprite.

Link to comment
Share on other sites

You could do this, although I'm not sure if it's safe/smart/efficient or anything.

removeTile = function(player, tile){   ground.alpha = 0;   ground.collideDown = false;   ground.collideUp = false;   ground.collideRight = false;   ground.collideLeft = false;   tile_layer.dirty = true;};update = function(){    game.physics.arcade.collide(player, tile_layer, removeTile);};

Although, I'm not sure how to enable collisions on the tiles surrounding the one you just hit. Hope this helps and is not too horrible. 

 

tile_layer.dirty = true; forces a redraw of the tiles so the alpha setting will work.

Link to comment
Share on other sites

  • 2 weeks later...
  • 3 weeks later...

I was researching this also and was able to find that the new Phaser 2.03 supports this in a function Tilemap.removeTile(x,y) which states

 

Removes the tile located at the given coordinates and updates the collision data.

 

This pretty much handles what I was looking for.

 

I used it like this:

 

In the update method handle the collision between the sprite or group with the layer.

game.physics.arcade.collide(group_or_sprite_to_use, main_layer, callback_function);

And in the callback function just handle the collision and removal of tile. Using the actual map created in the create function.

function callback_function(group_or_sprite,tile) {  //Do stuff with group_or_sprite (kill?)  map.removeTile(tile.x, tile.y);} 

That was it for me. It's working fine. Don't know if there is a better approach but for now this is good enough for me.

 

Hope this helps.

Link to comment
Share on other sites

I was researching this also and was able to find that the new Phaser 2.03 supports this in a function Tilemap.removeTile(x,y) which states

 

Removes the tile located at the given coordinates and updates the collision data.

 

This pretty much handles what I was looking for.

 

I used it like this:

 

In the update method handle the collision between the sprite or group with the layer.

game.physics.arcade.collide(group_or_sprite_to_use, main_layer, callback_function);

And in the callback function just handle the collision and removal of tile. Using the actual map created in the create function.

function callback_function(group_or_sprite,tile) {  //Do stuff with group_or_sprite (kill?)  map.removeTile(tile.x, tile.y);} 

That was it for me. It's working fine. Don't know if there is a better approach but for now this is good enough for me.

 

Hope this helps.

 

Hey hellbinder, yeah this does help, BUT for some rediculous reason none of the example code by you or jyapayne alters my displayed TileMap.

For example none of the follwing functions remove any elements of my TileMap:

this.map.removeTile(tile.x,tile.y);this.map.removeAllLayers();

The only thing that did (kinda) work is:

...removeTile: function(sprite, tile){    tile.alpha = 0;    tile.collideUp = false;    tile.collideDown = false;    tile.collideLeft = false;    tile.collideRight = false;    this.layer4.dirty = true;    this.map.dirty = true; // Doesn't work without this},...

Do you have any idea why your way is not working for me?

Link to comment
Share on other sites

  • 3 weeks later...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...