← На главную
Серия руководств

Шаг 13. Сбор алмазов

Создание платформера с PixiJS • Шаг 13 из 15

При касании героем алмаз считается собранным и должен исчезнуть с экрана. Как определить момент столкновения? Мы уже делали это для героя и платформы в классе 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;
    }
    // ...
}

При сборе алмаза уничтожаем его физическое тело и сам спрайт. Также увеличиваем счётчик очков героя, который позже выведем на экран как игровой счёт.