Создаем платформер за 5 минут

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

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

Для создания примера использовалась стабильная версия программы Construct 99.62 (Stable), которую вы можете скачать по этой ссылке.

Подготовка

Итак, давайте приступим. Откройте программу, на главной панели команд нажмите Файл, затем New (Новый) и далее New Direct-X game (Новая Direct-X игра).
Перед вами новый проект.

Прежде чем создавать свою первую игру, нам нужно произвести некоторые настройки. По умолчанию программа создаёт проект с шириной и высотой уровня 640х480, но наш первый уровень будет иметь размер немного больше. Поэтому, первым делом нам нужно настроить уровень: на панели Properties (Свойства), которая располагается слева (смотрите рис. 1), во вкладке Layout Properties (Свойства Уровня) напротив Wight (Ширина) установите значение 2000, а напротив Height (Высота) — 600. Теперь наш уровень будет иметь длину в 2000, а высоту в 600 пикселей.

Рис. 1 — Layout Properties (Свойства Уровня).

Далее нам нужно настроить размер окна, через которое мы, подобно видеокамере, будем наблюдать за персонажем и окружающими его объектами в игре. Для этого во вкладке Layout Properties (Свойства Уровня) напротив Application (Приложение) кликните по ссылке Properties (Свойства). Откроется ряд новых опций, среди которых нам нужно найти Window Properties (Свойства Окна) — смотрите рис. 2. Напротив Window Width (Ширина Окна) установите значение 800, а напротив Window Height (Высота Окна) установите 600. Теперь при запуске приложения, размер игрового окна будет 800 на 600 пикселей.

Рис. 2 — Window Properties (Свойства Окна).

Кстати, на панели Properties (Свойства), чуть выше есть вкладка Information Properties (Информация), где напротив Name (Имя) вы можете написать название вашей игры, а напротив Creator (Создатель) вписать своё имя — смотрите рис. 3.

Рис. 3 — Information Properties (Информация).

Также я рекомендую включить опцию FPS in caption (FPS в заголовке), которая располагается чуть ниже, во вкладке Runtime Properties (Опции Запуска) — смотрите рис. 4 Эта опция помогает отслеживать количество кадров в секунду и загруженность видеопамяти при запуске приложения.

Рис. 4 — Runtime Properties (Опции Запуска)

Если вы хотите, чтобы при запуске ваша игра открывалась на полный экран, установите флажок Fullscreen (Полный экран).

Примечание: если вы включили опцию FPS in caption, то информация о количестве кадров и видеопамяти будет отображаться только в режиме окна (т.е. опция Fullscreen должна быть выключена).

Теперь переходим к загрузке спрайтов для нашей игры.

Создание каркаса и декораций

Объекты в сцене можно условно разделить на два типа — каркас и декорации. Каркас является основой взаимойдействия объекта с другими телами, именно к нему применяются все поведения, но он не виден в сцене. Декорации — это то, что мы видим в игре на экране, например, анимация персонажа. Обычно они привязаны к каркасу и наследуют его поведение. Такое разделение создано по одной простой причине — чтобы столкновение объектов всегда происходило одинаково. Анимированый персонаж, или спрайт, постоянно меняющий размер, может пересекаться с объектами абсолютно неожиданным образом, что обычно приводит к его телепортации. Но если персонаж будет привязан к невидимому боксу, который имеет всего 1 кадр анимации и 1 направление, и именно этот бокс будет сталкиваться со всеми объектами — столкновение всегда будет работать одинаково корректно.

Для начала добавим спрайт, который будет выполнять роль невидимого препятствия и через который наш персонаж не сможет провалиться. Скачайте изображение спрайта по этой ссылке — platforma01.png.

В центре экрана располагается белое поле, это Layout Editor (Редактор Уровня), тут мы и будем собирать весь уровень в игре. Чтобы добавить спрайт, кликните на белом поле правой кнопкой мыши (далее сокращенно ПКМ), откроется всплывающее меню, в котором нужно выбрать команду Insert an object (Вставить объект), кликнув на ней левой кнопкой мыши (далее сокращенно ЛКМ). Смотрите рис. 5.

Рис. 5 — Всплывающее меню.

Откроется окно с заголовком Insert new object (Вставить новый объект), где содержатся все объекты программы. Среди них найдите объект под названием Sprite (Спрайт) — смотрите рис. 6. Кликните по нему 2 раза ЛКМ, и вместо курсора на поле появится крестик. Кликните ещё 1 раз ЛКМ в том месте, где хотите разместить объект на поле.

Рис. 6 — Insert new object (Вставить новый объект).

Откроется окно редактора Picture Editor (Редактор Изображений) — смотрите рис. 7. В самом верху есть иконка с изображением открытой папки — это кнопка Open (Открыть), кликните на неё и, указав нужный путь к файлу platforma01.png, нажмите Открыть. В редакторе появится спрайт. Закройте окно редактора, кликнув на крестик (справа вверху), вас спросят Do you want to save changes to this images? (Вы хотите применить изменения к изображениям?) — нажмите кнопку Да.

Рис. 7 — Picture Editor (Редактор Изображений).

На белом поле появится спрайт. Давайте зададим ему имя.

Примечание: при создании игры очень важно давать имя каждому новому спрайту, так как от этого зависит удобство и скорость поиска объекта при создании событий.

Чтобы назначить имя спрайту, перейдите на панель Properties (Свойства), и там во вкладке Common (Общие), напротив опции Name (Имя) впишите имя спрайта — назовите его platforma01. Смотрите рис. 8.

Рис. 8 — Common (Общие)

Теперь нужно задать спрайту дополнительный атрибут, чтобы наш персонаж не смог проваливаться сквозь объект. Найдите чуть ниже вкладку Groups (Группы), а в ней ещё одну под-вкладку Attributes (Атрибуты) и установите галочку напротив опции Platform (Платформа) — смотрите рис. 9. Данный параметр создает одностороннее столкновение персонажа и платформы, т. е. персонаж не сможет провалится сквозь платформу, но он всегда сможет запрыгнуть на нее снизу.

Рис. 9 — Атрибут Platform (Платформа).

Так как этот спрайт является каркасом, по которому будет ходить наш персонаж, нужно сделать его невидимым. Для этого спуститесь ещё ниже по списку, найдите вкладку Appearance (Появление) и напротив опции Invisible on start (Невидимый при старте) поставьте галочку — смотрите рис. 10. Теперь при запуске игры спрайт platforma01 будет невидимым.

Рис. 10 — Appearance (Появление)

Пришло время заняться расстановкой спрайта. Но перед этим нам нужно включить одну очень полезную опцию, которая позволяет точно располагать объекты в сцене. В самом верху программы на главной панели команд выберите вкладку Layout (Уровень), среди открывшихся опций найдите раздел Grid (Сетка), включите сетку, нажав на большой кнопке Toggle Grid (Переключить Сетку), и рядом установите галочку Snap-to moving (Движение с привязкой к сетке). Смотрите рис. 11.

Рис. 11 — Grid (Сетка).

В этой же группе нажмите на кнопку Edit grid (Править сетку), откроется окно Grid settings (Настройки сетки) — смотрите рис. 12. Установите Horizontal width (Горизонтальная ширина) и Vertical height (Вертикальная высота) по 64 пикселя, нажмите ОК.

Рис. 12 — Grid settings (Настройки сетки).

Теперь расположите спрайт platforma01 в левом нижнем углу сцены Layout Editor (Редактора уровня), он самостоятельно примагнитится к точке и слегка выйдет за границу сцены. Чтобы скопировать спрайт, удерживайте клавишу Control + ЛКМ перетащите его курсором мыши. Спрайт автоматически примагнитится к сетке. Раскопируйте спрайт по всему уровню, чтобы у вас получилось, как на рис. 13 (масштаб уровня уменьшен на 75%).

Рис. 13 — Расположение спрайта platforma01

Теперь создадим спрайт, который будет основой нашего персонажа. Скачать изображение спрайта можно по этой ссылке — basis.png. В Layout Editor (Редактор Уровня) на белом поле кликните ПКМ и добавьте новый объект спрайт. Откроется окно Picture Editor (Редактор изображения), укажите путь к изображению и, загрузив его, закройте редактор. Поместите спрайт чуть выше платформ, которые мы создали до этого. Смотрите рис. 14. (масштаб уровня уменьшен на 50%).

Рис. 14 — Расположение спрайта basis

Затем в свойствах спрайта, во вкладке Common (Общие) задайте имя basis. Далее ниже, во вкладке Behaviors (Поведения), напротив опции New behaviors (Новое поведение), нажмите Add (Добавить). Смотрите рис. 15.

Рис. 15 — Behaviors (Поведения).

Откроется список поведений, среди которых нам нужно выбрать поведение Platform (Платформер). Смотрите рис. 16.

Рис. 16 - Список поведений.

Теперь нам нужно сделать так, чтобы камера в игре всегда следила за нашем персонажем. Для этого ниже ищем вкладку Groups (Группы), открываем под-вкладку Attributes (Атрибуты) и напротив опции Center view on me (Центрировать взгляд на мне) ставим галочку. Смотрите рис. 17.

Рис. 17 — Опция Center view on me (Центрировать взгляд на мне).

Так как спрайт basis тоже является лишь каркасом для основного персонажа, нужно сделать его невидимым также как и платформу. Для этого ниже в свойствах, во вкладке Appearance (Появление) поставьте галочку напротив опции Invisible on start (Невидимый при старте).

Итак, основной каркас игры мы построили. Теперь нам нужно создать второй слой уровня, куда мы будем загружать спрайты декораций. В правой части экрана есть панель, где располагаются три вкладки: Project (Проект), Animator (Анимация) и Layers (Слои). Смотрите рис. 18.

Рис. 18 — Вкладки на правой панели.

Нажмите на третью вкладку Layers (Слои), и на панели отобразится список всех слоев в сцене. Смотрите рис. 19.

Рис. 19 — Вкладка Layers (Слои).

Кликните ЛКМ на названии слоя (по надписи Layer 1), слева, на панели Properties (Свойства) появятся свойства слоя. Найдите вкладку Layer Properties (Свойства Слоя) и напротив Name (Имя)впишите новое имя слоя carcass. Смотрите рис. 20.

Рис. 20 — Layer Properties (Свойства Слоя).

Возвращаемся в правую часть экрана к вкладке Layers (Слои) и создаем новый слой, нажав на зеленую стрелку с направлением вверх (рядом с корзиной). Появится новый слой с названием Layer 2, кликните по нему ЛКМ и переименуйте в свойствах на scenery. У вас должно получится в точности, как на рис. 21.

Рис. 21 — Слои.

Примечание: если вы помещаете спрайт на слой, стоящий выше, то этот спрайт всегда будет перекрывать другие спрайты, находящиеся на слое ниже.

Пришло время загрузить платформу, по которой будет бежать наш главный герой. Скачать изображение платформы можно по этой ссылке — platforma02.png.

Итак, убедитесь, что слой 2 выделен (если нет, то кликните ЛКМ по названию слоя — scenery), перейдите в Layout Editor (Редактор Уровня), кликните на белом поле ПКМ и создайте новый объект спрайт. Загрузите изображение платформы и переименуйте его в platforma02. Далее раскопируйте и расставьте спрайт таким образом, чтобы копии находились на тех же местах, что и спрайты platforma01 (т.е. перекрывали их). Смотрите рис. 22 (масштаб уровня уменьшен на 75%).

Рис. 22 — Расположение спрайта platforma02.

Давайте добавим задний фон. Для этого скачайте его по ссылке — background.png, затем выделите слой carcass (кликнув по названию) и нажмите зеленую стрелку с направлением вниз. У вас появится новый слой. Переименуйте его в background, затем добавьте на этот слой новый объект спрайт и, загрузив в него изображение заднего фона, переименуйте сам спрайт на background. Там же, в свойствах, во вкладке Common (Общие), установите координаты расположения заднего фона в пикселях — значение 1000 напротив надписи X, 300 — напротив Y. Также давайте зададим размер заднего фона, установив параметр Width (Ширина) — 2000, а Height (Высота) — 600. Если ничего не напутали, у вас должно получится как на рис. 23.

Рис. 23 — Параметры спрайта background.

Теперь во вкладке Layers (Слои), на слое с названием background, кликните на изображение замка. Смотрите рис. 24. Из зеленого он перекрасится в серый цвет — это означает, что теперь вы не сможете выделить спрайты, находящиеся на этом слое, пока не выключите блокировку. Эта очень полезная опция, которая предотвращает случайное выделение объектов, стоящих на заднем плане.

Рис. 24 — Включение режима блокировки слоя.

Добавление анимации для главного героя

Пришло время добавить в игру главного героя. Скачайте архив с анимацией персонажа по этой ссылке — character.zip. Распаковав архив, внутри вы обнаружите 4 папки с анимацией.

1. Папка standing — стойка.
2. Папка moving — бег.
3. Папка jumping — прыжок.
4. Папка falling — падение.

Для начала загрузим анимацию стойки. Для этого вернитесь к слою scenery (выделив его) и создайте в Layout Editor (Редактор Уровня) новый объект спрайт. В Picture Editor (Редактор изображений) загрузите кадр анимации с именем frame01 из папки standing. Переименуйте спрайт в character и переместите его поближе к спрайту basis.
Далее переходим на панель в правой части экрана и внизу выбираем вкладку Animator (Анимация). На панели отобразится список анимаций. Смотрите рис. 25.

Рис. 25 — Анимации.

По умолчанию там только одна анимация default. Выделите ее, кликнув по названию, и на панели слева в свойствах анимации, напротив Animation name (Имя анимации) впишите standing. Смотрите рис. 26.

Рис. 26 — Animation name (Имя анимации).

Теперь давайте добавим анимацию бега. Возвращаемся на панель анимаций и кликаем ПКМ по названию анимации standing, откроется список команд, среди которых нам нужно выбрать Add new animation (Добавить новую анимацию). Смотрите рис. 27.

Рис. 27 — Add new animation (Добавить новую анимацию).

В списке анимаций добавится новая анимация с названием Animation 1, в свойствах переименовываем ее в moving. Далее на панели анимации кликаем под ней ЛКМ на закрученную стрелку с надписью Angle: 0* (Right) (Угол: 0* (Право)). Мы увидим, что в нижнем окне появился один пустой кадр. Смотрите рис. 28.

Рис. 28 — Анимация moving.

Рядом с пустым кадром нажимаем ПКМ и в открывшемся списке выбираем команду Import frames (Импортировать кадры). Смотрите рис. 29.

Рис. 29 — Import frames (Импортировать кадры).

Через открывшийся проводник находим скачанную папку character и в ней папку moving. Выделяем все кадры (все 16 файлов) и нажимаем Открыть. Появится окно с названием Import frames (Импортировать кадры), в котором должны быть загружены все 16 кадров анимации. Смотрите рис. 30.

Рис. 30 — Import frames (Импортировать кадры).

Нажимаем внизу Import (Импортировать), и в нижнем окне добавятся кадры анимации бега, среди которых остался один пустой кадр — его обязательно нужно удалить! Выделите пустой кадр и нажмите Delete на клавиатуре. Смотрите рис. 31.

Рис. 31 — Удаление пустого кадра.

Тем же путем добавьте еще 2 анимации — jumping и falling. Изображения для них лежат в соответствующих папках. Будьте внимательны: у анимации прыжка всего 1 кадр, а у падения — 3. Название анимаций должно соответствовать названиям папок. Также не забывайте удалять пустой кадр. Если его не удалить, то анимация в игре будет отображаться некорректно.

Если вы ничего не напутали, в итоге у вас должно получится в точности как на рис. 32.

Рис. 32 — Добавлено две новых анимации jumping и falling.

После этого переходим к главной части — создание событий.

События для главного героя

Для создания событий, в самом низу программы, кликните ЛКМ на вкладке Event Sheet Editor (Редактор событий). Смотрите рис. 33.

Рис. 33 — Event Sheet Editor (Редактор событий).

Поле со спрайтами исчезнет, и вместо него появится пустая страница. В центре этой страницы кликните ПКМ и в открывшемся списке команд выберите Insert group (Вставить группу). Смотрите рис. 34.

Рис. 34 — Insert group (Вставить группу).

Появится окно Modify Event Group (Редактировать Группу Событий). Напротив Title (Название) укажите название группы — Character, а напротив Description (Описание) вы можете написать небольшое описание для группы, например, События для главного героя. Смотрите рис. 35.

Рис. 35 — Modify Event Group (Редактировать Группу Событий).

Кликните по кнопке OK, и на странице появится новая группа с названием Character. Именно в ней мы и будем создавать все события, связанные с персонажем.

Но сначала, давайте поговорим о том, что же такое события и какие виды событий бывают?

Events (События) — это визуальный способ определения того, как игра или приложение должны работать, в отличие от языков программирования, где вам требуется писать длинные строчки кода.

Каждое событие состоит из двух частей: Condition (Условие) и Action (Действие). Условие всегда расположено в левой колонке, оно определяет задачу, условие, при котором должно выполниться действие (например, Всегда, Только один раз, Когда спрайт столкнулся с врагом и т.д.). Действие всегда располагается в правой колонке и определяет, что конкретно должно произойти при определенном условии (например, Объект уничтожится, Переместится и т.д.). В одном событии могут быть несколько смежных условий. Смотрите рис. 36.

Sub-events (Под-события) используются как для организации событий, так и для того, чтобы логически запускать события только после того, как запустились другие события.

Рис. 36 — Схема вариантов Событий.

Следует учитывать, что в одном событии может быть множество условий, действий и под-событий. Все зависит от конкретной задачи.

Прежде чем создать событие, нужно определить задачу, которую мы перед собой ставим, а именно — у нас есть спрайт главного героя с именем character и спрайт basis, к которому применено поведение Platform (Платформер). Нам нужно, чтобы спрайт персонажа всегда был привязан к спрайту basis, для этого создадим следующие событие: в группе Character кликните ЛКМ на красной надписи New event to: Character (Новое событие для: Персонажа). Смотрите рис. 37.

Рис. 37 — Создание нового события.

Откроется окно New condition (Новое условие), где изображены все доступные объекты. Выберите объект System (Система) и нажмите Next (Далее). Смотрите рис. 38.

Рис. 38 — Окно New condition (Новое условие).

Откроется список с условиями для объекта системы, среди них выберите условие Always (Всегда) и нажмите кнопку Finish. Смотрите рис. 39.

Рис. 39 — Conditions for 'System' (Условия для объекта 'System').

После этого в Event Sheet Editor (Редакторе событий), в группе Character появится созданное нами условие. Смотрите рис. 40.

Рис. 40 — Условие.

Далее для этого условия нам нужно создать действие. Напротив условия Always (Всегда) кликните на красной надписи New action (Новое действие), откроется окно New action (Новое действие), где изображены доступные объекты. Выберите спрайт главного героя character и жмите Next (Далее). Смотрите рис. 41.

Рис. 41 — Окно New action.

Откроется список доступных для этого объекта действий, в котором вам нужно выбрать действие Set position to another object (Установить позицию относительно другого объекта) и нажать Next (Далее). Смотрите рис. 42.

Рис. 42 — Actions for 'character' (Действия для объекта 'character').

Далее в появившемся окне нажмите на большую кнопку с надписью Pick an Object (Указать объект). Смотрите рис. 43.

Рис. 43 — Object to set position to (Объект, относительно которого установить позицию).

Откроется новое окно Select object (Выбрать объект), где вам нужно указать к какому конкретно объекту будет привязан спрайт главного героя. Следовательно выбираем спрайт basis. Смотрите рис. 44.

Рис. 44 — Select object (Выберите объект).

Жмем ОК и затем Finish. Если вы все сделали правильно, то у вас должно получится точно такое же событие, как на рис. 45.

Рис. 45 — События группы Character.

Итак, вы создали первое событие, в котором персонаж всегда привязан к спрайту basis. Проверить, работает ли оно, можно запустив игру — в самом верху на главной панели команд во вкладке Project (Проект) нажмите на большую кнопку Run layout (Запустить уровень). Смотрите рис. 46.

Рис. 46 — Run layout (Запустить уровень).

Если вы не включали в свойствах параметр Fullscreen (Полный экран), то игра запустится в оконном режиме, и вы сможете наблюдать за количеством FPS и загруженностью видеопамяти VRAM. Смотрите рис. 47 (масштаб изображения уменьшен на 50%).

Рис. 47 — Игра в оконном режиме.

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

Закройте игру (если вы находитесь в полноэкранном режиме, то для выхода из игры нажмите Alt+F4, перейдите в Layout Editor (Редактор уровня) и добавьте новый объект Mouse & Keyboard (Мышь и Клавиатура). Объект должен появится на панели Objects (Объекты) в списке рядом с другими объектами. Смотрите рис. 48.

Рис. 48 — Список объектов.

Теперь создадим событие, при котором наш персонаж сможет поворачиваться строго в ту сторону, в которую мы движемся. Для этого возвращаемся обратно в Event Sheet Editor (Редактор событий) и создаем новое условие — кликаем ЛКМ по надписи New event to: Character (Добавить новое событие) и в открывшемся окне выбираем объект Mouse & Keyboard (Мышь и Клавиатура). Далее ищем строку Key is down? (Клавиша зажата), кликаем на нее и в списке выбираем клавишу Left arrow (Стрелка влево). Смотрите рис. 49.

Рис. 49 — Key to check if down (Зажата ли клавиша).

Жмем Finish (Завершить), и у нас появляется новое условие. Напротив него создаем действие кликнув ЛКМ по надписи New action (Новое действие). В открывшемся окне выбираем спрайт персонажа, далее ищем строку Set angle (Задать угол), кликаем на ней и переходим дальше. В следующем окне мы видим поле для ввода текста со значением 0 — это значение угла. Вверху есть подсказка, в которой написано New angle, in degrees 0-360 (Новый угол, в градусах 0-360). Смотрите рис. 50.

Рис. 50 — Set angle (Задать угол).

Нашей задачей сейчас является создание события, в котором при нажатии на клавишу стрелки влево (на клавиатуре) наш персонаж поворачивался бы в этом же направлении. Это можно сделать, поняв один простой принцип — дело в том, что в программе Construct каждый спрайт по умолчанию имеет значение угла равное 0, при этом само направление угла смотрит вправо. Смотрите рис. 51.

Рис. 51 — Схема направлений угла (0-360 градусов).

Поэтому для того, чтобы при движении влево персонаж смотрел в этом направлении, нам нужно вместо 0 вписать значение 180. Нажимаем Finish, и у вас должно получится так же, как на рисунке 52.

Рис. 52 — События группы Character.

Теперь создайте еще одно точно такое же событие, только в условии вместо клавиши Left arrow (Стрелка влево), выберите Right arrow (Стрелка вправо), а в действии вместо 180 градусов, укажите 0. В итоге у вас должно получится как на рис. 53.

Рис. 53 — События группы Character.

Примечание: вам необязательно создавать событие заново, достаточно скопировать его, перетащив ЛКМ и удерживая клавишу Control. А затем просто изменить в нем необходимые параметры (кликая 2 раза ЛКМ по надписям в событии).

Теперь, когда мы будем двигать героя вправо, его взгляд тоже будет направлен в правую сторону, но, если вы сейчас запустите игру и нажмете стрелку влево, то увидите ошибку! Персонаж будет менять направление, но при этом сам будет переворачиваться вверх тормашками, потому что мы создали событие, в котором мы переворачиваем нашего персонажа на 180 градусов. Для того, чтобы спрайт отображался корректно, перейдите в Layout Editor (Редактор уровня), выделите персонажа и в его свойствах найдите вкладку Angle (Угол) и установите галочку напротив опции Auto mirror (Автоматическое отражение). Смотрите рис. 54.

Рис. 54 — Auto mirror (Автоматическое отражение).

Теперь запустите игру и нажмите стрелку влево — спрайт персонажа отразится в противоположном направлении. Смотрите рис. 55.

Рис. 55 — Движение влево.

Примечание: у данного метода есть один недостаток, из-за того, что мы включаем отражение, при смене направления происходит отражение рисунка и некоторые детали могут выглядеть не вполне правильно. Это хорошо заметно на логотипе Construct, который располагается на груди персонажа. Когда мы двигаемся вправо, то шестеренка выглядит корректно, а когда влево — она отражается, и логотип повернут в противоположную сторону. Поэтому данный способ лучше применять на персонажах, чье тело симметрично и при отражении выглядит одинаково во всех направлениях. В данном случае выход тоже имеется — создать дополнительные кадры, в которых персонаж имеет заранее отрисованную анимацию в двух направлениях. Но тогда следует учитывать, что количество анимаций будет увеличено вдвое, и это может отрицательно сказаться на производительности игр, где присутствует большое количество объектов.

Далее нам нужно оживить персонажа, чтобы при движении у него воспроизводилась анимация. Для этого перейдите в Event Sheet Editor (Редактор событий) и в группе Character создайте новое событие, в окне New condition (Новое условие) выберите спрайт basis, далее перейдите во вкладку Platform и в списке условий выберите Is on ground (На земле) и Finish (Завершить). Смотрите рис. 56.

Рис. 56 — Вкладка Platform.

Теперь добавим под-событие — на созданном вами событии кликните ПКМ на надписи Is on ground и в открывшемся списке выберите команду Insert sub-event (Вставить под-событие). Смотрите рис. 57.

Рис. 57 — Insert sub-event (Вставить под-событие).

В списке объектов снова выберите спрайт basis и, зайдя во вкладку Platform, выберите команду Is moving (Движется). В итоге у вас должны получиться событие и под-событие. Смотрите рис. 58.

Рис. 58 — Событие и под-событие.

Теперь напротив под-события создайте действие — выберите персонажа, затем найдите действие Set animation (Установить анимацию), в поле ввода с заголовком Name (Имя) впишите в кавычках (' ') имя анимации, которая должна воспроизводиться при движении персонажа (в данном случае анимация 'moving'). Смотрите рис. 59.

Рис. 59 — Set animation (Установить анимацию).

Теперь удерживая Control, скопируйте под-событие еще раз. Затем на условии Is moving (Движется) нажмите ПКМ и в открывшемся списке выберите команду Invert condition (Инвертировать условие). Смотрите рис. 60.

Рис. 60 — Invert condition (Инвертировать условие).

Напротив инвертированного условия нам нужно немного подкорректировать действие. В строке Set animation to (Установить анимацию) кликаем ЛКМ по надписи 'moving' и вместо нее вписываем другую анимацию с названием 'standing', нажимаем Enter. Смотрите рис. 61.

Рис. 61 — Редактирование действия Set animation (Установить анимацию).

Итак, мы создали событие, в котором есть еще два параллельных под-события. В первом мы задали условие, что когда персонаж движется, то воспроизводится анимация бега. Во втором под-событии мы инвертировали условие и получилось, что когда главный герой стоит на месте (не движется) — воспроизводится анимация стойки.
Запустите игру и, нажимая на клавиатуре стрелки влево и вправо, побегайте персонажем. При движении будет воспроизводиться анимация бега (смотрите рис. 62), а при отсутствии движения персонаж будет становится в стойку.

Рис. 62 — Анимация бега.

Управляя героем, вы наверняка заметили, что анимация бега воспроизводится чересчур быстро. Дело в том, что по умолчанию скорость воспроизведения каждой анимации составляет 50 кадров в секунду. А анимация бега, которую мы загрузили была нарисована для 24-х кадров.
Чтобы изменить скорость воспроизведения анимации перейдите в Layout Editor (Редактор Уровня), выберите персонажа и справа на панели управления анимацией, под строкой moving, кликните ЛКМ мыши на закрученную стрелку с надписью Angle: 0* (Right), чтобы выделить анимацию. Смотрите рис. 63.

Рис. 63 — Анимация moving.

Дальше слева на панели свойств напротив Animation speed (Скорость анимации) установите значение 24. Смотрите рис. 64.

Рис. 64 — Animation speed (Скорость анимации).

Запустите игру и проверьте анимацию. Сейчас скорость воспроизведения анимации соответствует скорости движения персонажа. Нам осталось включить еще 2 анимации — прыжок и падение.

Для включение прыжка перейдите в редактор событий и в группе Character создайте новое событие. В списке объектов выберите basis, далее вкладка Platform и выберите там условие is jumping (Прыгает). В действии назначьте анимацию jumping.

Потом скопируйте созданное вами событие и, щелкнув 2 раза ЛКМ по условию is jumping (Прыгает), поменяйте его на команду is falling (Падает), а в действии замените название анимации 'jumping' на 'falling'. В итоге у вас должно получится как на рис. 65.

Рис. 65 — События персонажа.

Запустите игру и нажмите клавишу Shift на клавиатуре. Если вы все сделали правильно, то во время прыжка вы увидите, как включится анимация jumping, а при падении она сменится анимацией falling. При падении видно, что персонаж начнет дергаться — чтобы исправить эту ошибку перейдите в редактор уровня и измените скорость воспроизведения анимации falling на 24 кадра в секунду. Также в свойствах анимации следует снять галочку с опции Loop (Зацикленный). Эта опция нужна, чтобы анимация воспроизводилась по кругу, но в нашем случае при падении анимация должна проигрываться только один раз. Смотрите рис. 66.

Рис. 66 — Свойства анимации falling.

Снова запустите игру и попробуйте попрыгать. При падении анимация должна отображаться корректно (без каких-либо дерганий). Смотрите рис. 67.

Рис. 67 — Анимация jumping и falling.

Внимание! Если при запуске игры у вас некорректно работает анимация — проверьте, совпадает ли имя анимации в свойствах и событиях.

Примечание: если стоя на платформе, зажать стрелку вниз и не отпуская ее, нажать клавишу Shift, то персонаж провалится вниз. Это не ошибка! а особенность включенного вами атрибута Platform в свойствах объекта platforma01. Данная опция позволяет вашему герою спрыгнуть на платформу ниже, как это было в классических платформенных играх. Если в вашей игре персонаж не должен иметь способности прыгать сквозь платформы — тогда в свойствах, во вкладке Attributes (Атрибуты) вам следует снять галочку Platform, а вместо нее включить опцию Solid (Твердый).

Итак, у нас есть действующий персонаж со всеми включенными анимациями. Теперь давайте добавим в игру монеты и сделаем интерфейс с подсчетом очков и жизней. Скачайте архив с изображениями монеты — money.zip, затем перейдите в Layout Editor (Редактор уровня) и на слое с названием scenery создайте новый спрайт. Загрузите в него все 15 кадров анимации монеты из скачанного архива и переименуйте спрайт в money. Затем в свойствах анимации установите скорость воспроизведения 24 кадра. Переместите монету вправо, над второй платформой, и раскопируйте ее в виде пирамиды как на рис. 68 (масштаб изображения уменьшен на 50%).

Рис. 68 — Монеты.

Дальше нам нужно добавить событие, в котором персонаж будет собирать монеты, и за каждую взятую монету нам будет прибавляться по 100 очков. Но прежде нужно создать переменную, которая будет считать сумму собранных нами монет.

Для нашей задачи мы будем использовать глобальную переменную. Чтобы ее создать, кликните на вкладке Project (Проект), которая расположена в правом нижнем углу программы. Смотрите рис. 69.

Рис. 69 — Вкладка Project (Проект).

Далее в списке ресурсов найдите папку Global variables (Глобальные переменные), кликните на ней ПКМ и нажмите на Add global variable (Добавить глобальную переменную). Смотрите рис. 70.

Рис. 70 — Папка Global variables (Глобальные переменные).

На экране появится новое окно с названием Add global variable (Добавить глобальную переменную). В поле Name (Имя) впишите score и нажмите ОК. Смотрите рис. 71.

Рис. 71 — Add global variable (Добавить глобальную переменную).

Под папкой Global variables (Глобальные переменные) появится строка с названием вашей глобальной переменной. Смотрите рис. 72. При взятии монет ее значение будет увеличиваться и сохраняться на протяжении всей игры.

Рис. 72 — Переменная 'score'.

Перейдите в редактор событий и в группе Character создайте новое событие. В открывшемся окне выберите спрайт basis, затем в списке условий кликните на On collision with another object (При столкновении с другим объектом), далее нажмите на кнопку Pick object (Указать объект) и выберите спрайт money.
Не создавая действия на это событие, добавьте под-событие, выберите объект System (Система) и в списке команд нажмите For Each Object (ordered) (Для каждого объекта (упорядоченно)), затем кликните на кнопке Pick object (Указать объект) и выберите спрайт money. В созданном вами под-событии добавим действие — выбираем спрайт money, и выбираем действие Destroy (Уничтожить). Далее в этом же под-событии создаем еще одно действие — выберите объект System (Система) и в списке найдите команду Add to value (Добавить к значению), откроется окно, где в поле Variable (Переменная) нужно выбрать имя глобальной переменной score, а в поле Value (Значение) указать количество прибавляемых очков (например, 100). Смотрите рис. 73.

Рис. 73 — Value to add (Добавить значение).

Если вы сделали все правильно, то должно получится точно такое же событие, как на рис. 74.

Рис. 74 — Событие для спрайта money.

Мы создали событие, что когда персонаж касается монет, то они удаляются и за каждую из них прибавляется 100 очков.

Теперь давайте сделаем интерфейс, на котором будут отображаться жизни персонажа и количество заработанных им очков. Перейдите в Layout Editor (Редактор уровня) и на панели Layers (Слои) выделите слой с названием scenery, нажав на зеленую стрелку с направлением вверх, создайте новый слой. Далее в свойствах впишите имя слоя interface, а ниже во вкладке Display (Отображение) напротив опций Scroll X Rate (Скорость прокрутки по X) и Scroll Y Rate (Скорость прокрутки по Y) вместо 100% впишите значение 0.
Значение 0 нужно для того, чтобы слой, на котором расположен интерфейс, не прокручивался за уровнем и всегда стоял на месте.

Примечание: с помощью Scroll X Rate (Скорость прокрутки по X) и Scroll Y Rate (Скорость прокрутки по X) можно создать эффект плывущего фона, так называемый параллакс. Если к примеру поместить на фон дополнительный бэкграунд и настроить Scroll X Rate (Скорость прокрутки по X) и Scroll Y Rate (Скорость прокрутки по Y) по 50%, то при движении персонажа фон будет как бы плыть за ним.

Очень важно, чтобы слой интерфейса всегда находился в самом верху в списке слоев, так как объекты находящиеся на нем (жизни, количество очков и т.д.) должны идти поверх других объектов в игре. Смотрите рис. 75.

Рис. 75 — Список слоев.

Далее загрузите изображение lives.png, и на созданном вами слое добавьте новый спрайт. Переименуйте его в lives и поместите в левый верхний угол. Смотрите рис. 76.

Рис. 76 — Спрайт lives.

Теперь, находясь на этом же слое, кликните ПКМ на уровне и выберите Insert an object (Вставить объект), а в списке объектов найдите объект Text (Текст). Поставьте его рядом со спрайтом lives, затем зайдите в свойства и переименуйте объект в text_lives. Задайте точные координаты расположения объекта, указав напротив строки X значение 85, напротив Y значение 56. Теперь измените размер контейнера для текста указав напротив Width (Ширина) и Height (Высота) значение 30. Смотрите рис. 77.

Рис. 77 — Свойства объекта 'text_lives'.

Cпуститесь ниже и найдите вкладку Properties (Свойства), и здесь напротив Size (Размер) установите размер шрифта 34 пикселя. Затем отметьте галочки напротив Bold (Жирный) и Italics (Курсив), чтобы сделать шрифт жирным и наклонным. Далее установите позицию текста внутри самого контейнера выбрав Left (Слева) в опции Horizontal alignment (Горизонтальное выравнивание) и Top (Верх) в Vertical alignment (Вертикальное выравнивание). Осталось задать цвет текста: напротив опции Color (Цвет) щелкните на цветной прямоугольник и вам предложат выбрать цвет — в самых верхних строчка впишите параметры 255; 190; 0. Смотрите рис. 78.

Рис. 78 — Свойства текста.

Чтобы при запуске игры объект text_lives показывал нам количество жизней персонажа, нужно создать приватную переменную. Выделите спрайт главного героя и в свойствах найдите вкладку Private Variables (Приватные Переменные). Смотрите рис. 79.

Рис. 79 — Private Variables (Приватные Переменные).

Нажмите Add/Edit (Добавить/Редактировать), откроется окно Manage Private Variable (Управление приватными перемеными). Смотрите рис. 80.

Рис. 80 — Управление приватными перемеными.

В нижней части окна кликните на зеленый плюс. Откроется новое окно Add Private Variable (Добавить приватную переменную), в поле Name (Имя) впишите название lives, а в Initial value (Первоначальное значение) укажите количество жизней по умолчанию, вписав значение 3. Смотрите рис. 81.

Рис. 81 — Add Private Variable (Добавить приватную переменную).

Далее нажимаем кнопку OK, а затем Done. Приватная переменная появится в свойствах персонажа. Теперь переходим в редактор событий и в группе Character ищем событие, в котором есть условие Always (Всегда) (это было самое первое событие, которое мы создали). В нем уже есть действие, поэтому под ним кликаем ЛКМ на New action (Новое действие) и создаем еще одно действие. В списке объектов выбираем text_lives, затем действие Set text (Установить текст). В окне появится строка для ввода текста, а ниже список объектов, среди которых нам нужно выбрать спрайт Character. Щелкните по спрайту 2 раза ЛКМ, на экране появится окно New expression (Новое выражение), где вам нужно найти команду Get private variable (Получить приватную переменную). Смотрите рис. 82.

Рис. 82 — Окно New expression (Новое выражение).

Нажав Finish вы увидите, что в поле для ввода текста появилась строчка character.Value('Variable name'). Вместо Variable name (Имя значения) вам нужно вписать имя приватного значения жизней персонажа (то есть lives). Смотрите рис. 83.

Рис. 83 — Окно Set text (Установить текст).

В итоге, если вы все сделали правильно, должно получиться событие как на рис. 84.

Рис. 84.

Теперь запустите игру и проверьте — вместо буквы Т будет отображаться количество жизней персонажа. Смотрите рис. 85.

Рис. 85 — Отображение количества жизней персонажа.

На этот же слой добавьте еще один объект Text и переименуйте его в text_score, ниже задайте координаты — для X значение 600, для Y значение 56. Размер контейнера Width (Ширина) — 200, Height (Высота) — 30. Спускаемся ниже во вкладку Properties (Свойства) и настраиваем объект следующим образом: размер шрифта ставим такой же, как и у первого объекта, 34 пикселя. Также отмечаем галочки напротив Bold (Жирный) и Italics (Курсив). Ставим точно такую же позицию внутри самого контейнера выбрав Left (Слева) в опции Horizontal alignment (Горизонтальное выравнивание) и Top (Верх) в Vertical alignment (Вертикальное выравнивание). Задаем тот же цвет, установив параметр цвета на 255; 190; 0. Смотрите рис. 86.

Рис. 86 — Настройки объекта text_score.

Возвращаемся в редактор событий и под действием для объекта text_lives создаем еще одно действие. Выбираем объект text_score, далее команду Set text (Установить текст), внизу из списка объектов выбираем объект System (Система), ищем команду Get global variable (Получить глобальную переменную) и жмем Finish (Завершить). Теперь внимание! В поле для ввода текста вы увидите строку global('Variable name'), если вы сейчас вместо Variable name (Имя переменной) просто впишите имя глобального значения score и нажмете Finish (Завершить), то в игре будут отображаться лишь цифры! Но нам нужно, чтобы перед количеством очков была надпись, обозначающая, что это за цифры. Для этого перед строкой global('Variable name'), в кавычках нужно написать текст, который вы хотите увидеть перед количеством набранных вами очков (например ''Score: '' или ''Очков: ''), затем поставить амперсанд &, после которого уже идет строка global('score'). Смотрите рис. 87.

Произвольный текст может идти в любом месте, например, чтобы поставить его после количества очков, достаточно перенести текст в конец строчки, после глобальной переменной, и связать их знаком амперсанда. Получится строчка global('score') & ''очков''.

Рис. 87.

Если вы все сделали правильно, должно получиться событие, как на рис. 88.

Рис. 88.

Запустите игру и попробуйте взять пару монет. Вы увидите, что за каждую монету вам будут прибавляться по 100 очков. Смотрите рис. 89.

Рис. 89.

Создание врага

Пришло время добавить в игру врага. Скачайте архив enemy_croc.zip, разархивировав его, вы обнаружите 2 папки с анимацией врага — moving и destroyed. Перейдите в Level Editor (Редактор уровня) и на слое scenery создайте новый спрайт. Переименуйте его в enemy_croc, добавьте 2 анимации с именами moving и destroyed и загрузите в них кадры из соответствующих папок. Смотрите рис. 90.

Рис. 90 — Анимации врага.

У обоих анимаций установите скорость воспроизведения 24 кадра в секунду. У анимации destroyed в настройках снимите галочку Loop (Зацикленный), чтобы после уничтожения врага, он оставался без изменений.

Давайте оживим нашего врага.

Существует множество способов, как заставить врага двигаться вперед-назад. Например, для подобной задачи часто используются поведения Grid Movement (Движение по сетке) или Custom Movement (Пользовательское движение), но такой метод требует создание множества событий, а в некоторых случаях даже дополнительных объектов. Мы же сделаем хождение по платформе с помощью всего одного события.

Для начала поставьте спрайт врага на третью платформу на самый правый край. Смотрите рис. 91.

Рис. 91 — Расположение врага.

Потом перейдите в свойства спрайта и найдите вкладку Behaviors (Поведения), кликните ЛКМ на надписи Add (Добавить) напротив New behavior (Новое поведение). В списке поведений выберите поведение Bullet (Пуля). В свойствах, во вкладке Bullet Behavior (Поведение Пули), напротив опции Speed (Скорость) установите значение 90. Смотрите рис. 92.

Рис. 92 — Bullet Behavior (Поведение пули).

Затем ниже, во вкладке Angle (Угол), установите галочку напротив опции Auto mirror (Автоматическое отражение). Переходим к созданию событий.

Для начала создайте новую группу и назовите ее Enemy_Croc. По желанию можете написать небольшое описание для созданной группы (например, события для врага). Так как взаимодействие с врагом будет происходить лишь тогда, когда он ходит по платформе, нужно создать основное событие, которое будет включать в себя все остальные под-события, связанные с движением и взаимодействием героя с противником. В группе Enemy_Croc создаем новое событие, в списке объектов выбираем спрайт enemy_croc, далее в списке условий кликаем на An animation is playing (Проигрывается анимация), в поле ввода текста в кавычках вписываем название анимации 'moving' и жмем Finish (Завершить). У нас должно получится событие как на рисунке 93.

Рис. 93.

Теперь создаем под-событие: в списке объектов выбираем объект System (Система), кликаем на команду Every X Milliseconds (Каждые X милисекуд), в поле ввода текста вписываем значение 3500 и жмем Finish (Завершить). Далее напротив этого условия создаем действие: выбираем спрайт enemy_croc, кликаем на действие Set angle (Установить угол) и затем внизу, в списке объектов, еще раз выбираем спрайт enemy_croc. Откроется окно, где нужно выбрать команду Get angle (Получить угол), и в поле ввода текста появится строка enemy_croc.Angle (т.е. угол врага), к ней нужно добавить +180 (плюс сто восемьдесят), чтобы получилось как на рисунке 94.

Рис. 94.

Жмем Finish, и в итоге должно получиться событие как на рисунке 95.

Рис. 95.

Итак, если помните, мы назначили врагу поведение пули, которая летит всегда прямо в направлении угла 0. То есть, если перевернуть угол, то и направление врага тоже изменится. Поэтому мы создали событие, где задали, что каждые 3500 миллисекунд (1000 миллисекунд = 1 секунда), к углу персонажа прибавляется +180 градусов, а так как по умолчанию его угол равен 0 — получается, что каждые 3,5 секунды он будет отражаться и идти в обратном направлении. Запустите игру и убедитесь, что враг ходит по платформе от одного края к другому и обратно.

Осталось лишь создать события для взаимодействия нашего героя с врагом.

Существует множество различных вариантов взаимодействия героя с врагом. Мы рассмотрим классический пример, когда персонаж уничтожает врага прыгая на него сверху, а при подходе и касании врага с любой стороны — герой теряет жизнь и его отбрасывает чуть в сторону. Помните, что все последующие события взаимодействия персонажа с врагом будут создаваться под основным событием, которое мы добавили выше. Приступим: создайте новое под-событие, в списке объектов выберите объект basis, далее выберите условие On collision with another object (При столкновении с другим объектом), кликните на большой кнопке Pick an object (Указать объект) и укажите спрайт enemy_croc. Убедитесь, что созданное вами событие совпадает с рис. 96.

Рис. 96.

Затем для этого под-события создаем еще под-событие: в списке объектов выбираем объект basis, далее вкладку Platform и команду Is on ground (На земле). Для этого под-события создаем еще одно под-событие — выбираем спрайт character, команду Compare angle (Сравнить угол) и, ничего не меняя, жмем Finish (Завершить). Для только что созданного под-события нужно создать еще под-событие — в списке объектов выбираем объект System (Система), далее команду Trigger once while true (Выполнить один раз, если правда). А теперь напротив этого под-события создаем 2 действия.

Первое действие: в списке объектов выберите объект basis, затем вкладку Platform и далее команду Set X component of motion (Задать X компонент движения). В поле ввода текста введите значение –1000 (минус тысяча) и жмите Finish.

Второе действие: в списке объектов выберите спрайт character, затем команду Subtract from value (Вычесть из значения), и в поле ввода текста для приватного значения lives впишите значение 1.

Таким образом мы создали цепочку событий, состоящих из четырех условий, которые в свою очередь образуют одно глобальное условие, и звучит оно так: когда персонаж сталкивается с врагом и при этом стоит на земле (не в прыжке и не в падении), то, если угол нашего героя равен 0, выполнить один раз 2 действия — персонаж отлетает от противника, и у него вычитается 1 жизнь.

Если вы все сделали правильно, то у вас должно получится событие с под-событиями как на рисунке 97.

Рис. 97.

Теперь нужно создать точно такие же действия, но для другого угла и, соответственно, отлетать от врага персонаж должен в другую сторону. Для этого, используя Control, скопируйте под-событие character: Angle Equal to (на рис. 97 это событие номер 15) и измените в условии угол на 180 градусов, кликнув 2 раза ЛКМ по цифре 0. Далее внесите изменения в действие basis: Set horizontal speed to, кликнув 2 раза ЛКМ по значению –1000, и замените его на положительное значение 1000 (без минуса). Смотрите рис. 98.

Рис. 98.

Пришло время реализовать механизм уничтожения врага. Для этого кликните ПКМ на под-событии с условием On collision between basis and enemy_croc (на рис. 98 это событие номер 13) и, используя команду Insert sub-event (Добавить под-событие), создайте новое под-событие. В списке объектов выберите спрайт basis, во вкладке Platform выберите команду Is falling (Падает). Далее для этого же под-события создайте еще одно под-событие. Выберите объект System (Система), нажмите команду Trigger once while true (Выполнить один раз, если правда). Переходим к созданию действий.

Первое действие: в списке объектов выберите спрайт enemy_croc, далее найдите вверху вкладку Bullet (Пуля) и в ней нажмите на действие Set activated (Активировать). Появится окно, где под надписью Activation (Активация) в списке выберите Deactivate (Деактивировать) и нажмите Finish (Завершить).

Второе действие: в списке объектов выберите спрайт enemy_croc, далее нажмите на команду Set animation (Установить анимацию) и в поле ввода в кавычках впишите имя анимации 'destroyed'.

Третье действие: в списке объектов выберите спрайт basis, во вкладке Platform нажмите команду Jump (Прыгать).

Четвертое действие: в списке объектов выберите объект System (Система), далее команду Add to value (Добавить к значению), в открывающемся списке под надписью Variable (Переменная) выберите созданное нами ранее глобальное значение score, и в поле ввода текста впишите значение 1000.

Итак. Мы создали под-событие, в котором мы есть условие, что при падении один раз совершаются 4 действия — происходит полная остановка врага, включается его анимация разрушения, в это же время наш персонаж отпрыгивает от врага и получает дополнительные 1000 очков. Если вы ничего не перепутали, в итоге должно получиться вот такое сложное событие как на рис. 99.

Рис. 99.

Запустите игру и первым делом попробуйте подойти к врагу — он должен отпихнуть вас в сторону или даже сбросить с платформы, при этом вы потеряете одну жизнь. Если вы прыгните на врага сверху, то он развалится, а вы отскочите вверх.

Переход на новый уровень

После того, как игрок собрал все монеты и уничтожил врага, ему предоставляется возможность перейти на новый уровень. Скачайте изображение next.png, затем на слое scenery создайте новый спрайт. Загрузите в него это изображение и переименуйте спрайт как next. Затем на панели анимации рядом с первым кадром кликните ПКМ и в открывшемся меню выберите команду Add frame (Добавить кадр). Смотрите рис. 102.

Рис. 102.

Вы увидите, что рядом с первым кадром анимации появится новый пустой кадр. Смотрите рис. 103.

Рис. 103.

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

Рис. 104.

В свойствах спрайта найдите вкладку Appearance (Появление) и установите галочку напротив опции Invisible on start (Невидимый при старте). Это нужно для того, чтобы при запуске игры стрелка не была видна, она должна появляться лишь после того. как мы соберем все монеты и уничтожим врага.

Для создания события перейдите в редактор событий и в самом низу создайте новую группу Level Events. В этой группе добавьте новое событие: выберите объект System (Система), далее команду Compare global variable (Сравнить глобальную переменную). Откроется окно, в котором под надписью Variable (Переменная) в списке выберите глобальное значение score, а под надписью Comparison (Сравнение) в активном списке выберите Greater or equal (Больше или равно), в поле ввода текста впишите значение 1900. Смотрите рис. 105.

Рис. 105.

Теперь создайте действие: в списке объектов выберите спрайт next, затем команду Set visible (Установить видимость), далее в окне под надписью Visibility (Видимость) в активном списке выберите Visible (Видимый). У вас должно получится событие как на рис. 106.

Рис. 106.

Мы создали событие, которое работает следующим образом: когда наш герой собирает все монеты (всего 9 монет по 100 очков каждая) и уничтожает врага (за уничтожение врага герой зарабатывает 1000 очков), он набирает 1900 очков, и табличка next становится видимой.

Прежде чем создать событие перехода на новый уровень, нам необходимо создать этот самый уровень. Существует 2 способа создания нового уровня.

Способ первый: в правой нижней части окна интерфейса кликните на вкладку Project (Проект) — появится список ресурсов. В самом верху, кликните ПКМ по названию проекта (в данном случае проект называется Quickstart) или на папке Layouts (Уровни), откроется всплывающее меню, где нужно выбрать команду Add layout (Добавить уровень). Смотрите рис. 107.

Рис. 107 — Add layout (Добавить уровень).

Так вы создадите новый, совершенно пустой, уровень, который появится в списке ресурсов в папке Layouts (Уровни) с именем Layout 2 (Уровень 2). В нем вы можете либо заново создать объекты, либо скопировать их с предыдущего уровня. Но в таком случае не стоит забывать, что при изменении свойств объекта на созданном вами уровне это отразится и на других уровнях, где присутствует объект. Если, к примеру, на следующем уровне вы хотите изменить поведение вашего персонажа, то лучше создать спрайт заново или клонировать, а иначе любое изменение отразится на всех спрайтах героя на других уровнях.
Этот способ лучше всего подходит для создания меню, экрана Game Over, титров и т.д.

Способ второй: во вкладке Project (Проект) в списке ресурсов раскройте папку Layouts (Уровни), кликните ПКМ на названии вашего уровня (в данном случае Layout 1), и в появившемся всплывающем меню выберите команду Clone layout (Клонировать уровень). Смотрите рис. 108.

Рис. 108 — Clone layout (Клонировать уровень).

В списке ресурсов в папке Layouts (Уровни) появится новый Layout 2 (Уровень 2). Таким образом вы создадите точную копию первого уровня. Следует учитывать, что как и в первом способе, изменение свойств объекта на новом уровне может отразиться на копиях на других уровнях. Однако, данный способ лучше всего подходит для создания уровней, так как можно, не создавая объекты и события заново, просто изменить их местоположение и таким образом получится совершенно другой уровень.

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

Итак, для создания события перейдите в редактор событий и в группе Level Events создайте следующие событие: в списке объектов выберите спрайт next, далее команду Is visible? (Видимый). Теперь создайте под-событие: выберите спрайт character, далее команду On collision with another object (При столкновении с другим объектом) и в появившемся окне кликните на кнопке Pick an object (Указать объект), укажите спрайт next, нажмите OK и Finish. Напротив созданного условия добавляем следующее действие: выберите объект System (Система), далее команду Next layout (Следующий уровень), откроется окно, где ничего менять не надо, и просто нажимаем Finish.

Таким образом, мы создали событие со следующим условием: когда табличка видна в сцене и когда наш персонаж касается ее, выполняется действие — мы переходим на следующий уровень. У вас должно получится событие как на рис. 109.

Рис. 109.

Осталось лишь добавить событие, что когда у персонажа заканчиваются жизни — игра закрывается (ну или вы можете самостоятельно сделать переход на новый Layout (Уровень) с экраном Game Over (Конец игры)). Итак, в группе Character создайте новое событие: в списке объектов выберите спрайт character, затем команду Compare a private variable (Сравнить приватную переменную), далее в списке должно быть выбрано приватное значение lives, теперь под надписью Comparison (Сравнение) в активном списке выберите Less than (Меньше чем), а в поле ввода текста оставьте значение 0. Переходим к созданию действия: в списке объектов выберите объект System (Система), далее команду Close (Закрыть). Таким образом, как только у главного героя закончаться жизни (меньше нуля), игра закроется. Сравните событие с рисунком 110.

Запустите игру. Теперь, когда вы соберете все монеты и уничтожите врага, появится табличка next, коснувшись которой, вы перейдете на следующий уровень. Если персонаж потеряет все жизни — игра закроется.

Рис. 110.

Звуки и музыка

Давайте добавим в игру музыку и звуки. Для начала скачайте архив sounds.zip, в котором содержатся все музыкальные файлы для данной игры. Затем в Layout Editor (Редактор уровня) добавьте новый объект, который называется Xaudio2 — он появится в списке объектов сцены. Смотрите рис. 111.

Рис. 111 — XAudio2.

Прежде чем создавать события для звуков и музыки, нужно загрузить все аудиофайлы в игру. Для этого во вкладке Project (Проект), в списке ресурсов нажмите ПКМ на папке Files (Файлы) — появится команда Add file(s) (Добавить файл(ы)). Смотрите рис. 112.

Рис. 112 — Add file(s) (Добавить файл(ы)).

Кликните по ней, и откроется проводник, в котором вам нужно выделить все музыкальные файлы в заранее скачанной папке sounds. В ресурсах отобразится список загруженных файлов. Смотрите рис. 113.

Рис. 113 — Список загруженных аудиофайлов.

Переходим к созданию событий. Создайте новую группу и назовите ее Sounds and Music. Добавьте следующие событие: в списке объектов выберите спрайт basis, далее вкладку Platform и в ней команду Is jumping (Прыгает). Затем создайте под-событие: выберите объект System (Система), далее команду Trigger once while true (Выполнить один раз, если правда). Теперь создаем действие: выбираем объект Xaudio2, далее команду Autoplay resource (Автопроигрывание ресурса) — откроется окно, в котором под надписью Resource to load (Ресурс, который нужно загрузить) в активном списке выберите файл с названием jump.wav и нажмите Finish. У вас должно получиться событие как на рис. 114.

Рис. 114.

Запустите игру и попробуйте попрыгать, нажимая клавишу Shift. Каждый раз при прыжке вы будете слышать звук. Теперь скопируйте это событие целиком и измените условие Is jumping (Прыгает) на Is on ground (На земле), а в действии кликнув 2 раза ЛКМ по строке jump.wav замените его на звук ground.wav. Должно получиться событие как на рис. 115.

Рис. 115.

Мы добавили звук соприкосновения персонажа с платформой. Теперь добавим звук собирания монет: скопируйте событие еще раз и замените условие Is jumping (Прыгает) на On collision with another object (При столкновении с другим объектом), далее кликните на кнопке Pick an object (Указать объект) и выберите спрайт money. Теперь поменяйте в действии звук ground.wav на звук money.wav. Должно получиться событие как на рис. 116.

Рис. 116.

Давайте создадим событие, чтобы озвучить уничтожение врага — выбираем спрайт enemy_croc, далее команду An animation is playing (Проигрывается анимация), в поле ввода текста вписываем имя анимации "destroyed". Создаем под-событие: в списке выберите объект System (Система), далее команду Trigger once while true (Выполнить один раз, если правда). Создаем действие: выбираем объект XAudio2, далее команду Autoplay resource (Автопроигрывание ресурса) и в окне выбора ресурса выбираем файл с названием destroy.wav, нажимаем Finish. Скопируйте это действие еще раз и измените destroy.wav на другой музыкальный файл с именем blow.wav. Таким образом, мы поставили 2 звуковых файла в одном событии, чтобы в момент, когда главный герой прыгнул на врага сверху, мы услышали звук удара и затем звук разрушения врага. У вас должно получиться событие как на рис. 117.

Рис. 117.

Скопируйте событие целиком и удалите одно действие — XAudio2: Autoplay resource ''destroy.wav'' (No loop), выделив его и нажав клавишу Delete на клавиатуре. Далее в условии замените имя анимации ''destroyed'' на ''moving''. Теперь не удаляя под-событие Trigger once (Выполнить один раз, если правда), создайте новое под-событие: выберите спрайт basis, далее команду On collision with another object (При столкновении с другим объектом) и, кликнув по кнопке Pick an object (Указать объект), выберите спрайт enemy_croc. Созданное вами новое под-событие скорее всего окажется в самом низу, поэтому выделив его и зажав ЛКМ, переместите его между событиями enemy_croc: Animation ''moving'' is playing и Trigger once, чтобы в итоге у вас получилось так же, как на рис. 118.

Рис. 118.

Теперь, если вы подойдете к противнику сбоку, он оттолкнет вашего персонажа с соответствующим звуком.

Давайте создадим событие для стрелки: выберите спрайт next, далее условие Object is on-screen? (Объект на экране?). Затем создаем под-событие: так же выбираем спрайт next, далее условие Is visible? (Видимый ли?). Добавим еще под-событие: выбираем спрайт next еще раз, затем команду Compare animation frame (Сравнить кадр анимации) и в поле ввода текста ставим значение 1, жмем Finish. Далее создаем еще одно под-событие: в списке выбираем объект System (Система), далее команду Trigger once while true (Выполнить один раз, если правда). Напротив добавляем действие: выбираем объект XAudio2, далее команду Autoplay resource (Автопроигрывание ресурса) и в активной вкладке выбираем signal.wav, жмем Finish. В итоге у вас должно получиться событие как на рис. 119.

Рис. 119.

Запустите игру и проверьте — после того, как вы соберете все монеты и уничтожите врага, появится табличка, и вы услышите периодически повторяющийся сигнал, но если вы отдалитесь от таблички, и она окажется за экраном — то звук исчезнет! За это отвечает событие Object is on-screen? (Объект на экране?).

Теперь создадим событие посложнее. Чтобы сделать озвучку для шагов главного героя, создаем новое событие: выбираем спрайт character, далее условие An animation is playing (Анимация проигрывается), в поле ввода текста вписываем имя анимации "moving".
Далее создаем под-событие: еще раз выбираем спрайт character, затем команду Compare animation frame (Сравнить кадр анимации) и в поле ввода текста ставим значение 6, жмем Finish.
Создаем еще одно под-событие: в списке выбираем объект System (Система), далее команду Trigger once while true (Выполнить один раз, если правда). Теперь создаем действие: выбираем объект XAudio2, далее команду Autoplay resource (Автопроигрывание ресурса), в активной вкладке выбираем звук character_step_left.wav и жмем Finish. Затем копируем под-событие character: Animation frame Equal to 6 вместе с под-событием Trigger once и в скопированном под-событии, в условии character: Animation frame Equal to 6 меняем 6 на кадр 14, а звук меняем на файл character_step_right.wav. В итоге у вас должно получится событие как на рисунке 120.

Рис. 120.

Запустите игру и попробуйте побегать, вы услышите характерные звуки шагов. То же самое мы должны сделать и для врага, но с одним небольшим изменением — звуки шагов врага должны быть слышны, только если мы увидим его на экране. Для этого создаем событие: выберите спрайт enemy_croc, далее команду Object is on-screen? (Объект на экране?). Теперь скопируйте событие предыдущее событие для персонажа (которое изображено на рис. 120) и вместе со всей цепочкой под-событий подставьте его под событие enemy_croc: is on-screen. Далее во всех под-событиях этого условия, где присутствует спрайт character нужно заменить его на спрайт enemy_croc, а в действиях заменить звуки character_step_left.wav и character_step_right.wav на звуки шагов для врага croc_step_left.wav и croc_step_right.wav. В итоге у вас должно получится событие как на рисунке 121.

Рис. 121.

Запустите игру и подойдите к врагу — вы услышите характерные металлические шаги противника.

Теперь нам остается создать последнее событие, чтобы добавить в игру музыкальное сопровождение. В списке объектов выберите объект System (Система), далее команду Start of layout (При старте уровня). Если вы хотите, чтобы музыка в игре играла по кругу, то для этого ее нужно загрузить на канал.

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

Итак, создаем 2 новых действия.

Действие первое: выберите объект XAudio2, далее команду Load resource (Загрузить ресурс), откроется окно, в котором под надписью Resource to load (Ресурс, который нужно загрузить) вам нужно выбрать файл music.wav, под надписью Channel (Канал) должен быть указан канал 1. Теперь в этом же окне под надписью Loop (Зацикливание) в активной вкладке выберите команду Loop (Зациклить) и жмите Finish.

Действие второе: выберите объект XAudio2, далее команду Play (Воспроизвести), откроется окно, в котором под надписью Channel (Канал) должен быть указан канал 1, нажмите Finish. У вас должно получиться событие как на рис. 122.

Рис. 122.

Запустите игру и вы услышите музыку. Поздравляю! Вы создали свою первую игру!

На этом урок закончен. Вы можете скачать исходник платформера, чтобы проверить, правильно ли вы все сделали, или посмотреть пример.

Постскриптум

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

В качестве примера рассмотрим, как выглядело бы упрощенное описание события, изображенного выше на рис. 45.

Создайте новое событие:

То есть создаете событие, в списке объектов выбираете объект System (Система), затем выбираете команду Always (Всегда). Теперь действие: в списке объектов выбираете спрайт character, далее команду Set position to another object (Установить позицию относительно другого объекта), далее нажимаете на кнопку Pick an object (Указать объект) и в открывшемся окне выбираете спрайт basis.

Более сложные события (как например на рис. 120), которые имеют цепочки под-событий я буду описывать так:

Где знак "+" означает ступени в виде под-событий. Если в событии или под-событии несколько действий — то они будут идти друг над другом.

Статья написана специально для сайта ScirraConstruct.ru.