Как стать автором
Обновить

О ходе создания игры «Колобок» в июле

Время на прочтение 2 мин
Количество просмотров 1.8K

В июле с помощью Matter.js реализовал прыжки колобка из-под платформы и подкидывание стрелы.


В предыдущей статье я остановился на невозможности колобка запрыгнуть на платформу из-под неё. В Matter.js для реализации этого ожидаемого в платформерах поведения рекомендуют менять маску столкновения в зависимости от направления движения.


Я попробовал менять маску, но получил следующее поведение:



Т.е. малейшее пересечение объекта с платформой и последующее переключение маски столкновения приводило к тому, что платформа подхватывала объект и поднимала его над собой.
К сожалению, на свой вопрос, как этого избежать, ответа я до сих пор не получил, поэтому пошёл другим путём: уменьшил высоту объекта игрока для исключения нежелательного подхватывания. Результат стал существенно лучше:



На этом шаге возникла необходимость разделить физическое и видимое представления игрока: перемещать кирпич, а отображать на его месте колобка. Решением стало введение возможности синхрить положение объекта и изображения:


слежение: {
    колобок: {
        объект: "кирпич",
        изображение: "колобок",
        смещение: [-35, -65],
        скорость: 1,
    },
},

Конечный результат можно лицезреть на первом видео.


Итоговое изображение колобка теперь выглядит следующим образом:


изображения: {
    колобок: {
        ширина: 70,
        высота: 70,
        вид: {
            background: "url(р/колобок/колобок_неподвижен.png)",
            "z-index": 10,
        },
    },
},

Итоговый объект колобка выглядит так:


объекты: {
    кирпич: {
        x: 1170,
        y: 350,
        высота: 20,
        ширина: 40,
        вид: {
            background: "url(р/отладка/основа.jpg)",
            display: "none",
        },
        физика: {
            isStatic: false,
            inertia: Infinity,
        },
    },
},

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


Для игрока это теперь выглядит следующим образом:


маскиПрыжков: {
    игрок: {
        объект: "кирпич",
        скорость: -1,
        маски: [1, 1|2],
    },
},

Таким образом, при скорости игрока меньше -1 (прыжок) маска равна 1. У платформ маска 2, поэтому игрок проходит сквозь платформы. При скорости игрока больше либо равной -1 (замедление прыжка и падение) маска равна 1|2, т.е. столкновение с объектами как с маской 1 (пол), так и 2 (платформы).


Полная реализация подкидывания стрелы включает в себя работу с событиями и собственный класс/функцию обработки этих событий, но не буду подробного его описывать, т.к. хочу узнать ваше мнение, насколько ясным получился конечный результат. Прошу всех заинтересованных ознакомиться с итоговым файлом JSON-JS и ответить на прикреплённый к статье опрос. Заранее спасибо.


P.S.: Список публикаций на текущий момент:


Только зарегистрированные пользователи могут участвовать в опросе. Войдите, пожалуйста.
Насколько соответствует итоговый JSON-JS вашему представлению о прекрасном для достижения результата из видео?
0% Всё ясно, ничего лишнего 0
20% Всё ясно, но кода многовато 1
80% Код запутан, слишком много деталей 4
Проголосовали 5 пользователей. Воздержались 12 пользователей.
Теги:
Хабы:
+1
Комментарии 9
Комментарии Комментарии 9

Публикации

Истории

Работа

Ближайшие события

Московский туристический хакатон
Дата 23 марта – 7 апреля
Место
Москва Онлайн
Геймтон «DatsEdenSpace» от DatsTeam
Дата 5 – 6 апреля
Время 17:00 – 20:00
Место
Онлайн