Construct 2 урок 2: Руководство к программе Construct 2 начального уровня

Содержание

Создаем TDS. Часть первая — Construct 2 / Game Dev / Game Dev

Данный урок будет очень полезен новичкам и тем, кто ни разу не пробовал создать игру. Прочитав его вы научитесь создавать простые игры и разберетесь с интерфейсом программы. В нем мы вместе создадим простейшую игру жанра TDS. Для этого понадобится установленный Construct. В процессе написания урока я буду использовать Construct 1.2

Итак, приступим.
Включаем программу и создаем новую Direct-X игру

Перед нами появился «белый лист» на котором и будет расположена вся наша игра.
Увеличим его размер. Для этого на панели слева изменим два параметра:
Width (Ширина) и Height (Высота) на значения 1024 и 768 соответственно

Теперь увеличим размер окна, в котором отображается игра. Для этого на той же самой панели щелкнем по синей надписи Properties. На появившейся панели найдем параметры Window Width (Ширина окна) и Window Height (Высота окна) и измени их значения на 1024 и 768. Кстати, параметр Name — это название вашей игры, а Creator — автор.

Теперь можно создать главного героя. Щелкаем по белому листу правой кнопкой мыши, в появившемся меню выбираем Insert an object, у нас открылось новое окно, в котором перечислины все типы объектов, нам нужно найти и выбрать (одним щелчком левой кнопки мыши) объект Sprite. После этого нажмите кнопку Insert, расположенную справа.

Теперь выбираем, где мы создадим главного героя, щелкаем по нужному месту на уровне левой кнопкой мыши. Открывается графический редактор Construct. Вы можете нарисовать главного героя прямо в нем или загрузить уже готовый фаил, мы пойдем вторым способом. Для этого сохраните на жесткий диск спрайт, расположенный ниже. (Как видите, на его руках видны пиксели, неровности, от них мы избавимся позже)

Откройте графический редактор и щелкните по кнопке Open (Вторая по счету сверху). Выберите нужный фаил (Загруженную только что картинку)
В окне появился наш главный герой. Теперь выбираем на панели слева предпоследний инструмен — Hotspot. Выбрав его, щелкаем мышкой в приблизительный центр спрайта (Середина шлема). Это необходимо, так как теперь главный герой, при прицеливании, будет вращаться относительно этой точки.

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

Герой появился на уровне, но, оказалось, он слишком большой. Щелкаем по герою и открываем вкладку Common расположенную слева на панели. Изменяем параметры Width и Height с 256 на 128 и видим, что герой уменьшился, это также сгладило неровности на его руках. Теперь в той же самой вкладке изменим параметр Name на Gero

Для упрощения создания игры в Construct используются поведения (Behaviors). Разберемся, что это такое, на примере нашего героя.

Итак, щелкнем по нему и откроем на панели слева вкладку Behaviors. Около пункта New behavior нажмем на синюю кнопку Add.

Открылось новое окно, содержащее все поведения. Добавляем самое первое поведение 8 Direction.

Теперь проверим, что у нас получилось, для этого открываем вкладку Project, расположенную на верхней панели и щелкаем по кнопке Run all. Добавленное поведение заставляет героя двигаться и поворачиваться в различные стороны. Управление происходит стрелками на клавиатуре.

В будущем мы сделаем, чтобы герой поворачивался к указателю мыши, поэтому его автоматический поворот в сторону движения надо отключить. Для этого во вкладке 8Direction Bihavior изменяем параметр Rotation на None. Теперь герой не будет поворачиваться по направлению движения. Вы всегда можете проверить, что у вас получается, нажав на кнопку Run All.
Нужно добавить еще один объект. Щелкнем по уровню правой кнопкой, далее Insert an object и добавляем объект Mouse and Keyboard. Он понадобится нам позже.

Теперь сделаем, чтобы герой поворачивался по направлению к курсору.
Для этого мы используем редактор событий. С помощью данного модуля мы будем создавать основу нашей игры.
Открываем его щелчком левой кнопки мыши по вкладке Event Sheet Editor расположенной внизу экрана, под окном уровня.
Итак, у нас открылась вкладка, окно уровня заменилось на окно Event Sheet, оно включает в себя все события и действия, все, что происходит на данном уровне.
Теперь создадим свое первое событие. Щелкаем правой кнопкой в окне с надписью Right click to begin и выбираем строку Insert Event. Далее выбираем объект System и среди списка всех действий находим Always щелкаем по нему, после чего жмем на кнопку Finish

У нас появилось новое событие — «всегда», то есть действия, добавленные к нему будут происходить постоянно.
Добавим к данному событию новое действе, щелкнув по красной кнопке + New Action рядом с ним. Выбираем объект Gero, далее находим и выбираем Set Angle towards position (Установить поворот к точке) в открывшемся списке. У нас появилось меню с двумя параметрами — координатами точки, к которой надо повернуться. Выделяем «0» в ячейке X Co-ordinate. После этого щелкаем два раза по объекту MouseKeyboard в окне с низу, выбираем пункт Get mouse X и жмем Finish. Такуюже операцию проделываем с ячейкой Y Co-ordinate, только теперь выбираем Get mouse Y.

Жмем Finish и запускаем проверку нашей игры.

Чтобы урок не получился слишком длинным, я буду сокращенно записывать создание событий и изменение атрибутов объекта.

Теперь сделаем, чтобы герой мог стрелять
Открываем вкладку Layout Editor (позже я буду называть ее «Редактор уровня»), расположенную слева от Event Sheet Editor (буду называть его «Редактор событий»). Добавляем новый объект — спрайт (Напомню, что для этого щелкаем правой кнопкой по уровню, далее жмем Insert an Object, выбираем Sprite и щелкаем по уровню). В графическом редакторе загружаем спрайт пули, расположенный ниже

Уменьшаем размер пули до 16, а также изменяем ее имя на Bullet
Width = 16
Height = 16
Name = Bullet
Добавляем поведение Bullet (Вкладка Behaviors синяя кнопка Add).

Изменим параметр Speed у нового поведения на 750, а также Accuracy на 5.
Speed = 750
Accuracy = 5
Что же мы только что сделали? Параметр Speed — это скорость полета пули, а Accuracy — разброс при стрельбе в градусах.
Перетаксиваем левой кнопкой мыши пулю за край уровня (белого листа)

Открываем редактор событий. Добавляем новое событие (Правая кнопка, Insert event)
Insert event -> MouseKeyboard -> On click -> Finish
(Эта запись означает, что после нажатия Insert event мы выбираем объект MouseKeyboard, далее выбираем On Click, после чего появляется окно с параметрами, но их нам менять не надо.)

К только что созданному событию добавим действие (Красная кнопочка справа от события On Left Mouse Button Clicked)
New action -> Gero-> Spawn another object
Не нажимая Finish щелкаем по кнопке Pick an Object и выбираем Bullet. Теперь под надписью Image point name or namber Ставим 1(Это значит, что пуля будет появляться около синей точки с номером 1, помните, мы поставили ее около дула героя).

Жмем Finish. Тепрь при щелчке левой кнопкой мыши наш герой будет стрелять. Проверим, что у нас вышло.

Итак, мы уже подошли к окончанию первой части данного урока.
Осталось последнее — добавить фон.

Итак, открываем вкладку Layers, расположенную справа.
В появившемся окне нажимаем кнопку создать слой ниже (На ней нарисован лист с зеленой стрелочкой, направленной вниз)

Теперь у на есть два слоя. Щелкаем по верхнему и на панели слева переименовываем его в Game, а нижний слой в BackGround

Щелкните один раз по слою BackGround, теперь все создаваемые объекты будут появлятся на этом слое.

Создаем новый объект, но не спрайт, а Tiled Background. Объект такого типа отлично подходит для создания фона.
В графическом редакторе загружаем картинку, приведенную ниже, это и будет наш фон.

Растягиваем полученный объект так, чтобы он закрыл весь уровень (Белый лист). Теперь нажимаем на зеленый замочек напротив слоя Background. Щелчком левой кнопки мыши выбираем слой Game. Закрытый замочек напротив слоя означает, что мы не сможем выбирать объекты, расположенные на нем.

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

Создадим новый спрайт, в графическом редакторе заливаем его произвольным цветом.Изменим имя объекта на Block
Во вкладке Groups открываем Attributes и ставим галочку напротив Solid.

Мы только что сделали объект Block твердым, это значит, что игрок не сможет проходить через него.

Щелкаем по блоку правой кнопкой и нажимаем Copy, теперь по пустому месту и — Paste. Делаем так четыре раза. Растягивая и перемещая эти блоки, огораживаем уровень со всех сторон.

Запускаем игру и смотрим, что получилось.

К статье прилагается исходник, который можно открыть в Construct

Вторая часть данной статьи посвящена созданию врагов. Изучив ее, вы также научитесь создавать текстовые индикаторы и красивые взрывы.

Надеюсь, мой урок помог вам в освоении игростроя.

Игровой дизайн. Юниор. Урок 2

Похожие презентации:

3D печать и 3D принтер

Системы менеджмента качества требования. Развитие стандарта ISO 9001

Операционная система. Назначение и основные функции

Adobe Photoshop

AutoCAD история и возможности

Microsoft Excel

Облачные технологии

Корпорация Microsoft и ее особенности

Веб-дизайн

Тема 2. Пакеты прикладных программ

Game design
Junior
Урок 2
Добавление
переменных
и противников
¾¾ План работы.
Создание плавающих платформ при помощи поведения sine и jumpthru. Добавление переменных
для подсчёта очков (score) и здоровья (health).
Добавление текстового поля и спрайтов. Создание папок событий. Добавление аптечки и программирование минимально и максимально пределов здоровья.
¾¾ Дополнительно
Добавление поведения Flash для паузы между

наложениями спрайтов героя и противника с использованием триггера Is overlapping.
Материалы урока прикреплены к данному PDF-файлу. Для доступа к материалам, урок необходимо открыть в программе Adobe
Acrobat Reader.
2
Добавление переменных и противников
Добавление переменных
и противников
Для начала немного изменим размер игрового экрана. Для этого переходим на панель «Project properties»
и нажимаем «View» (рис. 1).
Рисунок 1
Меняем «Viewport size» на «1500×1000» (рис. 2)
Рисунок 2
Вернемся к первому уровню игры. Добавим пропасть,
которую изобразим с помощью воды. Также размещаем
платформы (рис. 3).
3
Урок 2
Рисунок 3
Теперь сделаем их плавающими. Кроме поведения
«Solid» добавляем еще «Jumpthru». Это значит, что персонаж сможет проходить мимо этого объекта и запрыгивать на него (рис. 4).
Рисунок 4
Затем добавляем поведение «Sine» (рис.

5).
4
Добавление переменных и противников
Рисунок 5
На панели справа во вкладке «Behaviors» можно менять параметры поведения, например, направление движения, скорость, интервал и т.д. (рис. 6).
Рисунок 6
5
Урок 2
Можно задать разные значения платформам, чтобы
они двигались с разной скоростью. Это немного усложнит игру (рис. 7).
Рисунок 7
Для хранения очков или других данных нам необходимы переменные. Давайте создадим счет очков и жизней персонажа.
Для начала добавляем c помощью «Insert new object»
текстовый элемент ( ).
На панели свойств можем изменить наполнение текстового блока, тип, цвет и размер шрифта и т.д. (рис. 8).
В итоге получаем элемент с текстом и размещаем его
в верхнем левом углу. Пишем там цифру 0 (рис.9).
Нужно задать текстовому блоку собственную переменную. На панели «Properties» кликаем «Instance variables» (рис. 10).
6
Добавление переменных и противников
Рисунок 8
Рисунок 9
7
Урок 2
Рисунок 10
Задаем переменной имя, например, тот же «score»
и выставляем начальное значение — 0 (рис.

11).
Рисунок 11
8
Добавление переменных и противников
Теперь для того, чтобы текст был всегда в фокусе, давайте добавим ему поведение «Anchor». Это поведение
привяжет наш объект к углу карты (рис. 12).
Рисунок 12
Переходим в цепочку событий. У нас уже есть событие, где при соприкосновении персонажа с монетой, второй
элемент пропадает. Теперь нужно добавить действие так,
чтобы при соприкосновении с монеткой увеличивался счет.
Выбираем «Add action», затем «Text». Из списка действий нужно добавить «Add to» (рис. 13–14).
Рисунок 13
9
Урок 2
Рисунок 14
В следующем окне нужно установить, сколько очков
прибавится при соприкосновении персонажа с монеткой.
Оставляем 1 (рис. 15).
Рисунок 15
Событие мы добавили, но цифры у слова «Score» еще

не появились. Для этого нужно добавить еще одно собы10
Добавление переменных и противников
тие для текста, но в этот раз из списка действий выбрать
«Set text» (рис. 16).

Рисунок 16
Появится следующее окно с текстовым полем. Убираем текст, который выделен красным (рис. 17).
Рисунок 17
11
Урок 2
Нажимаем внизу окна «Find Expression». После этого
появится новое окно «Expression Dictionary», в котором
снова выбираем «score» (рис. 18).
Рисунок 18
Выбираем «score (number) A numeric variable» (рис. 19).
В окне с параметрами появляется значение (рис. 20).
Рисунок 19
12
Добавление переменных и противников
Рисунок 20
Цепочка событий сейчас выглядит следующим образом (рис. 21):
Рисунок 21
Можно также добавить иконку, которая будет отображать накопление монет. Теперь при воспроизведении
игры, когда персонаж соприкасается с монеткой, добавляется счет (рис. 22).
13
Урок 2
Рисунок 22
Осталась одна маленькая деталь. Необходимо прикрепить эти элементы, чтобы они не сдвигались. Для этого
добавляем им поведение «Anchor» (рис. 23).
Рисунок 23
Рассмотрим, как добавить персонажу 3 жизни.

Выбираем игрока и добавляем ему «Instance variable».
Поскольку это переменная жизней, то выставляем ей значение 3 (рис. 24).
14
Добавление переменных и противников
Рисунок 24
Теперь добавляем действие. Добавим его в событие,
где игрок попадал на шипы и умирал. Убираем действие
«Destroy» (рис. 25).
Рисунок 25
Теперь добавляем «Player => Add to» (рис. 26).
Рисунок 26
15
Урок 2
Необходимо добавить событие, чтобы, когда
жизнь = 0, персонаж умирал и уровень начинался сначала. Для этого выбираем «Player => Compare instance

variable» (рис. 27).
Рисунок 27
В появившемся окне с параметрами выставляем переменную «lives», затем знак ≤ и значение 0 (рис. 28).
Добавляем действие. «Player => Destroy». Затем добавляем «System => Wait» (рис. 29).
16
Добавление переменных и противников
Рисунок 28
Рисунок 29
Задаем параметр ожидания 1 с (рис. 30).
17
Урок 2
Рисунок 30
Добавим еще одно действие «System => Restart layout».

Теперь, если персонаж трижды попадает на шипы,
уровень перезапускается.
Давайте рассмотрим, как сделать так, чтобы игрок
тоже видел, сколько жизней у него осталось.
С помощью «TiledBackground» добавляем три сердечка. «Длинна объекта = 120px» (рис. 31).
Рисунок 31
18
Добавление переменных и противников
Выбираем событие, где персонаж соприкасается с шипами (рис. 32).
Рисунок 32
Добавим сюда действия для жизней «Lives => Set

width» (рис. 33).
Рисунок 33
В появившемся окне нажимаем «Find Expressions».
Снова выбираем объект «Lives», а затем «Get the object’s
width in pixels» (рис. 34).
19
Урок 2
Рисунок 34
К появившемуся параметру добавляем –40, то есть,
треть всей длинны объекта (рис. 35).
Рисунок 35
20
Добавление переменных и противников
Сохраняем результат. Теперь при попадании на шипы,
будет пропадать по одному сердечку (рис. 36).
Рисунок 36
Но давайте пойдем и от обратного.

Дадим возможность игроку подобрать сердечко и прибавить жизнь.
Создаем новый объект «Insert new object => Sprite»
(рис. 37).
Рисунок 37
Размещаем элемент в сцене (рис. 38).
21
Урок 2
Рисунок 38
Теперь нужно добавить событие, чтобы при соприкосновении персонажа с сердечками, у первого добавлялись жизни. «Add event => Player => On collision with =>

heart» (рис. 39).
Рисунок 39
«Add action => Player => Add to». Добавляем одну переменную (рис. 40).
Добавим еще одно действие. «Lives => Set width»
(рис. 41).
22
Добавление переменных и противников
Рисунок 40
Рисунок 41
В появившемся окне нажимаем «Find expression»
(рис. 42).
23
Урок 2
Рисунок 42
Из списка снова выбираем «lives», а затем «Get the object’s width, in pixels» (рис. 43–44).
Рисунок 43
24
Добавление переменных и противников
Рисунок 44
В появившемся окне добавляем +40. По сути, мы
создаем действие обратное к потере жизни персонажа
(рис.

45).
Рисунок 45
Добавим еще одно действие «heart => Destroy», чтобы сердечко добавляло жизнь, а потом исчезало (рис. 46).
25
Урок 2
Рисунок 46
Вот и все, теперь персонаж может терять или подбирать жизни.
Теперь нужно ограничить возможность игрока подбирать жизни, если у него есть максимальное их количество.
Для этого добавляем событие «Add event => Lives =>
Compare width». Выставляем максимальное значение
длинны — «120 px» (рис. 47).
Рисунок 47
Добавляем действие для объекта «Heart => Set collisions enable => Disable» (рис. 48).
Рисунок 48
26
Добавление переменных и противников
После этого нужно добавить событие, чтобы в случае, когда длинна жизней меньше 120, игрок смог подбирать жизнь. Копируем предыдущий ивент. Затем меняем «Width=120» на «Width=120». Затем меняем действие
с «Disable» на «Enable» (рис. 49).
Рисунок 49
В «Construct 3» также есть возможность добавлять
другие папки событий. Для этого на панели «Project»
справа кликаем правой кнопкой мыши по папке «Event
Sheets» и выбираем «Add event sheet» (рис.

50).
Рисунок 50
Эта функция крайне полезна, когда мы будем создавать другие уровни («Layouts»). Тогда для каждого уровня
можно будет прописывать отдельную цепочку событий.
27
Урок 2
Добавление переменных
и противников
© Компьютерная Академия «Шаг»
www.itstep.org
Все права на охраняемые авторским правом фото-, аудио- и видеопроизведения, фрагменты которых использованы в материале, принадлежат их законным владельцам. Фрагменты произведений используются в
иллюстративных целях в объёме, оправданном поставленной задачей, в
рамках учебного процесса и в учебных целях, в соответствии со ст. 1274
ч. 4 ГК РФ и ст. 21 и 23 Закона Украины «Про авторське право і суміжні
права». Объём и способ цитируемых произведений соответствует
принятым нормам, не наносит ущерба нормальному использованию
объектов авторского права и не ущемляет законные интересы автора
и правообладателей. Цитируемые фрагменты произведений на момент
использования не могут быть заменены альтернативными, не охраняемыми авторским правом аналогами, и как таковые соответствуют
критериям добросовестного использования и честного использования.

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

English Русский Правила

Как сделать игру в Construct 2? Создание проекта и первого уровня игры

В этой серии статей я на примере расскажу, как сделать игру с помощью конструктора игр Construct 2. Из этих строк вы узнаете, как создать простую кроссплатформенную игру по шагам, начиная с создания пустого проекта до публикации игры на своём сайте и на некоторых других онлайн сервисах.

Для тех, кто не знает, что такое конструктор игр Construct 2, сначала стоит прочитать статью «Конструктор игр — Construct 2». Сразу замечу, что в статье я буду описывать создание игры с помощью платной версии Construct 2, хотя и буду стараться обходиться бесплатными возможностями.

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

Создание проекта

Итак, начнём с создания проекта. Запустите Construct 2 и выберите пункт меню «File -> New». Сделаем пустой проект с расчётом на экраны с большим расширением. Выберите шаблон «New empty HD portrait 1080p project» (игра будет работать в портретной ориентации) и нажмите кнопку «Open».

В панели свойств задайте данные о проекте: название, версию, описание, автора (название компании или имя и фамилия разработчика), адрес электронной почты и адрес вебсайта. В поле ID нужно указать уникальный идентификатор программы. Чтобы этот идентификатор был уникальным, за основу берут доменное имя без www и записывают его наоборот, например, для сайта www. proghouse.ru, начало идентификатора будет ru.proghouse. Затем через точку приписывают название программы. У меня получилось так: ru.proghouse.red-n-blue. В дальнейшем этот идентификатор можно будет использовать для добавления игры в Google Play или App Store.

Сохранить созданный проект вы можете в один единственный файл (пункт меню «File -> Save As Single File…») или в папку (пункт меню «File -> Save As Project…»). В папку сохранять проект будет полезным, если вы работаете в команде или для хранения версий вы будете использовать систему управления версиями, например, SVN или Git.

Делаем первый уровень игры

После создания проекта у нас появилось 2 закладки «Layout 1» и «Event sheet 1». Первая закладка – это макет экрана или сцены, который будет видеть игрок, на второй закладке – страница событий. Я решил использовать для каждого уровня игры отдельный макет и одну для всех страницу событий. Ну, что ж, раз макет «Layout 1» уже создан будем использовать его для первого уровня.

Для начала переименуем макет «Layout 1». Чтобы открыть свойства макета, щелкните по нему на панели «Projects».

Я назову макет первого уровня «Level1» и сделаю размер макета таким же, как и размер окна (в моём случае – это 1080х1920).

Узнать размер окна и поменять его в случае необходимости можно в свойствах проекта. Для этого щёлкните по названию проекта в панели «Projects» и найдите свойство «Window Size».

Теперь нарисуем объекты. В игре я решил использовать прямоугольники и квадраты чёрного цвета, поэтому мне рисовать ничего сложного не придётся. На закладке «Level1» щёлкните правой клавишей мышки по макету и в появившемся меню выберите «Insert new object».

В диалоге «Insert new object» выберите объект «Sprite» (объект-картинка), введите имя для нового объекта «BlackBlock» и нажмите «Insert».

После этого указатель мыши превратится в крестик и вам нужно будет щёлкнуть в то место, где нужно создать новый объект. Щёлкните посередине макета. После щелчка сразу открывается четыре окна: окно «Edit image» для рисования нашего объекта, окно «Image points» для указания ключевых точек на объекте, например, центра объекта, и окна «Animations» и «Animation frames» для управления анимацией.

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

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

Всё готово, можно закрыть окно «Edit image». После закрытия окна вы увидите объект на макете. Можно увеличить его до нужного размера и передвинуть в нужное место.

После добавления объекта на макет, он появился и в проекте на панели «Projects». Чтобы теперь добавить на макет ещё один экземпляр объекта «BlackBlock» перетащите его мышкой из панели «Projects» на макет «Level1». После перетаскивания на макете будет два чёрных блока одинакового размера. Сделаем нижний блок шире. Таким же образом можно сделать любое количество чёрных блоков любого размера.

Теперь добавим героев нашей игры – красный и синий кружки. Сначала сделаем красный кружок. Для этого вставим спрайт, так же как вставляли спрайт для черного блока, с помощью пункта меню «Insert new object». Назовём его «Red».

Чтобы нарисовать красный круг, воспользуемся инструментом кистью. Выберем красный цвет, размер кисти меньший, чем размер картинки (я сделал 199) и почти максимальную жесткость (я выбрал на 1 меньше — 199), чтобы края были четь размытыми. Теперь установите указатель мыши примерно посередине картинки и щёлкните один раз. Так мы получим ровный круг.

Теперь нужно подрезать картинку по размеру круга. Для этого щёлкните по пиктограмме подрезки. Как видите, картинка после этого стала размером 201×201.

Теперь нужно выровнять исходную точку вокруг, которой кружок будет крутиться в будущем. Для этого нажмите на пиктограмму «Set origin and image points», в появившемся диалоге щёлкните правой клавишей мыши по исходной точке и выберите пункт меню «Quick assign -> Middle». После этого исходная точка будет установлена строго в центре.

Точно так же сделаем синий круг. После этого уменьшим круги, задав им размеры 101×101 на панели «Properties» и разместим на чёрных панелях друг под другом (координата x должна быть равна 540).

Теперь нужно задать нашим объектам поведение «Physics» (физика), чтобы на них действовало притяжение, и они могли сталкиваться друг с другом. Для этого выберите объект Red и на панели свойств щёлкните по ссылке «Behaviors». В появившемся диалоге «Behaviors» щёлкните по плюсику и в очередном диалоге «Add behavior» выберите поведение «Physics» и нажмите на кнопку «Add».

Добавленное поведение теперь будет отображаться в диалоге «Behaviors».

Закройте этот диалог и посмотрите на панель «Properties». Теперь здесь появились свойства поведения «Physics». В свойствах поведения для кружка нужно выставить для свойства «Collision mask» (контур столкновения) значение «Circle» (окружность). Только выделите объект на панели «Projects», а не экземпляр объекта на макете «Level1», так вы выставите это свойство для всех будущих экземпляров на всех уровнях. Этим самым мы даём знать движку Box2D, который двигает объекты и обрабатывает столкновения, что красный и синий объекты – круглые. Тоже самое проделайте с объектом Blue.

Теперь выполните макет, для этого нажмите на кнопку «Run layout», сверху в заголовке окна или нажмите на клавишу F5.

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

Теперь вы видите, что поведение работает, но наши кружочки не сталкиваются с чёрными прямоугольниками, а пролетают как бы над ними. Чтобы сделать столкновения, нужно к чёрным прямоугольникам тоже добавить поведение «Physics», как мы это делали для объектов Red и Blue. Только в свойствах поведения выставите свойству «Immovable» (неподвижность) значение «Yes», чтобы объекты были неподвижны и не падали вниз. А свойству «Collision mask» выставьте значение «Bounding box» (обрамляющая рамка), — это означает, что границы объекта совпадают с границами картинки, т.е. это прямоугольники. При изменении свойств выберите объект на панели «Projects», а не экземпляр объекта на макете «Level1»! Так вы поменяете эти свойства для всех существующих и для всех будущих экземпляров объекта.

Запустите макет теперь и вы увидите, что красный и синий кружочки лежат на чёрных прямоугольниках. Теперь нужно сделать, чтобы прикасаясь к чёрным прямоугольникам их можно было убрать. Чтобы обрабатывать прикосновения к сенсорному экрану или события с мышкой, добавьте в проект объект «Touch». Для этого, так же как мы добавляли предыдущие объекты, добавляем объект «Touch» на наш макет.

После нажатия на кнопку «Insert» на несколько секунд появится предупреждение, что объект «Touch» доступен для всего проекта. Т.е. добавляя этот объект к макету, добавление происходит для всего проекта. Это нормально.

Теперь, чтобы обработать прикосновения к сенсорному экрану и щёлканья мышкой, откройте закладку «Event sheet 1», нажмите на ссылку «Add event» (добавить событие) и в появившемся диалоге «Add event» выберите объект «Touch» и нажмите на кнопку «Next».

На следующем шаге выберите событие, которое вы хотите обработать. В нашем случае – это событие «On tap object» (если тапнули по объекту). Нажмите на кнопку «Next».

На следующем шаге выберите объект, по которому должны тапнуть. В нашем случае – это объект «BlackBlock». Нажмите на кнопку «Done».

После закрытия диалога мы видим, что на странице событий появилось наше первое событие, которое будет возникать, если игрок тапнул по сенсорному экрану или щёлкнул мышкой по объекту «BlackBlock».

Теперь по событию нам что-то нужно сделать. В нашем случае мы должны удалить экземпляр объекта «BlackBlock», по которому тапнули или щёлкнули. Чтобы добавить действие по событию, щёлкните по ссылке «Add action» (добавить действие). В диалоге «Add action» выберите объект, с которым нужно совершить действие. В нашем случае – это объект «BlackBlock». Нажмите «Next».

На следующем этапе нужно выбрать действие с выбранным объектом. Нас интересует удаление объекта, поэтому выберем «Destroy» и нажмём копку «Done».

Теперь на странице событий появилось наше действие.

Запустим макет теперь и посмотрим, работает ли событие. После запуска мы видим два чёрных прямоугольника и на них лежат кружочки. Щёлкнем по верхнему прямоугольнику, он исчез, и красный кружок начал падать вниз. Всё прекрасно.

Теперь нужно сделать надпись, которая будет появляться, когда уровень пройден. Для отображения текста с результатом прохождения уровня добавим на макет объект «Sprite font» с именем «ResultText».

После добавления объекта на макет поднимется уже известный нам диалог «Edit image», на котором вы увидите картинку с изображением букв.

Дело в том, что в объекте «Sprite font» для отображения текста используются нарисованные на этой картинке буквы. Конечно, можно было использовать объект «Text» и шрифты TrueType, но эти шрифты работают некорректно в некоторых случаях, например, при экспорте проекта под платформу Android с помощью сервиса CocoonJS. Поэтому, чтобы игра выглядела одинаково на всех платформах, лучше сразу использовать объект «Sprite font» для вывода текста. Кроме того вы сможете нарисовать шрифты на свой вкус.

В примере я не буду использовать предложенный по умолчанию пиксельный шрифт, а возьму специально заготовленный шрифт с русскими и латинскими буквами (файл шрифта см. в конце статьи). Чтобы подгрузить картинку, нажмите на кнопку «Load an image from a file». После загрузки картинки это окно можно закрыть.

Теперь, в свойствах объекта «Sprite font» нужно выставить размеры одной буквы (свойства «Character width» и «Character height») и набор символов (свойство «Character set»). В наборе символов перечисляются все символы, которые есть на картинке. На картинке, которую я использовал символы следующие:

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789.,;:?!-_~#»‘&()[]|`\/@°+=*$£€<>АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюя

Писать будем посередине макета, поэтому выравнивание текста сделайте по центру (свойства «Horizontal alignment» и «Vertical alignment»).

Подравнять сам объект по центру макета вы можете, щёлкнув по нему правой клавишей мышки, и выбрав в меню пункты «Align -> Layout -> Center horizontal» и «Align -> Layout -> Center vertical».

Чтобы надпись в начале уровня была спрятана, установите в свойство «Initial visibility» значение «Invisible».

Теперь можно сделать анализ результата, с которым пройден уровень и выдача результата. Для начала нам нужно отследить столкновение красного кружочка с синим, чтобы закончить прохождение уровня. Для этого будем отслеживать событие о столкновении от красного кружочка. На странице событий щёлкните по ссылке «Add event», выберите красный кружок, нажмите «Next», выберите событие «On collision with another object» (при столкновении с другим объектом) и нажмите «Next».

На следующем этапе выберите объект, с которым ожидается столкновение. В нашем случае – это объект «Blue».

После того как событие добавлено, нужно добавить обработчик этого события. Нажмём на ссылку «Add action» справа от события и выберем объект «ResultText». Нажмите «Next».

На этом этапе выберите действие «Set visible» и нажмите «Next».

В следующем диалоге выберите значение «Visible».

Кроме того, что нужно показать текст ещё нужно написать поздравления. Поэтому для события добавляем ещё одно действие. Нажмите «Add action», выберите объект «ResultText» и найдите действие «Set text». Нажмите «Next».

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

Теперь страница событий будет содержать два события.

Теперь нужно узнать о том, что игрок не прошёл уровень. Это случается, если кружки вылетели за границу макета. Чтобы это узнать добавляем новое событие для объектов Red «Is outside layout».

И делаем такие же обработчики, как и для предыдущего события, только текст будет сообщать о поражении. Для синего кружка события будут такие же, поэтому щёлкните правой клавишей мышки по событию «Is outside layout» с красным кружком и выберите пункт меню «Add another conditions» и аналогично добавьте событие для синего кружка.

Теперь чтобы действия выполнялись по любому событию, щёлкните по общему пространству чуть левее событий правой кнопкой мыши и выберите пункт меню «Make ‘Or’ block» (сделать блок ‘или’).

Результат будет выглядеть так.

Теперь можно запустить игру и попробовать разные варианты: убрать верхний чёрный блок – будет победа или убрать нижний блок – будет проигрыш.

Добавим ещё один небольшой штрих. После того как прохождение уровня завершено, подождём несколько секунд и начнём уровень сначала. Для этого добавьте в каждое событие о завершении действие «Wait» и действие «Go to layout», см. картинки.

И установим количество секунд – 3.

Должно получиться вот так.

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

А вот и файл проекта и шрифт:

Файлы:

Проект игры Red and Blue (создание проекта и первый уровень)
Проект игры Red and Blue и файл со шрифтом для объекта Sprite Font для статьи «Как сделать игру в Construct 2? Создание проекта и первого уровня игры».

29.08.2014 436.42 KB 2364

2 статья: «Как сделать игру в Construct 2? Оформляем уровень»

3 статья: «Как сделать игру в Construct 2? Добавляем уровни и делаем переходы между уровнями»

4 статья: «Как сделать игру в Construct 2? Добавляем меню и сохраняем прохождения игры»

5 статья: «Как сделать игру в Construct 2? Добавление музыки и звуков»

Добавить комментарий

Обзор Construct 2 — конструктора игр без программирования

В этой статье мы рассмотрим популярный конструктор для создания игр Construct 2. Движок популярный, доступен в трех ценовых категориях, в том числе есть и бесплатная редакция. Construct 2 — это улучшенная версия другого популярного конструктора компании Scirra — Construct Classic.

Особенности

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

Нельзя обойти такую особенность, как легко настраиваемая физика игровых обьектов, доступная буквально в пару кликов. То есть, движок Box2D уже встроен в этот конструктор.

Также, в Констракте есть еще одна довольно примечательная черта — Behaviours(Поведения), они помогают настраивать физику, управление, и другие игровые аспекты буквально за одну минуту. Behaviour – это такая штука, которую вы можете добавить к игровому обьекту. Например, добавив физический Behaviour к обьекту, этот обьект начнет вести себя как реальное физическое тело, на него будет действовать сила тяжести, у него появится инерция.

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

Что можно с Construct 2

Теперь же давайте разграничим, что может этот конструктор, а что нет. В связи со своей простотой, Construct 2 не может делать игры в 3D, зато с 2D он хорошо дружит. Например, в нем есть редактор анимаций, который легко разобьет на отдельные кадры строку изображений, которая в одном файле. Главное правильно настроить параметры разрезания этой строки

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

Констракт идеально подойдет для не сложного платформера, раннера или же кликера. Даже реализация гонок на нем тоже возможна. Однако, делать файтинги, или тяжелые проекты обширных масштабов (для примера возьмем популярную игру The Binding of Isaac) на нем будет довольно таки затруднительно. Для файтингов и проектов большего масштаба лучше посмотреть в сторону, например Game Maker Studio.

Говоря о масштабах, стоит упомянуть, что бесплатная версия имеет ряд ограничений. Не более 4-ех слоев (Layers) на сцене и 100 событий. Стоит отметить, что даже на простой платформер этого может не хватить. Касательно цен, стоит сказать, что они приемлемые. Так Personal, а именно эта лицензия подойдет вам, если вы не собираетесь получать с игры более $5000, стоит лишь $129. Bussiness пригодится более крупным и прибыльным играм, стоит она $429.

Говоря о платформах, стоит упомянуть, что данный конструктор делает мультиплатформенные игры. Доступен экспорт под операционные системы Windows, Mac, Linux. А также под Android и IOS актуальных версий. При покупке официальное лицензии Personal и выше, конечно.

Сам же конструктор запускается лишь на Windows. Пока что запуск его на Linux, Mac OS X или на другой операционной системе невозможен.

Как программировать в программе

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

Первый скриншот, который приведен ниже, вы увидите перед собой, когда впервые откроете эту программу, не через проект. Вы увидите несколько вкладок. Первая вкладка – это File (Файл), в котором потом можно сохранить проект, создать новый и открыть уже имеющийся, и сделать прочие действия с проектом. Меню View (Вид) – это параметры отображения, например часто используется функция Show/Snap to grid, таким образом можно показать сетку на игровом поле и перемещать по ней объекты, привязывая перемещаемый обьект к ее ячейкам. Во вкладке Events можно редактировать события.

Следующее окно вы увидите нажав на кнопку File, или воспользовавшись горячей клавишей F. Здесь вы видите стандартные кнопки (Открыть, Сохранить и т.д.) и список последних проектов.

Ниже вы видите окно создания нового проекта. Просто нажимаем New, и таким образом мы создадим новый пустой проект. Также можно создавать проект не с нуля, а выбрать какую-либо готовую заготовку – например, платформер, где уже будут настроены базовые элементы для платформера.

Создав проект, мы увидим окно, показанное на скриншоте ниже. Layout – это сцена проекта, на которой будут размещаться игровые объекты, из которых и соберется полноценный уровень.

Выделенна желтым вкладка называется Event Sheet (Лист событий). Именно в нем будет собираться вся логика игры, или же конкретного уровня, смотря выберите ли вы опцию создания нового Листа с новой Сценой или же нет. Сразу скажем несколько слов о событиях. В Констракте есть много событий. Например, событие, когда сталкиваются два обьекта. Вы можете настроить какую-либо реакцию на эти события. Например, один из обьектов можно удалить.

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

Слева же мы видим параметры либо целого проекта, либо конкретного выделенного объекта.

Рассмотрим, как добавить новый обьект. Окно ниже появится, если вы нажмете на сцене правой кнопкой мыши и выберете “Insert new object”. Некоторые иконки могут отличаться, в зависимости от установленных дополнений.

Выбрав, например самый простой спрайт (“Sprite”), мы перейдем в окно, показанное ниже. Это редактор спрайтов. Здесь можно настроить, например, анимацию спрайта.

Поведения

Ниже вы увидите самое интересное окно, “Behaviours”. Здесь вы найдете интересные встроенные элементы движка – предустановленную физику, управление, элементы спецэффектов. Взгляните на скриншот, чтобы оценить масштабы конструктора (здесь показаны не все поведения).

Главная особенность этого конструктора в том, что он имеет так называемые “Поведения (Behaviours)”. Ведь именно они помогают обрести игре физику, управление или даже все и сразу. Давайте рассмотрим, что же делают некоторые из них.

Первый в списке “Jump through” — это поведение делает блок полупроходимым. То есть, в игре-платформере вы сможете запрыгнуть на него снизу, но верхняя сторона будет твердая. А “Solid” делает объект полностью твердым.

“Anchor” позиционирует объект строго относительно заданной точки. “Bound to layout” помогает удержать объекты в границах сцены, они не выпадут за ее пределы. Среди поведений также можно найти популярную вариацию управления, “Drag & Drop”, она позволяет перетаскивать объекты при помощи мышки.

Есть поведение, которое помогает плавно убавлять или же прибавлять непрозрачность объекта. Поведение “Flash” делает объекта мигающим, “Pin” прикрепляет объект к чему нибудь. “Scroll to”, это слежение за объектом. Допустим, если добавить это поведение к двигающемуся персонажу, то камера будет постоянно за ним следить.

“Wrap” — при помощи этого Behaviour’а объекты дошедшие до края сцены выходят с другой стороны.

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

Мы рассмотрели лишь вкратце и лишь некоторые из поведений. Встроенных поведений больше, и их они имеют настраиваемые параметры. Лучший способ узнать их все – это попробовать конструктор в действии.

Некоторые дополнения

У Construct 2 есть плагины, которые облегчают и автоматизируют работу в этом конструкторе. В частности есть довольно популярный пакет плагинов — Cocoon. Скачать целый набор дополнений Cocoon от Ludei можно тут. В частности, при помощи данных плагинов можно настроить компиляцию под различные платформы. Можно настроить показ рекламы, интеграцию с социальными сетями. Почитать про компиляцию под мобильные систему можно здесь.

Итоги

Мы вкратце рассмотрели Construct 2. Понятно что в одной статье нельзя описать все возможности конструктора. Но это и не требуется. Главное, чтобы вы имели общее представление о данном конструкторе. Если он вас заинтересует – вы всегда сможете скачать хотя бы триал-версию, и оценить лично, насколько он хорош. Нам же будет приятно, если вы потом опишете в комментариях, насколько вам понравился конструктор.

СОЗДАНИЕ КОМПЬЮТЕРНОЙ ИГРЫ СРЕДСТВАМИ КОНСТРУКТОРА ИГР CONSTRUCT 2

Авторы
Руководители
Файлы работы
Наградные документы

Крючков С.В. 1

1МБОУ СШ 2

Саитова Л.Н. 1

1Муниципальное бюджетное общеобразовательное учреждение «Средняя школа №2 с углубленным изучением отдельных предметов»

Автор работы награжден дипломом победителя III степени

Диплом школьникаСвидетельство руководителя

Текст работы размещён без изображений и формул.
Полная версия работы доступна во вкладке «Файлы работы» в формате PDF

Введение

Меня, как и многих людей, интересуют компьютерные игры. На определённом этапе мне захотелось попробовать создать собственную компьютерную игру. Компьютерную игру я решил создать с помощью конструктора игр Construct 2, который представляет из себя, что-то на подобии конструктора двумерных игр.Здесь не нужно знать какой-либо язык программирования. Поведение всех объектов в игре настраивается с помощью продвинутой системы событий. Такой подход позволяет создать игру человеку, который не знаком с программированием.

Объект исследования: программа для создания компьютерной игры

Предмет исследования: создание компьютерной игры средствами конструктора игр Construct 2.

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

Цель: рассмотреть особенности создания компьютерной игры средствами конструктора игр Construct 2, создать простую компьютерную игру.

Задачи исследования:

Изучить и проанализировать специальную литературу по теме исследования.
Изучить требования, предъявляемые к компьютерным играм.
Разработать макет компьютерной игры и систему персонажей.
Продумать сцену игры.
Создать простую развивающую компьютерную игру средствами конструктора игр Construct 2.

Методы исследования: изучение литературы,анализ и синтез, классификация и обобщение.

Глава 1. Теоретическая часть

1.1. Описание конструктора игр Construct 2

Construct 2 позволяет каждому желающему создавать 2D-игры любой сложности и любого жанра, даже не имея навыков программирования. Игры, сделанные на нём, легко портируются на все основные платформы — PC, Mac, Linux, браузеры с поддержкой HTML5, Android, iOS, WindowsPhone, Blackberry 10, AmazonAppstore, ChromeWebStore, Facebook и пр. Интерфейс программы интуитивно понятен и прост в освоении, благодаря визуальному WYSIWYG-редактору от человека не требуется знаний программирования и опыта в разработке игр. Логика игр в Construct 2 создается с помощью системы событий (англ. events) и связанных с ними действий (англ. actions).

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

1.2. Функциональностьконструктора игр Construct 2

Редактор Construct 2 написан на языке C++, а игры кодируются в Javascript. При экспорте проекта JavaScriptминифицируется, однако есть возможность подключить JavascriptPlugin SDK и модифицировать код вручную. Также плюсом является то, что Construct 2 имеет модульный дизайн, поэтому любые плагины или поведения, которые не используется в проекте, не включаются в скрипт, что помогает оптимизировать проект и сократить его вес.

На данный момент программа имеет более 20 встроенных поведений, включая Platformer, 8 Direction, Bullet, Car, Pathfinding, Turret, Drag’n’drop и т.д., которые облегчают процесс создания игры.

Construct 2 — это первый игровой движок, который официально поддерживает эффекты частиц (particleeffects) на HTML5.

Встроенный игровой движок Box 2D Physics дает возможность качественно моделировать законы физики и легко воспроизводить интересные физические эффекты. Кроме того, доступно множество плагинов, расширяющих базовые возможности программы.

1.3. Предыдущие версии

Предыдущая версия Construct после релиза Construct 2 сменила название на ConstructClassic. К настоящему моменту она уже лишилась официальной поддержки разработчиков, однако продолжает поддерживаться энтузиастами. Впрочем, популярность её все ещё высока, особенно в сфере разработки 2D и 3D-игр для операционной системы Windows. В отличие от Construct 2, версия Classic имеет открытый исходный код и является отличной бесплатной альтернативой таким платным аналогам, как GameMaker. Опыт разработки версии Classic был активно использован при создании Construct 2, хотя фактически последний представляет собой абсолютно новый конструктор, переписанный с нуля. В отличие от предыдущей версии Construct 2 использует OpenGL вместо DirectX, а игры используют WebGL (OpenGL в браузере) для быстрого рендеринга с аппаратным ускорением.

1.4. Стоимость программы

Construct 2 — платный конструктор игр. Однако программа имеет базовую бесплатную версию, имеющую ограничение в 100 событий, 4 слоя, 2 эффекта, некоторые платформы для экспорта и исключающую использование в коммерческих целях.

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

Глава 2. Поисковый этап

2.1. Анкетирование одноклассников

Прежде чем приступить к выполнению проекта, была проведена следующая работа: в школе среди одноклассников было проведено анкетирование, в результате которого выяснилось, что в компьютерные игры играют все 26 человек (рисунок 1), умеют сами создавать компьютерные игры только 2 человека (рисунок 2).

Рисунок 1

Рисунок 2

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

Глава 3. Технологический этап выполнения проекта

3. 1. Технология создания компьютерной игры

с помощью конструктора игр Construct 2

1.Запустите Construct 2 и выберите пункт меню «File ->New». Сделаем пустой проект с расчётом на экраны с большим расширением. Выберите шаблон «Newempty HD portrait 1080p project» (игра будет работать в портретной ориентации) и нажмите кнопку «Open».

2.Кликаем два раза по белому экрану, затем кликнуть по кнопке Sprite и выбрать любой фон.

3.Сделать всё тоже самое что и в 3 пункте только выбрать пункт button и в правом углу рядом, где будет надпись Textнаписать любой текст.

4.Перейти во вкладку EventSheetEditor кликнуть два раза, выбрать button, нажать на надпись +newaction и выбрать gotolayout, и написать название лэйаута, если он переименован, а если нет, то просто поставить его цифру.

5.Перейти в layout 2 и кликнуть два раза выбратьsprite, выбрать любой фон.

6. Кликнуть два раза, выбрать sprite, затем любой блок или же другой предмет, во вкладке Attributes поставить галочку у надписи solid.С помощью этих блоков сделать уровень.

7.Кликнуть два раза, выбрать sprite, затем выбрать любой спрайт, это будет ваш персонаж. Во вкладке Behaviors выбрать поведение platform.

Переходы между уровнями

1. Кликнуть два раза, выбрать sprite, выбрать любой спрайт, это будет ваш портал в другой уровень.

2. Переходим во вкладку EventSheetEditor, кликнем два раза, выбираем нашего персонажа, выбираем oncollisionwithanotherobjectвыбираем наш портал. Нажимаем на вкладку +newactiongotolayout, и написать название лэйаута, если он переименован, а если нет, то просто поставить его цифру. Далее делаем новый уровень.

Анимация

1. Заходим во вкладку Animator, кликаем по вкладке Angelanimationspeed выбираем 2, всё остальное делаем на 0, а анимацию называем stand, кликаем правой кнопкой мыши, нажимаем на addnewanimation.Добавляем новую анимацию переименовываем её в run, animationspeed выбираем 2, всё остальное делаем на 0, дублируем 1 кадр, открываем второй и вставляем анимацию №2, и так делаем столько сколько нужно (я делал 6 раз).

2.Заходим во вкладку EventSheetEditor, кликаем 2 раза, выбираем нашего персонажа, выбираем в верхнем углу вкладку Platform-ismoving, +newaction, в нижнем углу выбираем вкладку Animation-setanimation, пишем название ряда нашиханимаций, в моём случае это (run), нажимаем на кнопку finish.

Конец

1. В последнем уровне, когда персонаж соприкасается с порталом, он должен попасть туда, чтобы это сделать переходим во вкладку EventSheetEditor, кликаем два раза, выбираем нашего персонажа oncollisionobject.

Вывод

В ходе исследования цель, поставленная в работе, была достигнута, все поставленные задачи – выполнены.

При изучении и анализе литературы были использованы различные информационно-технологические и программистские издания.
Были изучены требования, предъявляемые к компьютерным играм.
При проектировании будущей игры был сделан ее макет и продумана система персонажей.
Была продумана сцена игры.
Была создана простая компьютерная игра средствами конструктора игр Construct 2.

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

В ходе проектирования и создания игры был приобретен навык работы сконструктором игр Construct 2, сформировался навык пошагового составления алгоритма.

Разработанная игра способствует развитию интереса к урокам информатики и программирования, а так же позволит развивать внимание и навык работы с клавиатурой.

В перспективе мне бы хотелось создать трехмерную компьютерную игру с использованием какого-либо языка программирования.

Список использованной литературы

Валиуллин С. Этапы разработки игры глазами гейм-дизайнера [Электронный ресурс]. Режим доступа:»http://www.gamedev. ru/gamedesign/articles/development_planning
Зыков И. Компьютерные игры: этапы разработки [Электронный ресурс]. Режим доступа:http://www.megabyte-web.ru/likbez/igryi-etapyi-razrabotki.html
Илькун В. Инструментальные средства для разработки компьютерных игр жанра экшн от первого и третьего лица [Электронный ресурс]. Режим доступа:»http://masters.donntu.org/2013/fknt/ilkun/
Истомина И. Г. Информатика. Техническая графика. – Москва – Ростов – на — Дону, 2005. – 368с.
Левин А. В. Самоучитель компьютерной графики и звука – СПб.: Питер, 2003.- 258с.
Мураховский В. И. Компьютерная графика / под ред. С. В. Симановича. – М.: «АСТ – ПРЕСС СКД», 2002. – 640с.
Скорик. М. Gamification мобильных игр [Электронный ресурс]. Режим доступа:http://habrahabr.ru/post/167595/

Просмотров работы: 5267

Создание подпрограммы в Construct 2

Введение

Чтобы следовать этому руководству, вы должны быть хотя бы знакомы с листом событий Construct2.

Для тех, кто плохо знаком с программированием

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

Причина этого руководства

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

Приступая к работе

Что мы будем делать

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

Настройка

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

Руководство для начинающих по Construct2

Нажмите на первую кнопку и в свойствах слева измените ее текст на «Button1»

Теперь измените Button2 текст на «Button2», а текст Button3 на «Reset», затем измените свойство Name Button3 на «BtnReset». Выберите текстовое поле и очистите свойство «Текст» (в нем, вероятно, есть «Текст»).

Лист событий

Перейдите к листу событий (Листок событий 1) на верхних вкладках.

Щелкните по синему значку «Добавить событие» в верхнем левом углу,

в окне Двойной щелчок мышью,

в следующем окне дважды щелкните «По щелчку объекта»,

, в появившемся окне оставьте два верхних поля, как они есть, и нажмите кнопку «<щелкните, чтобы выбрать>»,

, дважды щелкните «Кнопка», затем нажмите «Готово».

Теперь у нас есть событие мыши, мы пока не будем вводить для него никаких действий. Повторите эту процедуру для Button2 и кнопки Reset.

Создание нашей подпрограммы

В листе событий переместите мышь ниже последнего события мыши и от синего «Добавить событие», затем щелкните правой кнопкой мыши,

выберите «Добавить группу». В окне переименуйте группу в «Подпрограмма». » без кавычек, нажмите «ОК».

Появится наша подпрограмма, щелкните правой кнопкой мыши где-нибудь в поле подпрограммы и выберите «Добавить подсобытие»,

дважды щелкните «Система»,

дважды щелкните «Активна ли группа» (в разделе «Общие»), затем введите имя вашего группа между запятыми, в нашем случае это «Подпрограмма», важно, чтобы вы вводили ее точно так же, как имя группы, и включали кавычки.

Теперь мы можем добавить действие для выполнения нашей подпрограммы,

щелкните синюю кнопку «Добавить действие» справа от системного события, дважды щелкните «TextBox»,

в новом окне, прокрутите вниз до Заголовок «Текстовое поле» и дважды щелкните «Установить текст» в самом низу.

Теперь введите сообщение, которое вы хотите отображать при нажатии кнопки, я сам собираюсь поставить «Мусор», но вы можете написать все, что хотите.

Нажмите «Готово»

появится действие.

Нажмите «Добавить действие» под новым действием,

в окне дважды щелкните «Система», затем дважды щелкните «Установить активную группу»

еще раз введите имя группы, т.е. Подпрограмма между запятыми, затем нажмите маленькое поле справа от поля «состояние» (у него есть метка «v»), выберите «деактивировано»,

, нажмите «Готово».

Нам просто нужно сделать еще одну вещь с нашей подпрограммой,

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

Теперь перейдите в поле подпрограммы и щелкните правой кнопкой мыши, выберите «Редактировать»,

снимите флажок слева от «Активно при запуске» и нажмите «ОК».

Теперь наша подпрограмма выделена серым цветом.

Вызов подпрограммы

В событии щелчка мыши «Кнопка» вверху добавьте действие,

дважды щелкните «Система»

, затем «Установить активную группу»

Введите имя подпрограммы между предоставленными запятыми , оставьте его как «Активировано» и нажмите «Готово»

Вот и все, мы вызвали нашу подпрограмму. Теперь нам просто нужно повторить процедуру для «Button2».

Для кнопки «Сброс» добавьте действие,

дважды щелкните «Текстовое поле»,

прокрутите вниз до «Установить текст», дважды щелкните

, затем нажмите «Готово», ничего не меняя.

Запустите программу

Нажмите кнопку 1, и ваше сообщение должно появиться,

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

теперь нажмите кнопку 2, и ваше сообщение должно появиться снова.

Мы использовали один и тот же код дважды.

Заключение

Если вы новичок в программировании, вы, вероятно, сейчас думаете: «Зачем? в конце концов, мы могли бы просто настроить каждую кнопку для прямого отображения сообщения.

Я не знаю, предназначен ли этот способ для создания подпрограмм в Construct2, вполне может быть лучший способ, но в недавнем проекте мне удалось сократить более 300 строк кода до 12, используя эту технику.

Лучшее бесплатное руководство по конструированию 2 для начинающих

Источник изображения

ResourcesGame Design Автор Джош Петти Раскрытие информации: этот пост может содержать партнерские ссылки. Это означает, что если вы покупаете что-то, мы получаем небольшую комиссию без каких-либо дополнительных затрат для вас.

Игровые движки экономят время разработчиков, решая многие надоедливые проблемы «из коробки».

Construct 2 — популярный игровой движок, обеспечивающий быструю кроссплатформенную разработку игр. Он имеет мощную систему сценариев событий, предназначенную для непрограммистов, и множество документации с другими учебными ресурсами, которые помогут вам начать работу.

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

Путь к тому, чтобы стать полноценным геймдизайнером, начинается прямо здесь.

Основы

Ознакомьтесь с учебным пособием

Construct 2 славится своей простотой и удобным интерфейсом. А в этом видео вы получите полное пошаговое руководство по основам, которое научит вас, как создать простого персонажа-платформера, такого как Марио или Соник.

Вы увидите, как легко добавить поведение, такое как прыжок или бег, с помощью Construct 2. Всего несколько щелчков мышью, чтобы добавить гравитацию и столкновения с персонажами или объектами.

Действие «Отмена» также включает добавление анимации перед вводом листа событий. Сначала это может показаться немного сложным, но процесс интуитивно понятен и предназначен для начинающих.

При некоторой практике систему событий в Construct 2 можно использовать для создания практически любой игры.

Construct 2 Game Dev для начинающих

Ознакомьтесь с учебным пособием

Тем, кто ищет ускоренный курс, не следует искать дальше.

Этот гигантский учебник проведет вас через создание и экспорт вашего собственного клона Flappy Bird с нуля .

Этот урок научит вас всему, что нужно, чтобы начать создавать собственные 2D-игры.

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

Они покажут вам, как использовать популярный инструмент «перетаскивания» для создания увлекательной игры, а также научат основам этого игрового движка.

Создайте пиксельный платформер

Ознакомьтесь с учебным пособием

Если вам нравится пиксельная графика, вам повезло, потому что Construct 2 идеально подходит для такого стиля игр.

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

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

С помощью этого метода графика всей игры может быть сохранена всего в нескольких изображениях.

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

Физика пушечного ядра

Ознакомьтесь с руководством

Почти во всех видеоиграх используется собственная физика.

Начинающих разработчиков игр часто пугает идея заняться физикой: и на то есть веские причины. Это сложно!

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

В этом видеоролике демонстрируется настройка игры с пушечным ядром в Construct 2. Вы узнаете, как воспользоваться преимуществами мощного 2D-физического движка Construct 2 для создания игры в стиле сердитых птиц.

Используя систему поведения, предоставляемую Construct 2, можно создать практически любой тип физического движения. На освоение требуется время, но возможности безграничны.

Tetris in Construct 2

Ознакомьтесь с учебным пособием

Клонирование игр — проверенный временем способ обучения разработке игр. А с чего лучше начать, как не с классической головоломки Тетрис.

Обманчиво простой тетрис — отличный проект для тренировки основ.

Эта серия из 13 частей проведет вас через процесс создания клона тетриса с множеством маленьких подсказок.

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

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

Базовое 2D-освещение

Ознакомьтесь с учебным пособием

В этом видео из мегакурса Jerementor представлены методы освещения, доступные в Construct 2.

Используя некоторые базовые функции, пользователи Construct могут быстро добавлять динамические световые эффекты из нескольких ресурсов.

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

Также не бойтесь экспериментировать и проверять новые идеи. Это важная часть роста как разработчика игр.

Поиск пути

Ознакомьтесь с учебным пособием

Поиск пути — важный инструмент в наборе инструментов разработчика игр.

Он часто используется для добавления ИИ к игровым персонажам, и он существует уже некоторое время. От Pac-Man до Skyrim поиск пути использовался для создания уникального игрового процесса и добавления реалистичного поведения в наши любимые игры.

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

Construct 2 поставляется с некоторыми мощными встроенными инструментами поиска пути, но новичкам может быть сложно заставить их работать.

В этом руководстве предлагается простая демонстрация настройки основного поведения поиска пути.

Зомби-шутер с видом сверху

Ознакомьтесь с учебным пособием

Поклонники таких игр, как Hotline Miami или Nuclear Throne, захотят ознакомиться с этим многоэтапным учебным пособием по созданию зомби-шутера с видом сверху.

Джон Максим из ScirraVideos шаг за шагом проведет вас через процесс создания игры сверху вниз в Construct.

Попутно вы научитесь создавать контроллер персонажа и обрабатывать пользовательский ввод. Затем вы будете создавать врагов и пули со счетчиками урона.

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

Ознакомьтесь с учебным пособием

Эта серия видеороликов научит основам создания приключенческой игры. Вы можете использовать систему движений из этой серии для создания таких игр, как оригинальный Pokémon или The Binding of Issac.

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

Они помогут вам внедрить систему атаки, справиться с повреждениями, анимацией и использованием повторяющихся плиток. К концу у вас будут основы RPG.

Руководство по импорту листов спрайтов

Ознакомьтесь с учебным пособием

Обучение использованию листов спрайтов ускорит разработку и значительно облегчит вашу работу.

Объединяя анимации спрайтов на одном листе, вы можете намного проще управлять размерами файлов вашего проекта.

Использование листов спрайтов также упрощает изменение или добавление в анимацию позже.

Использование листов спрайтов в Construct 2 очень просто. Вы можете импортировать лист спрайтов, а затем обрезать отдельные кадры. Таким образом, компьютеру нужно загрузить только одно изображение для одного символа. Это более эффективно и, в конечном счете, проще в проектировании.

В этом руководстве показано, как создавать анимации из листа спрайтов и как импортировать их в работающую игру.

Видео длится менее четырех минут, но то, что вы узнаете, сэкономит вам часы времени на разработку.

Player Squash & Stretch

Ознакомьтесь с руководством

В этом видеоруководстве представлена концепция обратной связи в игровом дизайне.

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

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

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

Конструкт 2 Jumper Game

Ознакомьтесь с руководством

Этот краткий учебник от RedFoc за очень короткое время преподает большой объем информации.

Используя Construct 2 и некоторые бесплатные игровые ресурсы, вы создадите простой мир с прыгающим кроликом.

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

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

Вы найдете ресурсы Кенни, используемые во многих прототипах и учебных пособиях по всему Интернету.

RedFoc Complete Platformer

Ознакомьтесь с руководством

Вместе с RedFoc создайте классический 2D-платформер в стиле Super Mario.

Это видео поможет вам разобраться с основами, характерными для большинства 2D-игр.

Используя ресурсы, предоставленные RedFoc, вы создадите мир с движениями игроков, анимацией персонажей, обнаружением столкновений и параллаксным фоном. Прелесть Construct 2 в том, что вы можете делать все это без какой-либо кодировки .

Pixel Dungeon

Ознакомьтесь с руководством

Такие игры, как Hyper Light Drifter, Nuclear Throne и Celeste, помогли вернуть жанр пиксельной графики в мейнстрим.

С помощью этого видеоурока вы сможете создать простую бродилку по подземельям с пиксельной графикой на основе Construct 2.

Создать игру с пиксельной графикой проще, чем вы думаете. С таким игровым движком, как Construct 2, и программой рисования пикселей, такой как Aseprite, можно создавать игры за считанные месяцы или даже недели.

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

Автор: Джош Петти

Джош — художник и разработчик игр, специализирующийся на научной фантастике, фэнтези и абстрактном искусстве. В его работах используются яркие цвета и сочетаются элементы глитч-арта, аутрана, ретро-игр, нео-гео и концептуального искусства. Он обучался живописи маслом, прежде чем заняться 3D-моделированием, анимацией и программированием. Сейчас он руководит Brain Jar, небольшой студией разработки игр, которая специализируется на экспериментальном контенте, основанном на повествовании. Вы можете узнать больше на веб-сайте или в Twitter @brainjargames.

Руководство для начинающих по Construct 2

[ Руководство для начинающих по конструированию 2 было написано и опубликовано Эшли Галлен. Более подробную информацию о самом инструменте вы можете найти здесь. ]

Молодцы, что выбрали Construct 2! Давайте приступим к созданию вашей первой HTML5-игры. Мы будем делать демо-игру Ghost Shooter. Попробуйте сначала здесь, чтобы вы знали, к чему мы стремимся: игрок, который смотрит на мышь, перемещается с помощью клавиш со стрелками и стреляет в монстров с помощью мыши. Вы узнаете все, что нужно знать для создания простой игры — от уровней до системы событий!

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

Альтернативные учебники

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

Есть также «Как сделать клон астероидов в менее чем 100 событиях» от Kyatric, который немного более продвинутый, но также очень подробный.

Установка Construct 2

Если вы еще этого не сделали, скачайте копию последней версии Construct 2 здесь. Редактор Construct 2 предназначен только для Windows, но создаваемые вами игры можно запускать где угодно, например на Mac, Linux или iPad. Construct 2 также можно установить на ограниченные учетные записи пользователей. Он также портативный, поэтому вы можете установить его, например, на карту памяти USB и взять с собой!

Начало работы

Теперь вы настроили, запустите Construct 2. Нажмите кнопку File и выберите New .

В диалоговом окне New Project ничего менять не нужно. Просто нажмите Создать проект . Construct 2 сохранит для нас весь проект в одном файле . capx . Теперь вы должны смотреть на пустой макет — представление дизайна, в котором вы создаете и размещаете объекты. Думайте о макете как об игровом уровне или экране меню. В других инструментах это можно было бы назвать комната , сцена или кадр .

Вставка объектов

Мозаичный фон

Первое, что нам нужно, это повторяющаяся фоновая плитка. За нас это может сделать объект Tiled Background . Во-первых, вот ваша фоновая текстура — щелкните ее правой кнопкой мыши и сохраните ее где-нибудь на своем компьютере:

Теперь дважды щелкните место в макете, чтобы вставить новый объект. (Позже, если он заполнен, вы также можете щелкнуть правой кнопкой мыши и выбрать Вставить новый объект .) Когда появится диалоговое окно Вставить новый объект , дважды щелкните мозаичный фоновый объект , чтобы вставить его.

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

Закройте редактор текстур, нажав X в правом верхнем углу. Если появится запрос, обязательно сохраните! Теперь вы должны увидеть мозаичный фоновый объект в макете. Давайте изменим его размер, чтобы покрыть весь макет. Убедитесь, что он выбран, затем на панели свойств слева должны отображаться все настройки объекта, включая его размер и положение. Установите его позицию на 0, 0 (верхний левый угол макета) и его размер на 1280, 1024 (размер макета).

Давайте посмотрим на нашу работу. Держите управляйте и прокрутите колесико мыши вниз , чтобы уменьшить масштаб. В качестве альтернативы нажмите view — несколько раз уменьшите масштаб . Вы также можете удерживать пробел или среднюю кнопку мыши для панорамирования. Аккуратно, да? Мозаичный фон теперь должен покрывать весь макет:

Нажмите control+0 или щелкните вид — масштаб до 100% , чтобы вернуться к виду 1:1.

(Если вы так же нетерпеливы, как и я, щелкните маленький значок «Выполнить» в строке заголовка окна — должен появиться всплывающий браузер, показывающий ваш мозаичный макет! Ух!)

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

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

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

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

Вы должны увидеть Слой 0 в списке (Конструкция 2 считает, начиная с нуля, так как она работает лучше). в программировании). Щелкните значок карандаша и переименуйте его с на Фон , так как это наш фоновый слой. Теперь щелкните зеленый значок «Добавить», чтобы добавить новый слой для других наших объектов. Назовем его Main . Наконец, если вы щелкнете значок маленького замка рядом с Фон , он станет закрытым . Это означает, что вы не сможете ничего выбрать на нем. Это очень удобно для нашего мозаичного фона, который легко случайно выбрать, и его не нужно будет трогать снова. Однако, если вам нужно внести изменения, вы можете просто щелкнуть замок еще раз, чтобы разблокировать.

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

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

Добавьте объекты ввода

Вернитесь к макету. Дважды щелкните, чтобы вставить еще один новый объект. На этот раз выберите Объект Mouse , так как нам понадобится ввод с помощью мыши. Повторите то же самое для объекта Keyboard .

Примечание: эти объекты не нужно размещать в макете. Они скрыты и автоматически работают в рамках всего проекта. Теперь все макеты в нашем проекте могут принимать ввод с помощью мыши и клавиатуры.

Игровые объекты

Пришло время вставить наши игровые объекты! Вот ваши текстуры — сохраните их все на диск, как и раньше.

Игрок:

Монстр:

Пуля:

и Взрыв:

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

1. Дважды щелкните , чтобы вставить новый объект
2. Дважды щелкните объект «Спрайт».
3. Когда мышь превратится в перекрестие, щелкните где-нибудь на макете. Подсказка должна быть «Главная». (Помните, что это активный макет.)
4. Появится редактор текстур. Щелкните значок открытия, и загрузит одну из четырех текстур .
5. Закройте редактор текстур, сохранив изменения. Теперь вы должны увидеть объект в макете!

Примечание: еще один быстрый способ вставить объекты спрайта — перетащить файл изображения из Windows в область макета. Construct 2 создаст для вас спрайт с этой текстурой. Обязательно перетаскивайте каждое изображение по одному — если вы перетащите все четыре сразу, Construct 2 создаст один спрайт с четырьмя кадрами анимации.

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

Эти объекты будут называться Sprite , Sprite2 , Sprite3 и Sprite4 . Это не очень полезно — такие вещи быстро запутаются. Переименуйте их в Player , Monster , Bullet и Explosion по мере необходимости. Вы можете сделать это, выбрав объект, затем изменив Назовите свойство на панели свойств:

Добавление поведения

Поведение — это предварительно упакованная функциональность в Construct 2. Например, вы можете добавить поведение Platform к объекту и поведение Solid к полу, и вы мгновенно можете прыгать, как в платформере. Вы можете сделать то же самое в событиях, но это займет больше времени, и в любом случае это не имеет смысла, если поведение и так достаточно хорошее! Итак, давайте посмотрим, какое поведение мы можем использовать. Среди прочего, Construct 2 имеет такое поведение;

– 8 Направление движения . Это позволяет перемещать объект с помощью клавиш со стрелками. Это хорошо подойдет для движения игрока.
– Движение пули . Это просто перемещает объект вперед под его текущим углом. Это отлично сработает для пуль игрока. Несмотря на название, он также отлично подойдет для перемещения монстров, поскольку все, что он делает, — это перемещает объекты вперед с некоторой скоростью.
– Прокрутите до . Это заставляет экран следовать за объектом, когда он перемещается (также известный как прокрутка ). Это будет полезно для игрока.
– Привязан к макету . Это остановит выход объекта из области макета. Это также будет полезно для игрока, чтобы он не мог бродить за пределами игровой зоны!
– Уничтожить внешний макет . Вместо того, чтобы останавливать объект, покидающий область макета, это уничтожает его, если он это делает. Это полезно для наших пуль. Без него пули навсегда отлетали бы от экрана, всегда занимая немного памяти и вычислительной мощности. Вместо этого мы должны уничтожить пули, как только они покинут макет.
– Фейд . Это постепенно заставит объект исчезнуть, что мы будем использовать для взрывов.

Давайте добавим эти поведения к объектам, которые в них нуждаются.

Как добавить поведение

Давайте добавим поведение 8 направлений движения к игроку. Нажмите на плеер, чтобы выбрать его. На панели свойств обратите внимание на категорию Behaviors . Нажмите Добавить/Редактировать там. Откроется диалоговое окно Behaviors для игрока.

Щелкните зеленый значок «Добавить поведение» в диалоговом окне поведения. Дважды щелкните 8 направлений движения добавить.

Сделайте то же самое еще раз, но на этот раз добавьте поведение Scroll To , чтобы экран следовал за игроком, а также поведение Bound to layout , чтобы они оставались внутри макета. Диалоговое окно поведения теперь должно выглядеть следующим образом:

Закройте диалоговое окно поведения. Нажмите «Выполнить», чтобы попробовать игру!

Надеюсь, у вас установлен браузер, совместимый с HTML5. В противном случае обязательно установите последнюю версию Firefox, Chrome или Internet Explorer 9.если вы используете Vista и выше. Как только вы запустите игру, обратите внимание, что вы уже можете перемещаться с помощью клавиш со стрелками, а экран следует за игроком! Вы также не можете выйти за пределы области макета благодаря поведению Bound to Layout. Это то, для чего хороши поведения — быстрое добавление общих элементов функциональности. Вскоре мы будем использовать систему событий, чтобы добавить индивидуальную функциональность.

Добавление других поведений

Таким же способом мы можем добавить поведения к другим объектам – выберите его, нажмите Добавить/редактировать , чтобы открыть диалоговое окно поведения и добавить несколько вариантов поведения. Давайте добавим эти другие поведения:

— Добавьте Движение пули и Уничтожить внешний макет к объекту Пуля (никаких сюрпризов) также движется вперед)
— Добавьте поведение Fade к объекту Explosion (чтобы он постепенно исчезал после появления). По умолчанию поведение Fade также уничтожает объект после его исчезновения, что также избавляет нас от необходимости беспокоиться о невидимых объектах Explosion, забивающих игру.

Если вы запустите игру, вы заметите, что единственное отличие состоит в том, что монстры, которых вы видите, внезапно отстреливаются довольно быстро. Давайте замедлим их до неторопливого темпа. Выберите объект Monster . Обратите внимание, что с тех пор, как мы добавили поведение, на панели свойств появились дополнительные свойства:

Это позволяет нам настроить работу поведения. Измените скорость с 400 на 80 (в пикселях в секунду).

Аналогично измените Скорость объекта пули до 600 и Взрыв Поведение объекта Fade Время затухания до 0,5 (это полсекунды).

Создайте еще несколько монстров

Удерживая элемент управления, щелкните и перетащите объект Монстр . Вы заметите, что он порождает еще один экземпляр . Это просто еще один объект типа объекта Monster .

Типы объектов по сути являются «классами» объектов. В системе событий вы в основном имеете дело с типами объектов. Например, вы можете создать событие «Пуля сталкивается с Монстром». На самом деле это означает « Любой экземпляр объекта Bullet типа сталкивается с любым экземпляром объекта Monster типа — в отличие от необходимости создавать отдельное событие для каждого монстра. Со спрайтами все экземпляры типа объекта Кроме того, они имеют одну и ту же текстуру. Это отлично подходит для эффективности — когда игроки играют в вашу игру онлайн, вместо того, чтобы загружать 8 текстур монстров для 8 монстров, им нужно загрузить только одну текстуру монстра, а Construct 2 повторяет ее 8 раз. покрыть больше на типов объектов против экземпляров позже. На данный момент хороший пример для размышления: разные типы врагов — это разные типы объектов, тогда сами враги (которых может быть несколько) являются экземплярами этих типов объектов.

Используя управление + перетаскивание, создайте 7 или 8 новых монстров . Не размещайте слишком близко к игроку, иначе он может сразу умереть! Вы можете уменьшить масштаб с помощью Ctrl + колесо мыши вниз, если это помогает, и распределить их по всему макету. У вас должно получиться что-то вроде этого.

Теперь пришло время добавить нашу пользовательскую функциональность с помощью визуального метода программирования Construct 2 — системы событий .

События

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

О событиях

Как видно из текста на пустом листе, Construct 2 запускает все в листе событий один раз за тик. Большинство мониторов обновляют свое изображение 60 раз в секунду, поэтому Construct 2 будет стараться соответствовать этому показателю для максимально плавного отображения. Это означает, что лист событий обычно запускается 60 раз в секунду, каждый раз после чего следует перерисовка экрана. Вот что такое тик — одна единица «запустить события, затем отрисовать экран».

События запускаются сверху вниз, поэтому события в верхней части листа событий запускаются первыми.

Условия, действия и подсобытия

События состоят из условий , которые проверяют соответствие определенным критериям, например. «Пробел нажат?». Если все эти условия соблюдены, выполняются все действия события , например. «Создать объект пули». После выполнения действий также запускаются любые подсобытия — они могут затем проверять дополнительные условия, запускать дополнительные действия, затем дополнительные подсобытия и так далее. Используя эту систему, мы можем создавать сложные функции для наших игр и приложений. Однако в этом уроке нам не понадобятся подсобытия.

Давайте еще раз обсудим это. Короче говоря, событие в основном проходит так:

Все ли условия соблюдены?
—> Да : запустить все действия события.
—> Нет : перейти к следующему событию (не включая подсобытия).

Это немного упрощенно. Construct 2 предоставляет множество функций событий, чтобы охватить множество разных вещей, которые вам могут понадобиться. Однако на данный момент это хороший способ подумать об этом.

Ваше первое мероприятие

Мы хотим, чтобы игрок всегда смотрел на мышь. Когда мы закончим, это будет выглядеть так:

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

Давайте начнем делать это событие. Дважды щелкните пробел в листе событий. Это побудит нас добавить условие для нового события.

Различные объекты имеют разные состояния и действия в зависимости от того, что они могут делать. Есть еще Системный объект , представляющий встроенную функциональность Construct 2. Дважды щелкните Системный объект, как показано. Затем в диалоговом окне будут перечислены все условия объекта «Система»:

Дважды щелкните условие Каждый тик , чтобы вставить его. Диалоговое окно закроется, и событие будет создано без каких-либо действий. Теперь это должно выглядеть так:

Теперь мы хотим добавить действие, чтобы игрок смотрел на мышь. Нажмите Добавить действие ссылка справа от события. (Убедитесь, что вы получили ссылку «Добавить действие », , а не ссылку «Добавить событие » под ней, которая снова добавит совершенно другое событие.) Появится диалоговое окно «Добавить действие»:

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

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

Вместо установки угла игрока в несколько градусов удобно использовать действие Установить угол к положению . Это автоматически рассчитает угол от игрока к заданным координатам X и Y, а затем установит угол объекта на этот угол. Дважды щелкните действие Установить угол к положению .

Construct 2 теперь должен знать координаты X и Y, чтобы указать игроку:

Это называется параметрами действия. Условия тоже могут иметь параметры, но Каждый тик не нужны.

Мы хотим установить угол относительно положения мыши. Объект Mouse может предоставить это. Введите Mouse.X для X и Mouse.Y для И . Они называются выражениями . Они как суммы, которые вычисляются. Например, вы также можете ввести Mouse.X + 100 или sin(Mouse.Y) (хотя эти конкретные примеры могут оказаться не очень полезными!). Таким образом, вы можете использовать любые данные с любого объекта или любой расчет для отработки параметров в действиях и условиях. Он очень мощный и является своего рода скрытым источником гибкости Construct 2.

Вы получили сообщение об ошибке «Мышь не является именем объекта»? Убедитесь, что вы добавили объект Mouse! Вернитесь на страницу 2 и проверьте в разделе «Добавить объекты ввода».

Вам может быть интересно, как запомнить все возможные выражения, которые можно ввести. К счастью, есть «панель объектов», которую вы должны увидеть парящей над ней. По умолчанию он затемнен, чтобы не отвлекать вас.

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

В любом случае нажмите Готово в диалоговом окне параметров. Акция добавлена! Как вы уже видели, это должно выглядеть так:

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

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

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

1. Дважды щелкните, чтобы вставить новое событие, или щелкните ссылку Добавить действие , чтобы добавить действие.
2. Дважды щелкните объект, в котором находится условие/действие.
3. Дважды щелкните необходимое условие/действие.
4. Введите параметры, если они необходимы.

Отныне события будут описываться как объект, за которым следует условие/действие, за которым следуют любые параметры. Например, только что вставленное событие можно записать так:

Добавить условие Система -> Каждый тик
Добавить действие Игрок -> Установить угол относительно позиции -> X: Мышь.X , Y: Мышь.Y

Заставить игрока стрелять

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

Условие: Мышь -> При щелчке -> Щелчок левой кнопкой мыши (по умолчанию)
Действие: Игрок -> Создать другой объект -> Для Объект выберите объект Пуля . Для Layer введите 1 («Основной» слой — это слой 1 — помните, что Construct 2 считает с нуля). Оставьте Точку изображения как 0.

Теперь ваше событие должно выглядеть так:

Если вы запустите игру, вы заметите, что пули стреляют из середины игрока, а не из конца оружия. Давайте исправим это, поставив изображение точки на конце пистолета. (Точка изображения — это просто позиция на изображении, из которой вы можете создавать объекты. )

Щелкните правой кнопкой мыши проигрыватель в панели проекта или объекта и выберите Редактировать анимацию .

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

…и откроется диалоговое окно точек изображения:

Обратите внимание, что начало координат объекта отображается в виде красного пятна. Это «горячая точка» или «точка вращения» объекта. Если вы вращаете объект, он вращается вокруг начала координат. Мы хотим добавить еще одну точку изображения для представления пистолета, поэтому щелкните зеленую кнопку 9.0358 добавить кнопку . Появится синяя точка — это наша новая точка изображения. Щелкните левой кнопкой мыши на конце пистолета игрока, чтобы поместить туда точку изображения:

Закройте редактор изображений. Дважды щелкните действие Spawn an object , которое мы добавили ранее, и измените Image point на 1 . (Исходная точка всегда является первой точкой изображения, и помните, что Construct 2 отсчитывает от нуля.) Теперь событие должно выглядеть, как показано ниже — обратите внимание, что оно говорит: Точка изображения 1 сейчас:

Запустить игру. Пули теперь стреляют из конца вашего пистолета! Однако пули пока ничего не делают. Надеюсь, однако, вы начнете понимать, что как только вы освоитесь с системой событий, вы сможете очень быстро объединять функциональные возможности.

Давайте заставим пули убивать монстров. Добавьте следующее событие:

Условие: Пуля -> При столкновении с другим объектом -> выбор Монстр .
Действие: Монстр -> Destroy
Action: Bullet -> Spawn another object -> Explosion , layer 1
Action: Bullet -> Destroy

The explosion effect

Run the game, and try стрельба по монстру. Упс, у взрыва большая черная рамка!

Вы могли предвидеть, что это будет выглядеть так с самого начала, и задавались вопросом, действительно ли наша игра закончится именно так! Не волнуйтесь, этого не будет. Щелкните объект Explosion либо на панели объектов в правом нижнем углу, либо на панели проекта (на вкладке которой находится панель слоев). Его свойства отображаются на панели свойств слева. В нижней части установите для свойства Режим наложения значение Additive . Теперь попробуйте игру снова.

Почему это работает? Не вдаваясь в гайки и болты, обычные изображения наклеены поверх экрана. С аддитивным эффектом каждый пиксель вместо добавляется (как в сумме) с фоновым пикселем за ним. Черный — это нулевое значение пикселя, поэтому ничего не добавляется — вы не видите черного фона. Яркие цвета добавляют больше, поэтому кажутся более сильными. Он отлично подходит для взрывов и световых эффектов.

Делаем монстров немного умнее

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

Состояние: Система -> В начале макета
Действие: Монстр -> Установить угол -> random(360)

Они все равно будут блуждать навсегда, когда покинут макет, и их больше никогда не увидят. Давайте держать их внутри. Что мы сделаем, так это направим их обратно на игрока, когда они покинут макет. Это делает две вещи: они всегда остаются в пределах макета, и если игрок стоит на месте, монстры приходят прямо на них!

Состояние: Монстр -> Вне макета
Действие: Монстр -> Установить угол к позиции -> Для X, Player.X – для Y, Player.Y .

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

Теперь предположим, что мы хотим выстрелить в монстра пять раз, прежде чем он умрет, а не мгновенно умереть, как сейчас. Как мы это делаем? Если мы сохраним только один счетчик «Здоровья», то после того, как мы ударим монстра пять раз, все монстров умрут. Вместо этого нам нужно каждого монстра, чтобы помнить свои собственных здоровья. Мы можем сделать это с переменными экземпляра .

Переменные экземпляра

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

Давайте добавим здоровье экземпляра нашего монстра. Щелкните монстра на панели проекта или панели объектов. Кроме того, вы можете вернуться к макету и выбрать объект-монстр. Это покажет свойства монстра на панели свойств. Нажмите Добавить/редактировать по Редактировать переменные .

Появится диалоговое окно «Переменные экземпляра». Он похож на диалог Behaviors, который мы видели ранее, но вместо этого позволяет добавлять и изменять переменные экземпляра для объекта. Нажмите зеленый Добавить 9Кнопка 0005 для добавления нового.

В появившемся диалоговом окне введите health в качестве имени, оставьте Введите как Номер , а для Начальное значение введите 5 (как показано). Это начинает каждого монстра с 5 единицами здоровья. Когда они получают удар, мы вычитаем 1 из здоровья, а затем, когда здоровье равно нулю, мы уничтожаем объект.

Когда закончите, нажмите OK. Обратите внимание, что переменная теперь появляется в диалоговом окне переменных экземпляра, а также в свойствах монстра. (Вы можете быстро изменить начальные значения на панели свойств, но чтобы добавить или удалить переменные, вам нужно нажать кнопку Добавить/редактировать ссылку . )

Изменение событий

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

Найдите событие, которое гласит: Пуля — при столкновении с Монстром . Обратите внимание, что у нас есть действие «уничтожить монстра». Давайте заменим это на «вычесть 1 из здоровья». Щелкните правой кнопкой мыши действие «уничтожить монстра» и выберите «Заменить ».

Появится тот же диалог, как если бы мы вставляли новое действие, но на этот раз оно заменит действие, которое мы щелкнули. Выберите Монстр -> Вычтите из (в категории Переменные экземпляра ) -> Переменная экземпляра «здоровье» и введите 1 для Значение . Щелкните Готово . Теперь действие должно выглядеть так:

Теперь, когда мы стреляем в монстров, они теряют 1 здоровье и пуля взрывается, но мы не сделали событие для убийства монстров, когда их здоровье достигает нуля. Добавить другое событие:

Условие: Монстр -> Сравнить переменную экземпляра -> Здоровье, Меньше или равно , 0
Действие: Монстр -> Создать другой объект -> Взрыв, слой 1
Действие: Монстр -> Уничтожить

Почему «меньше или равно 0», а не « равно 0″? Предположим, мы добавили еще одно более мощное оружие, которое вычитало 2 из здоровья. Когда вы стреляли в монстра, его здоровье уменьшалось на 5 , 3 , 1 , -1 , -3 … заметьте, ни в коем случае не было его здоровья сразу равно нулю , так что он никогда не умрет! Поэтому рекомендуется использовать «меньше или равно», чтобы проверить, не закончилось ли здоровье чего-либо.

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

Ведение счета

Давайте подведем счет, чтобы игрок знал, насколько хорошо он справился. Для этого нам понадобится еще одна переменная. Вы можете подумать: «Давайте сделаем счет одной из переменных экземпляра игрока!». Это неплохая первая идея, но помните, что значение хранится «внутри» объекта. Если нет экземпляров, нет и переменных! Поэтому, если мы уничтожим игрока, мы больше не сможем сказать, какой у него был счет, потому что он был уничтожен вместе с игроком.

Вместо этого мы можем использовать глобальную переменную . Как и переменная экземпляра, глобальная переменная (или просто «глобальная») может хранить текст или число. Каждая переменная может хранить одно число или один фрагмент текста. Глобальные переменные также доступны для всей игры во всех раскладках — удобно, если мы добавим другие уровни.

Щелкните правой кнопкой мыши место в нижней части листа событий и выберите Добавить глобальную переменную .

Введите Оценка в качестве имени. Другие значения по умолчанию в порядке, это сделает его числом, начинающимся с 0.

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

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

Давайте дадим игроку очко за убийство монстра. В нашем событии «Монстр: здоровье меньше или равно 0» (при смерти монстра) нажмите Добавьте действие и выберите Система -> Добавить к (в разделе Глобальные и локальные переменные) -> Оценка , значение 1 . Теперь событие должно выглядеть так:

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

Создание проекционного дисплея (HUD)

Проекционный дисплей (также известный как HUD) — это интерфейс, который показывает здоровье игрока, счет и другую информацию в игре. Давайте сделаем очень простой HUD из текстового объекта.

HUD всегда остается на одном и том же месте на экране. Если у нас есть какие-то объекты интерфейса, мы не хотим, чтобы они прокручивались, когда игрок ходит — они должны оставаться на экране. По умолчанию слои прокручиваются. Чтобы сохранить их на экране, мы можем использовать параметр Layer Parallax . Параллакс позволяет прокручивать разные слои с разной скоростью для создания полу-3D-эффекта. Однако если мы установим параллакс на ноль, слой вообще не будет прокручиваться — идеально для HUD.

Вернитесь к панели слоев, которую мы использовали ранее. Добавьте новый слой под названием 9.0358 ИЛС . Убедитесь, что он находится вверху и выбран (помните, что это делает его активным слоем). Панель свойств теперь должна отображать свои свойства. Установите для свойства Parallax значение 0, 0 (это ноль по обеим осям X и Y).

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

Вернуться к списку событий. Давайте будем обновлять текст с помощью счета игрока. В добавленное ранее событие Every tick добавьте действие Text -> Set text .

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

«Оценка: » & Очки

Первая часть ( «Оценка: » ) означает, что текст всегда будет начинаться с фразы Оценка: . Вторая часть ( Score ) — это фактическое значение глобальной переменной Score. и объединяют их в один фрагмент текста.

Запустите игру и подстрелите монстров. Ваша оценка отображается, и она остается в том же месте на экране!

Последние штрихи

Мы почти закончили. Добавим последние штрихи.

Во-первых, пусть некоторые монстры спавнятся регулярно, иначе после того, как вы перестреляете всех монстров, делать будет нечего. Мы будем создавать нового монстра каждые 3 секунды. Добавить новое событие:

Условие: Система -> Каждые X секунд -> 3
Действие: Система -> Создать объект -> Монстр , слой

4 1

, (0 40004 , 0 40004 , random(1024) (для Y)
1400 — координата X сразу за правым краем макета, а random(1024) — случайная координата Y высоты макета.
Наконец, пусть призраки убивают игрока.
Условие: Монстр -> При столкновении с другим объектом -> Игрок
Действие: Игрок -> Уничтожить
Заключение
Поздравляем, вы сделали первую игру HTML2 ! Если у вас есть сервер и вы хотите показать свою работу, нажмите Export в меню File. Construct может сохранять все файлы проекта в папку на вашем компьютере, которую вы можете загрузить или интегрировать на веб-страницу. Если у вас нет собственного сервера, вы можете поделиться своими играми в Dropbox.
Вы узнали некоторые важные основы Construct2: вставка объектов, использование слоев, поведение, события и многое другое. Надеюсь, это подготовит вас к тому, чтобы узнать больше о Construct 2! Попробуйте изучить его функции и посмотреть, что он может сделать для вас.
Готовая вещь
Попробуйте скачать готовый обучающий проект. Я добавил некоторые дополнительные функции, такие как текст «Игра окончена» и монстров, которые постепенно ускоряются. Зная то, что вы знаете сейчас, не должно быть сложно понять, как это работает. Есть также много комментариев, описывающих, как это работает.
Молодец! Если у вас есть какие-либо проблемы или вы считаете, что какую-либо часть этого руководства можно улучшить, оставьте комментарий или напишите нам сообщение на форуме. Посмотрим, что мы сможем сделать!
Наконец, если вам понравился этот урок и вы думаете, что кому-то из ваших знакомых может также понравиться Construct 2, почему бы не отправить им ссылку на этот урок? Наверняка не помешает 🙂
Читать далее
Хотите добавить музыку и звуковые эффекты? См. «Звуки и музыка» в руководстве для краткого обзора.
Вас может заинтересовать наш альтернативный учебник для начинающих, основанный на платформере, Как сделать платформерную игру.
Если вы хотите узнать больше о том, как работают события в Construct 2, см. раздел «Как работают события» в руководстве. Настоятельно рекомендуется, чтобы вы могли быстро приступить к своим собственным проектам! Тогда для получения дополнительной информации не забывайте, что в руководстве есть полная документация.
[ Руководство для начинающих по конструированию 2 было написано и опубликовано Эшли Галлен. Более подробную информацию о самом инструменте вы можете найти здесь. ]
—
У вас есть учебник по разработке игр, которым вы хотели бы поделиться на Develop? Свяжитесь с Крейгом Чапплом по адресу [email protected], чтобы принять участие.
Как изучить Construct 2 бесплатно
Construct 2 — это игровой движок на основе HTML5, разработанный Scirra. Хотя игровой движок разработан с нуля для создания 2D-игр, его также можно использовать для разработки широкого спектра приложений, особенно образовательных. Любой может использовать конструкцию 2 для разработки игры/приложения, поскольку она не требует каких-либо предварительных знаний в области программирования, логика игры/приложения создается с помощью визуального редактора простым перетаскиванием.
Приложения и игры, созданные с помощью Construct 2, можно экспортировать для работы на Android, iOS, Windows, Firefox OS, браузере/ОС Chrome, Kongregate, Tizen, Windows Phone, BlackBerry и любом современном веб-браузере.
Learning Construct 2 очень полезен для всех, кто хочет начать разработку игр и не имеет предварительных знаний в области программирования, также полезен для учителей, которые хотят создавать простые обучающие игры/приложения, а также полезен для детей, чтобы понять логику за создание игры и вовлечение их в программирование.
Цель этого поста — представить и сравнить бесплатные онлайн-источники, на которые могут положиться новички при изучении Construct 2. Источники, указанные здесь, представляют собой полноценные курсы, которым могут следовать новички.
Если вам нужен только итог (дорожная карта для изучения Construct 2) и вы не хотите читать всю статью, перейдите к разделу «Итог» в конце статьи.
Microsoft Virtual Academy
Microsoft Virtual Academy — это первая бесплатная онлайн-площадка, где новички могут начать изучать Construct 2 с помощью видеоуроков. Вам не нужно регистрироваться, чтобы получить доступ к обучению.
Структура: обучение разделено на 4 основных раздела, каждый раздел представляет собой отдельное видео, которое охватывает различные темы в Construct 2, вы можете либо просмотреть видео от начала до конца, либо просмотреть интересующий вас сегмент в разбивке доступные сегменты. В конце каждого раздела есть оценка для измерения вашего понимания этого раздела.
Интерфейс: Интерфейс простой, просто нажмите на список в боковом меню, и появится список доступных разделов, просто нажмите на раздел, затем на интересующий вас урок, и сразу начнется видео.
Теперь плюсы и минусы:
Плюсы
Бесплатно.
Обучение хорошо структурировано и организовано для начинающих.
Раздел оценок очень полезен.
Минусы
Обучение не охватывает последнюю версию Construct 2, но это не будет проблемой для начинающих.
Вердикт: это лучший выход для новичков, чтобы начать изучать Construct 2 с помощью видеоуроков.
Изучите конструкцию 2
Learn Construct 2 — это второй бесплатный онлайн-магазин, где новички могут начать изучать Construct 2 с помощью видеоуроков. Вам не нужно регистрироваться, чтобы получить доступ к обучению.
Структура: Обучение разделено на 8 видеоуроков, каждый видеоурок посвящен определенным темам Construct 2.
Интерфейс: Интерфейс очень простой, просто нажмите на интересующий вас видеоурок и он сразу начнется .
Теперь плюсы и минусы;
Плюсы
Бесплатно.
Обучение охватывает многие темы, с которыми новички должны ознакомиться, чтобы начать использовать Construct 2.
Минусы
Обучение плохо организовано и структурировано для начинающих.
Обучение не охватывает последнюю версию Construct 2, но это не будет проблемой для начинающих.
Вердикт: это хороший выход для новичков, чтобы начать изучать Construct 2 с помощью видеоуроков.
ConstructG
ConstructG — третья бесплатная онлайн-площадка, где новички могут начать изучать Construct 2 с помощью видеоуроков, так как в вышеупомянутой торговой точке вам не нужно регистрироваться, чтобы получить доступ к обучению.
Структура: обучение проводится в стиле «учись, делая», вы изучаете Construct 2, создавая игру-платформер, обучение разделено на 9 видеоуроков, каждый урок охватывает определенные темы Construct 2.
Интерфейс: Интерфейс очень простой , просто нажмите на интересующий вас урок в плейлисте, и видео запустится.
Теперь плюсы и минусы:
Плюсы
Бесплатно.
Обучение хорошо структурировано и организовано для начинающих.
Минусы
Обучение не охватывает последнюю версию Construct 2, но это не будет проблемой для начинающих.
Вердикт: это отличный выход для новичков, чтобы начать изучать Construct 2 с помощью видеоуроков.
Канал Construct 2 Academy на YouTube
Канал Construct 2 Academy на YouTube — это четвертый бесплатный онлайн-канал, где новички могут начать изучать Construct 2 с помощью видеоуроков, созданных Scirra, компанией, разрабатывающей Construct 2.
Структура: обучение проводится в стиле, описанном выше, вы изучаете Construct 2 посредством создания игр, обучение разделено на 7 видеоуроков, каждый урок охватывает определенные темы в Construct 2.
Интерфейс: стандартный интерфейс YouTube .
Теперь плюсы и плюсы:
Плюсы
Бесплатно.
Обучение охватывает основы, с которыми должны ознакомиться новички, чтобы начать использовать Construct 2.
Минусы
Обучение не охватывает последнюю версию Construct 2, но это не будет проблемой для начинающих.
Вердикт: это очень хороший выход для новичков, чтобы начать изучать Construct 2 с помощью видеоуроков.
Веб-сайт Scirra
Веб-сайт Scirra — пятое бесплатное онлайн-издание, где новички могут начать изучать Construct 2 с помощью текстового руководства. Вам не нужно регистрироваться, чтобы получить доступ к обучению.
Структура: обучение проводится в стиле «учись делать», вы изучаете Construct 2, создавая шутер, обучение разделено на 7 веб-страниц.
Интерфейс: Интерфейс очень простой, просто следуйте обучению от начала до конца.
Теперь плюсы и минусы:
Плюсы
Бесплатно.
Обучение охватывает основы, с которыми должны ознакомиться новички, чтобы начать использовать Construct 2.
Минусы
Как и выше, обучение не охватывает последнюю версию Construct 2, но это не будет проблемой для начинающих.
Вердикт: это лучший выход для начинающих, чтобы начать изучение Construct 2 с помощью текстовых руководств.
Bottom Line
Рецепт для изучения Construct 2:
Виртуальная академия Microsoft — лучший способ начать изучение Construct 2 с помощью видеоруководства.
Веб-сайт Scirra — лучший способ для начинающих изучать Construct 2 с помощью текстового руководства.
Помните, что первый шаг всегда самый сложный, и цель этой публикации — предоставить вам ресурсы, которые помогут вам сделать первый шаг в изучении Construct 2.
Нравится:
Нравится Загрузка…
[Архив] Construct 2 Minimap Tutorial • MadameBerry Studios
Архивы, Разработка игр
Часть первая: Настройка
Несколько лет назад я написал руководство для блога, в котором подробно описывалось, как создать миникарту HUD в Construct 2. С тех пор я сменил веб-хост, и эта запись в блоге была утеряна, и (что более важно) С тех пор Construct 2 добавил объект Tilemap, который изменил все. (Да, предыдущий пост был очень старым.)
В любом случае, мне давно пора переписать этот пост в блоге.
Начнем!
Настройка ваших комнат для мини-карты
В этом руководстве не рассматривается остальная часть вашей игры, включая механику движения (я просто использую поведение платформера по умолчанию для целей этого руководства), камеру, переходы между комнатами и т. д. Это руководство также ориентирован на платформеры, но может работать и с картами сверху вниз.
Вам также потребуется завершенная карта мира вашей игры и он должен быть в формате сетки (тайловые карты работают в сетке). Каждая ячейка или квадрант комнаты должны быть размером с экран окна вашей игры по умолчанию. Ваши комнаты не обязательно должны быть квадратными, но с каждой стороны должны быть кратны исходному размеру окна . Например, если ваша игра работает в разрешении 640×480, каждый квадрат в сетке должен представлять собой область размером 640×480. Комната размером 2 на 2 клетки на вашей карте будет игровой комнатой размером 1280×960.
Это карта с тремя комнатами, которую я буду использовать в этом уроке. Обратите внимание, что я пронумеровал координаты X и Y каждой комнаты. Эти координаты будут использоваться на протяжении всего процесса.

Начните с создания нового слоя в Construct 2. Этот слой должен быть глобальным и должен иметь скорость параллакса 0,0 , что означает, что он не будет двигаться. Назовите его, например, MapHud. Создайте один и тот же слой в каждом макете, который будет содержать мини-карту, и убедитесь, что он каждый раз имеет одно и то же имя. Вы заметите, что больше не можете редактировать этот слой ни в каком макете, кроме того, который вы создали в первый раз. Это связано с тем, что он глобальный и будет автоматически реплицироваться в любой новый макет.
Одним из важных аспектов этого слоя является то, что вы должны установить для параметра «Принудительно использовать собственную текстуру» значение Да . Используется для хранения миникарты определенного размера.

Создайте новый спрайт с именем MapBG на слое MapHud. Установите сплошной цвет (подойдет любой цвет). Если вы хотите, вы можете дать ему вторую анимацию, которая является пансионом, который будет сидеть на верхнем украшении. Граница необязательна.
Затем создайте объект Tilemap на MapHud. Этот объект станет миникартой. Цель состоит в том, чтобы каждая комната отображалась на карте так, как ее находит игрок, поэтому вам не нужно рисовать плитки на объекте tilemap. Размер плитки может быть любым по вашему выбору. Я использую сетку 10×10. Каждая квадратная плитка будет представлять одну секцию или квадрант карты, которую вы нарисовали ранее, поэтому важно, чтобы ваша карта была основана на сетке.
Важным аспектом этого объекта является то, что его режим наложения установлен на Source Atop , и он должен быть помещен поверх объекта MapBG. Это замаскирует объект, чтобы карта соответствовала размеру объекта MapBG. Любые плитки, которые были найдены, но находятся слишком далеко в стороне, будут автоматически замаскированы как невидимые.
Вам нужно будет определить, что вы хотите отобразить на мини-карте. Чем сложнее ваша мини-карта, тем сложнее настройка — отображение простой карты «найдено/ненайдено» будет намного проще, чем карта, на которой отображаются стены, двери, предметы и т. д.
Нарисуйте изображение тайловой карты с помощью графического редактора Construct 2 или предпочитаемого графического редактора, учитывая размер сетки и нужные тайлы.
Построить 2 тайла карты номеров слева направо, начиная с нуля. Вот карта тайлов, которую я использовал в этом примере, с добавленными номерами для обозначения номеров тайлов, которые назначает Construct.
Создать массив. Этот массив будет использоваться для хранения тайла, используемого для представления каждого квадрата карты. Если вы используете простую систему бинарных квадратов «найдено/ненайдено», вам это не нужно — просто предположим, что все квадраты карты будут представлены тайлом 0. Кроме того, если вы создаете игру с процедурной генерацией, этот шаг можно включены в генерацию карты.
Каждая ячейка в массиве представляет координаты X, Y каждого квадрата карты. Значение представляет собой номер плитки, используемой для отображения этого квадрата. Вам не нужно указывать значения массива для любых пустых ячеек, не содержащих комнат.
Карта, используемая в этом примере, содержит следующий массив:
Существует также другой метод, который не требует выполнения этого шага. Он использует спрайт карты, замаскированный тайловой картой. Это хорошо работает для игр с ручным дизайном уровней, но не работает для игр с процедурной генерацией. Я напишу в блоге об этом в другой раз.
После завершения настройки пришло время начать кодирование мини-карты.

Пожалуйста, прочтите страницу 2 для части кодирования этого руководства.
1 2
3 января 2019 г. админ помеченный кодирование, конструкция 2, дизайн игры, разработка игр, как, инди-разработка, инди-игры, инди-разработчик, мини-карта, программирование, scirra, учебник
Виджеты
©MadameBerry Games LLC
contact@madameberry. com
Рисование диаграмм свободного тела
Диаграммы свободного тела — это диаграммы, используемые для отображения относительной величины и направления всех сил, действующих на объект в данной ситуации. Диаграмма свободного тела — это особый пример векторных диаграмм, которые обсуждались в предыдущем разделе. Эти диаграммы будут использоваться на протяжении всего нашего изучения физики. Размер стрелки на диаграмме свободного тела отражает величину силы. Направление стрелки показывает направление действия силы. Каждая стрелка силы на диаграмме помечена, чтобы указать точный тип силы. Обычно на диаграмме свободного тела объект изображают в виде прямоугольника, а стрелку силы проводят из центра прямоугольника наружу в направлении действия силы. Пример диаграммы свободного тела показан справа
На приведенной выше диаграмме свободного тела показаны четыре силы, действующие на объект. На объекты , а не обязательно всегда действуют четыре силы. Будут случаи, когда количество сил, изображенных на диаграмме свободного тела, будет равно одному, двум или трем. Не существует жесткого правила о количестве сил, которые должны быть изображены на диаграмме свободного тела. Единственное правило для рисования диаграмм свободного тела состоит в том, чтобы изобразить все силы, которые существуют для этого объекта в данной ситуации. Таким образом, для построения диаграмм свободного тела чрезвычайно важно знать различные виды сил. Если вам дано описание физической ситуации, начните с использования вашего понимания типов сил, чтобы определить, какие силы присутствуют. Затем определите направление, в котором действует каждая сила. Наконец, нарисуйте прямоугольник и добавьте стрелки для каждой существующей силы в соответствующем направлении; пометьте каждую стрелку силы в соответствии с ее типом. При необходимости обратитесь к списку сил и их описанию, чтобы понять различные типы сил и их соответствующие символы.

Мы хотели бы предложить …
Иногда недостаточно просто прочитать об этом. Вы должны взаимодействовать с ним! И это именно то, что вы делаете, когда используете один из интерактивов The Physics Classroom. Мы хотели бы предложить вам совместить чтение этой страницы с использованием нашей интерактивной диаграммы свободного тела. Вы можете найти его в разделе Physics Interactives на нашем сайте. Интерактивная диаграмма свободного тела позволяет учащемуся практиковаться в определении сил, действующих на объект, и выражать такое понимание путем построения диаграммы свободного тела.

Посетите: Free-Body Diagram

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

Книга лежит на столе. Изобразите силы, действующие на книгу. Смотрите ответ.
Гимнастка, держащаяся за перекладину, неподвижно висит в воздухе. Перекладина поддерживается двумя веревками, которые крепятся к потолку. Изобразите силы, действующие на комбинацию гимнастки и штанги. Смотрите ответ.
Яйцо свободно падает из гнезда на дереве. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на яйцо при его падении. Смотрите ответ.
Белка-летяга скользит (без крыла закрылков ) с дерева на землю с постоянной скоростью. Учитывайте сопротивление воздуха. Изобразите силы, действующие на белку. Смотрите ответ.
К книге приложена сила, направленная вправо, чтобы переместить ее по столу с ускорением вправо. Рассмотрим силы трения. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на книгу. Смотрите ответ.
К книге приложена сила, направленная вправо, чтобы переместить ее по столу с постоянной скоростью. Рассмотрим силы трения. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на книгу. Смотрите ответ.
Студент колледжа кладет на плечо рюкзак. Рюкзак подвешен неподвижно на одной лямке с одного плеча. Изобразите вертикальные силы, действующие на рюкзак. Смотрите ответ.
Парашютист спускается с постоянной скоростью. Учитывайте сопротивление воздуха. Изобразите силы, действующие на парашютиста. Смотрите ответ.
Сила приложена вправо, чтобы тащить сани по рыхлому снегу с ускорением вправо. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на сани. Смотрите ответ.
Мяч движется вверх к своей вершине после того, как игрок забил бутс. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на футбольный мяч, когда он поднимается вверх к своей вершине. Смотрите ответ.
Автомобиль движется вправо и замедляется. Сопротивлением воздуха пренебречь. Изобразите силы, действующие на автомобиль. Смотрите ответ.

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

1. На столе лежит книга. Диаграмма свободного тела для этой ситуации выглядит так:
Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

2. Гимнастка, держась за перекладину, неподвижно подвешена в воздухе. Перекладина поддерживается двумя веревками, которые крепятся к потолку. Изобразите силы, действующие на комбинацию гимнастки и штанги. Диаграмма свободного тела для этой ситуации выглядит так:
Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Возврат к списку описаний 9 в режиме онлайн0006

3. Яйцо свободно падает из гнезда на дереве. Сопротивлением воздуха пренебречь. Диаграмма свободного тела для этой ситуации выглядит следующим образом:

Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

4. Белка-летяга скользит (без крыльев закрылков ) с дерева на землю с постоянной скоростью. Учитывайте сопротивление воздуха. Диаграмма свободного тела для этой ситуации выглядит так:
Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

5. К книге приложена сила, направленная вправо, чтобы переместить ее по столу с ускорением вправо. Рассмотрим силы трения. Сопротивлением воздуха пренебречь. Диаграмма свободного тела для этой ситуации выглядит так:
Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

6. К книге приложена сила, направленная вправо, чтобы переместить ее по столу с постоянной скоростью. Рассмотрим силы трения. Сопротивлением воздуха пренебречь. Диаграмма свободного тела для этой ситуации выглядит следующим образом:

Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

7. Студент колледжа кладет на плечо рюкзак. Рюкзак подвешен неподвижно на одной лямке с одного плеча. Диаграмма свободного тела для этой ситуации выглядит следующим образом:

Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

8. Парашютист спускается с постоянной скоростью. Учитывайте сопротивление воздуха. Диаграмма свободного тела для этой ситуации выглядит так:

Вернуться к вопросам
Вернуться к информации о диаграммах свободного тела
Вернуться к онлайн-списку описаний

9.