Назад Вперед

Часть 6. Движение шара и столкновение с платформами.

Продолжаю работу с основными игровым объектами мини-игры. Мой шар после прошлого материала двигается от края к краю, но с платформами не происходит никакого взаимодействия. Поэтому в этом материале я это исправлю.

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

Файл platform.js:


    ...
    scene.physics.world.enable(this);
    ...
 

Добавление физических свойств платформам

Сейчас изменений никаких не произойдет, так как я еще не прописал метод, который проверят столкновение двух объектов и запускает соответствующую функцию. В ней будет записан код, который будет выполняться при соприкосновении этих объектов.

Перехожу в файл game.js. После кода с созданием объектов записываю 2 метода для первой и второй платформы. В скобках указаны объекты, у которых проверяется столкновение, третьим параметром идет та самая функция. У меня она называется callBall.

Файл game.js:


    ...
    this.physics.add.collider(this.ball, this.playerOne, this.callBall, null, this);
    this.physics.add.collider(this.ball, this.playerTwo, this.callBall, null, this);
    ...
 

Теперь создаю эту функцию. Ее записываю между функциями create() и update().

Файл game.js:


    ...
    callBall() { 

    }
    ...
 

Добавление новой функции

Сохранив оба файла и открыв проект через локальный сервер, вижу, что шар, столкнувшись с платформой останавливается, а сама платформа "улетает" за пределы сцены под действиями смоделированных сил. Это значит, что платформы теперь тоже имеют физические свойства.

Проверка в браузере

Так как я еще не записывал методы, которые выполняются при столкновении в функции callBall(), то сам шар просто останавливается. И конечно же, нужно сделать так, чтобы платформа оставалась на месте, а не двигалась при столкновении.

Для этого платформам нужно отключить одно из физических свойств. Записывать это буду опять в файле, где расположен класс Platforms. Свойство самого тела платформы immovable (неподвижный) делаю со значением true (истина).

Файл platform.js:


    ...
    this.body.immovable = true;
    ...
 

Добавление физический свойств

Проверю сразу изменение в браузере после сохранения. Теперь шар при столкновении с платформой ведет себя так же, как и при столкновении со стенкой. Его скорость меняется на противоположное значение и шар двигается к другой стороне игровой сцены, где снова отскакивает от платформы. Платформы же остаются на своих местах.

Проверка в браузере

Скорость шара у меня указана только для оси Х, поэтому шар и двигается только по одной линии. Задача такая, чтобы при столкновении с платформой, задавалась скорость и по оси Y. В этом случае шар начнет двигаться по диагонали. Код нужно будет записывать в созданной функции callBall(). Кроме того, направление у меня будет выбираться в рандомном диапазоне координат. Запишу это все в функции.

Файл game.js:


    ...
    callBall() { 
        this.ball.setVelocityY(Phaser.Math.Between(-120,120));
    }    
    ...
 

Рандомное направление при столкновении

setVelocityY — задает скорость по оси Y, а дальше в скобках идет метод для выбора рандомного значения этого направления. Диапазон от -120 до 120. Теперь при каждом столкновении с платформой будет выбрана одна рандомная цифра из этого диапазона.

Проверка в браузере

Проверяю все в браузере. Отскок работает. Шар летит в другую сторону в одном из направлений. При чем работает отскок и от верхних граница игрового экрана. Так как боковые стенки тоже пока реагируют на соприкосновение с шаром, то он будет двигаться туда-сюда в рандомном направлении. В следующем материале уберу возможность столкновения с боковыми стенками и обновление позиции шара при вылете за пределы экрана.

Спасибо за внимание!

Назад Вперед