Check how much sprites overlap

[daniel0514]

Hello! I was wondering if is there a way I can check how much two sprites are overlapping?

 

I'll start to develop a dance revolution-like game and I want to check if the arrows the players have to press, overlap completely or just a little in order to give points.

 

Thanks in advance!

[Cudabear]

I think the best way to do what you're talking about is to have some kind of data indicating when the optimal time for button presses to happen is, then use a counter or timer to see how much they were off.  EG, I expected UP arrow presses on frame 100, 200, and 300, but I saw them on 105, 195, and 310, so you don't get a perfect score.

However, if you did want to check the overlap of the sprites, you can use Phaser.Rectangle to get the heavy lifting done for you:

 

function areaRectangle(rect){    return ((rect.x + rect.width) - rect.x) * ((rect.y + rect.height) - rect.y)}rect1 = new Phaser.Rectangle(sprite1.x, sprite1.y, sprite1.width, sprite1.height);rect2 = new Phaser.Rectangle(sprite2.x, sprite2.y, sprite2.width, sprite2.height);//returns a rectangle indicating the intersected areavar intersection = Phaser.Rectangle.intersection(rect1, rect2);var intersectedArea = areaRectangle(intersection);//get percentage intersected of rect1, or rect2?  We'll just use rect1 in this case.var areaRect1 = areaRectangle(rect1);var percentIntersected = areaRect1/intersectedArea;

[daniel0514]

 

I think the best way to do what you're talking about is to have some kind of data indicating when the optimal time for button presses to happen is, then use a counter or timer to see how much they were off.  EG, I expected UP arrow presses on frame 100, 200, and 300, but I saw them on 105, 195, and 310, so you don't get a perfect score.

However, if you did want to check the overlap of the sprites, you can use Phaser.Rectangle to get the heavy lifting done for you:

 

function areaRectangle(rect){    return ((rect.x + rect.width) - rect.x) * ((rect.y + rect.height) - rect.y)}rect1 = new Phaser.Rectangle(sprite1.x, sprite1.y, sprite1.width, sprite1.height);rect2 = new Phaser.Rectangle(sprite2.x, sprite2.y, sprite2.width, sprite2.height);//returns a rectangle indicating the intersected areavar intersection = Phaser.Rectangle.intersection(rect1, rect2);var intersectedArea = areaRectangle(intersection);//get percentage intersected of rect1, or rect2?  We'll just use rect1 in this case.var areaRect1 = areaRectangle(rect1);var percentIntersected = areaRect1/intersectedArea;

Could you elaborate on the first approach you mentioned, please?