Как создать платформер

3

Index

Tagged

Contributors

Stats

91,416 visits, 123,314 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Published on 17 May, 2017. Last updated 25 Feb, 2019

Добавление слоёв

Отлично, теперь стоит добавить несколько объектов.

Однако, при работе с объектами мы можем случайно передвинуть наш фон. Чтобы этого не произошло в Construct 2 имеется система слоев с применяемыми к ним параметрами. Если вы работали в каких либо графических редакторах, вроде Adobe Photoshop, вы уже, наверняка, знаете как работают слои. Осталось только заблокировать наш слой с фоном.

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

Чтобы управлять слоями, перейдите на вкладку Layers , которая обычно находится рядом с Project bar:

Вы должны увидеть Layer 0 в списке (Construct 2 начинает нумерацию с нуля как в программировании, запомните это). Нажмите на значок карандаша и переименуйте его в Background (фон), так как это наш фоновый слой. Теперь нажмите на значок "добавить", чтобы создать новый слой для наших новых объектов. Давайте назовем его Main (основное). Наконец, если вы нажмете на иконку замка рядом с Background, она будет заблокирован. Это значит, что вы не сможете с ним взаимодействовать до того как не снимите блокировку, снова нажав на значок замка. Это очень удобно для нашего фона, который легко случайно выбрать и сместить ненароком.

Флажки же позволяют скрыть слои в редакторе, но нам это пока не нужно . Ваше меню слоёв должно выглядеть так:

Теперь убедитесь, что выбран 'Main' слой в меню слоев. Это важно, потому что выбранный слой является активным слоем. Все новые вставленные объекты вставляются в активный слой, так что если он не выбран, мы можем случайно вставить новый объект в не тот слой. Активный слой показан в строке состояния, а также появляется в виде всплывающей подсказки при размещении нового объекта - стоит за этим следить.

Добавление платформ

В Jungle Platformer есть набор платформ Tiles\Tiles.png. Давайте импортируем их как спрайты и разделим на плитки из которых и будем составлять цельные платформы.

Снова сделайте двойной щелчок мышью на пустом пространстве плана, чтобы вставить новый объект. На этот раз, выберите Sprite . Курсор превратится в перекрестие. Нажмите где-нибудь в середине экрана.

После чего откроется Редактор изображений с некоторыми дополнительными окнами, что используются для создания анимации и плиток. Тем не менее, нам не нужно воспроизводить какую-то анимацию - поэтому её скорость будет равна 0 и мы будем добавлять плитки. Мы видим окно Animation Frames (кадры анимации) с иконками, представляющими из себя каждый кадр анимации либо каждую плитку. Вы можете переключать иконки анимации/плиток, выбирая определенный кадр/плитку и отдельно редактируя объект. Но пока у нас одна пустая иконка

Кликните правой кнопкой мыши на пустом месте в окне Animation Frames, что внизу, и выберите Import sprite strip... (импортировать полосу спрайтов). Это позволяет нам сократить большое количество изображений в одну "анимацию" с плитками. Это может напоминать "массивы", то есть мы обращаемся к полосе спрайтов и указываем плитку после чего она и показывает нужную плитку, это гораздо удобней чем загружать и обращаться к отдельным изображениям. В общем сейчас мы это рассмотрим поближе.

Должно открыться окно выбора спрайтов. Выберите Tiles\Tiles.png из прилагаемого пака. Construct 2 должен знать сколько "плиток" в этой полосе спрайтов, поэтому нужно указать размер одной плитки. В Tiles.png одна плитка равна 12 на 12 клеткам. Вбиваем это значение и нажимаем OK

Подождите немного чтобы программа разделила нашу полосу и вуаля! Теперь у вас есть 144 плитки для использования! У нас остался первый пустой кадр, он нам не нужен, жмите правую кнопку и delete.

Дайте Construct 2 некоторое время чтобы порезать плитки. Теперь у вас должно быть 144 плитки, которые импортированы как кадры анимации. Первый пустой кадр нам больше не нужен, так что нажмите Правой кнопкой мыши на нём и затем выбирайте delete.

Надо бы увеличить превью плиток чтобы получше их рассмотреть, верно? Кликните ПКМ по пустому пространству Thumbnail size и выбирайте нужный размер.

По умолчанию скорость воспроизведения анимации равна 5 это значит что размещенные платформы будут по порядку менять менять свои изображения, как мы их и загрузили. Однако, нам нужно, чтобы кадры не менялись, так давайте установим скорость на 0. Выберите анимацию Default в окне Animations.

Теперь на Properties Bar показываются настройки данной анимации. Установите Speed (скорость) на 0.

Готово! Теперь наши платформы будут сохранять указанное изображение. Закройте редактор изображений. Теперь нужно разместить вашу платформу на план.

Выберите ее и смените название с Sprite на Tile в Properties Bar. Всегда удобней, когда объекты имеют свое название.

Создание пейзажа из тайлов

Заметьте, что у спрайта есть настройка Initial frame. Она может использоваться для того, что сменить текущую плитку. Выберите плитку и смените текущий кадр на 1:

Notice the image changes to reflect the tile in animation frame 1. This is how we can set up different tiles across the level.

Удерживайте Control and кликните и перетащите плитку. Вы создадите другой объект-плитку. Повторите это трижды. Выберите центральную плитку, и измените её initial frame на 10. Повторите то же самое для правой, но убедитесь, что её initial frame составляет 13. У вас должно получиться что-то вроде этого:

If you're wondering how to double-check which frame number corresponds to which tile, just double-click the tile object. The image editor comes up again with the animation windows where you can check. Remember you can control drag a tile and it makes another tile of the same type, so you don't need to keep typing in initial frames.

Включаем привязку к сетке

Выравнивать тайлы вручную — это настоящая головная боль! Чтобы облегчить этот процесс, включим привязку к сетке. В верхнем меню кликните View и поставьте галку Snap to Grid. Размер сетки по умолчанию 32x32 нам как раз подойдёт. Наши тайлы размером 128x128 делятся на 32. С одной стороны мы легко подставим тайлы друг к другу и у нас будет свобода позиционирования.

Try dragging around the tiles now. You should find they snap to a 32x32 grid. Now it should be easy to snap the three tiles together.

  • 3 Comments

  • Order by
Want to leave a comment? Login or Register an account!