Jump to content

Destructible tiles code review/improvement request


Recommended Posts

Hi all,


I've managed to do a very simple but not very flexible code to damage and destruct tiles when shooting at them.


I have a Json map, one layer with an image for not destructible tiles and a second layer with a sprite-sheet with 4 frames for the 4 damage levels (see image).


My problem is that one bullet collision result in one step in the damage progression. What I want is to have different damage thresholds for different weapons: a pistol has to shoot 10 bullets to move to the next damage level, a machine gun needs only 5, and a bomb destroys the tile immediately.


Thank you for any help


I'm pasting here only the relevant code, I've omitted stuff like moving the player or particle effects:

(edited code formatting)

create: function() {		this.createWorld();		//OTHER CODE OMITTED...	},update: function() {}	update: function() {		game.physics.arcade.collide(this.player, this.layerWorld);		game.physics.arcade.collide(this.player, this.layerDirt);		game.physics.arcade.overlap(this.bulletPool, this.layerDirt, this.destroyTerrain, null, this);		this.shootBullet();		//OTHER CODE OMITTED...		},//OTHER CODE OMITTED...	createWorld: function(){		//create the tilemap		this.map = game.add.tilemap('level1');				//add tileset images to the map		this.map.addTilesetImage('worldBase');		this.map.addTilesetImage('worldDirt');		//crete layers from every json layer		this.layerWorld = this.map.createLayer('worldBase');		this.layerDirt = this.map.createLayer('worldDirt');		//enable collisions for the first frame		this.map.setCollision(1, true, this.layerWorld);		//enable collision for all frames in sprite                this.map.setCollision([26,27,28,29], true, this.layerDirt);		//set the world size to match the size of the layer		this.layerWorld.resizeWorld();		//set bounds to world		game.world.setBounds(0,0,3200, 320);	},//OTHER CODE OMITTED...	destroyTerrain: function(bullet, tile) {					//move the emitter at the bullet's point of contact with the tile			this.dirtParticles.x = bullet.x;			this.dirtParticles.y = bullet.y;						//start emitting			//start(explode, lifespan, frequency, quantity)			this.dirtParticles.start(true, 2000, null, 15);			//advance to the next tile's id			tile.index += this.BULLET_DAMAGE;						if(tile.index < 29) {								this.map.putTile(tile.index, tile.x, tile.y, this.layerDirt);			} else if (tile.index >= 29) {				this.map.removeTile(tile.x, tile.y, this.layerDirt);			}				bullet.kill();},	



Link to comment
Share on other sites

I would add a health property to the tiles. You can add properties for a tile in a tilesheet in Tiled, or if you don't use Tiled you could loop through all detroyable tiles and add health.


If you add a health property in tiled and set it to 10 phaser will load 10 into tile.properties.health.


Pseudo-code: (undamaged index == 1)


tile.properties.health-=damage; // damage might be 1 for gun and 2 for rocket


newIndex = 4; // Almost gone


else if(tile.properties.health<6){

newIndex = 3; // Falling apart


else {

newIndex = 2; // Cracked


if(newIndex !=  tile.index){

this.map.putTile(newIndex, tile.x, tile.y, this.layerDirt);



Link to comment
Share on other sites


  • Recently Browsing   0 members

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