При касании героем алмаз считается собранным и должен исчезнуть с экрана. Как определить момент столкновения? Мы уже делали это для героя и платформы в классе GameScene.js, реализуя onCollisionStart. Расширим этот метод: добавим проверку наличия алмаза и обработку столкновения:
export class GameScene extends Scene {
// ...
onCollisionStart(event) {
// ...
const diamond = colliders.find(body => body.gameDiamond);
if (hero && diamond) {
this.hero.collectDiamond(diamond.gameDiamond);
}
}
// ...
}
Нужно реализовать метод collectDiamond в классе Hero.js:
import * as Matter from 'matter-js';
import * as PIXI from "pixi.js";
import { App } from '../system/App';
export class Hero {
constructor() {
// ...
this.score = 0;
}
collectDiamond(diamond) {
++this.score;
Matter.World.remove(App.physics.world, diamond.body);
diamond.sprite.destroy();
diamond.sprite = null;
}
// ...
}
При сборе алмаза уничтожаем его физическое тело и сам спрайт. Также увеличиваем счётчик очков героя, который позже выведем на экран как игровой счёт.