Jump to content

How to resize wall on hit


sendmenas
 Share

Recommended Posts

Hello,

I am working on a "NES Battle City" clone with Phaser3 and I can not figure out how should I resize a wall on bullet hit.

What I want to achieve is that on bullet hit part of the wall is destroyed. I tried to find something similar in tutorials but I couldn't. The closest thing I came up with was to use "setCrop()", but it only changes the size of the image, and the wall object size stays the same, so this does not work.

Can anyone point me in the right direction how should I do it?

My code is here - https://github.com/sendmenas/Tanks/blob/master/script.js

Demo - https://sendmenas.github.io/Tanks/index.html

Who is not familiar with this game, you can check it here - http://emulator.online/nes/battle-city/

 

Link to comment
Share on other sites

This is one of the options, but as the wall will have ~9 possible stages, I was wondering if there is a possibility to manage it in another way than defining separate pic for it. I was playing around with the sprite length and height, but it does not change when I try to set it (I tried to make the update of an item after that, with no luck).

Link to comment
Share on other sites

i'm new to phaser and maybe my answer not true..

but i think in html ( mean css ) change size of a object is not recommended.

i think if you make small wall is better than resize a wall

means:

for example now your wall size is 9*9(for example) and when tank is shoting you want remove 3*3 size of wall ( you want to resize that big pic to a smaller pic)...

i said way you do this ? make 3*3 wall pic and if tank shot you remove ( hide ) that's 3*3 object....it's better than resize a wall 

( sorry about bad english writing...i hope you understand my meaning :D )

Link to comment
Share on other sites

After a few days of trial and error I came up with this solution, maybe it will help someone in the future.

 

	bulletBrickHit(bullet, brick) {
	    switch(bullet.direction) {
	        case 'up':
	            brick.setCrop(0, 0, brick.body.width, brick.body.height - 25);
	            brick.setSize(brick.body.width, brick.body.height - 25);
	            break;
	        case 'down':
	            brick.setCrop(0, 0, brick.body.width, brick.body.height - 25);
	            brick.setSize(brick.body.width, brick.body.height - 25);
	            brick.y += 25;
	            brick.body.y += 25;
	            break;
	        case 'left':
	            brick.setCrop(0, 0, brick.body.width - 25, brick.body.height);
	            brick.setSize(brick.body.width - 25, brick.body.height);
	            break;
	        case 'right':
	            brick.setCrop(0, 0, brick.body.width - 25, brick.body.height);
	            brick.setSize(brick.body.width - 25, brick.body.height);
	            brick.x += 25;
	            brick.body.x += 25;
	            break;
	    }
	    if (brick.body.width == 0 || brick.body.height == 0) {
	    	brick.disableBody(true, true);
	    }
	    
	}

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

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