Как сделать свой tower defense

Как написать игру в стиле Tower Defense

Вид с Башни из Слоновой Кости

Если вы не знакомы с жанром, Tower Defence представляет собой стратегическую игру, где игрок покупает и располагает вооруженные башни в стратегических точках, чтобы остановить волны врагов, которые пытаются достичь базы и уничтожить ее.
Каждая последующая волна врагов обычно сильнее предыдущей, достигается это за счет увеличения устойчивости к вашему оружию и способности быстрее двигаться. Игра заканчивается в случае, когда вы выстояли все волны врагов(Победа!), либо же в случае когда враги добрались до базы и уничтожили ее(Проигрыш!).
Вот скриншот игры, которую мы закончим писать в конце урока:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Подготовка ресурсов
Установка башен

Вначале, добавьте фоновую картинку на сцену. Откройте класс HelloWorldLayer.m и добавьте следующие строчки кода внутрь условия «if» в методе «init»:

Первая строчка в разделе #1 позволяет слою принимать события касания. Остальная часть кода в разделе #2 добавляет фоновый спрайт на нашу сцену.
Фоновая картинка помогает увидеть, где игрок может ставить башни. Теперь вам нужно задать несколько точек на экране, касаясь которых игрок сможет строить башни.
Чтобы сохранить смысл наших действий, все точки будут находиться в файле «.plist», в котором их можно будет легко изменить. TowerPosition.plist находится в папке Resources и уже содержит несколько позиций для постройки башен внутри.
Рассмотрите этот файл, вы найдете массив словарей, которые содержат всего два ключа: «x» и «y». Каждый словарь представляет собой позицию башни по ее координатам на экране. Теперь вам нужно прописать этот файл и установить базы для башен на карте.
Откройте HelloWorldLayer.h и добавьте следующую переменную (внутрь фигурных скобок после строчки interface):

Внесите следующие изменения в HelloWorldLayer.m:

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Синтезируйте переменную башен в HelloWorldLayer.m ниже строчки @implementation:

Затем, создайте новый класс, который будет представлять башни. Добавьте новый файл из шаблона iOS\Cocoa Touch\Objective-C. Назовите класс Tower, и сделайте его подклассом CCNode.
Замените содержимое Tower.h следующим:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense
Но к чему все это вооружение без «плохих парней», давайте позовем их на вечеринку!

Политика игры: Враги, Волны и Вэйпоинты

Добавьте следующий код в HelloWorldLayer.m:

Скомпилируйте и запустите игру:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Далее откройте HelloWorldLayer.m и добавьте следующие строки в конец файла (перед end):

Внесите следующие изменения в HelloWorldLayer.m:

Переключитесь на HelloWorldLayer.m и опишите метод:

Все выше написанное достойно объяснения. Самая важная часть- метод LoadWave; он считывает данные из Waves.plist.
Взгляните на Waves.plist, и вы заметите, что он содержит 3 массива. Каждый из них представляет собой волну, которая является группой врагов, появляющихся вместе. Первый массив содержит шесть словарей. Каждый словарь представляет собой врага. В этом уроке, словарь хранит только время появления врага, но может содержать в себе тип врага, его способности, здоровье и т.д.
Метод loadWave проверяет, должна ли появиться следующая волна, создает соответствующих врагов, основываясь на информации о волне, и расписывает их время появления соответственно.
Метод enemyGotKilled проверяет количество врагов на экране, если их нет, вызывает следующую волну. Позже этот же метод будет использован для проверки победы игрока.
Скомпилируйте и запустите игру сейчас. Враги двигаются к вашей базе!

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Атака башен

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Осталось добавить всего несколько деталей, чтобы получить готовую версию tower defense. Неплохо бы добавить звуковые эффекты, научить базу получать урон от врагов и ограничить количество золота игрока.

Финальные штрихи

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

Теперь откройте HelloWorldLayer.m и внесите следующие изменения:

Это добавляет метод, который уменьшает количество жизней игрока, обновляет надпись и проверяет, закончились ли жизни у игрока. Если да, игре конец!
Метод getHpDamage вызывается, когда враг достигает базы. Вы ранее уже добавили его в update метод в Enemy.m.
Скомпилируйте и запустите игру. Позвольте врагам дойти до вашей базы. Вы должны увидеть, как количество ваших жизней уменьшается, пока игра не оканчивается.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Пришло время урезать бюджет!
Множество игр внедряют опцию “zero-sum”, предоставляя игроку ограниченное количество ресурсов на постройку в начале игры. Ваша игра будет иметь нечто похожее, но в упрощенном виде.
Откройте HelloWorldLayer.h и добавьте следующие переменные:

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

Теперь откройте HelloWorldLayer.m и сделайте следующее:

Новый код вверху проверяет, хватает ли золота каждый раз, как игрок строит башню. Если хватает, башня строится, цена башни вычитается из количества золота игрока. Нужно также награждать игрока за убийство врагов.
Добавьте следующую строчку в метод getDamaged:(внутри условия “if”) в Enemy.m:

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

Источник

Tower Defence на движке Unity — Часть 1

Привет всем! Это моя первая статья для хабра и она предназначена для новичков. В ней я хотел бы рассказать о том, как создать маленькую 3D игру жанра Tower Defence на движке Unity.

Я как и вы только изучаю этот движок. Учусь вместе с вами и могу допускать ошибки. Если статья интересна, то прошу пожаловать под кат! Только осторожно, там очень много картинок…

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Начало

Запустим Unity. У меня стоит Unity Personal. Создадим новый проект под названием «MyTowerDefence». Игра будет трёхмерной, аналитику Unity мы использовать не будем.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Создадим 3 новые папки:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Сторожевая башня

Теперь создадим пустой объект. Его не видно на сцене. Назовём его «Tower» — «Башня». В данном случае он будет главным объектом дерева сторожевой башни. Позицию созданных объектов поставим по нулям.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Закинем объект «Body» в объект «Tower».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Изменим масштаб тела башни.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Создадим новый объект куб. Позицию выставим в ноль и немного сплющим куб по координате Y.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Назовём куб «Head» — «Голова». Поставим голову на место и приклеим её к объекту «Tower».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Теперь нам нужна пушка. Создаём новый куб с именем «Gun» — «Пушка». Делаем так, что бы куб хотя бы отдалённо напоминал её.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Нужен ещё один вспомогательный объект, который будет центром вращения пушки. Создадим пустой объект и привяжем к нему объект «Gun». А его привяжем к объекту «Tower».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Настраиваем позицию пушки.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Сохраним сцену с любым именем. Создадим папку для хранения сцен и поместим созданную сцену туда. Теперь наведём красоту. В папке материалов создаём новый материал с именем «TowerBody».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Зададим цвет и применим материал к телу башни, перетащив его из окна «Project» на объект.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Дублируем материал с новым именем «TowerHead». Выполняем аналогичные действия для головы. Также поступим и для пушки.
Всё, красоту навели.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Заставим её вращаться вместе с головой, переместив вспомогательный объект пушки в объект «Head».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Повращаем пушку. И тут мы видим, что то необъяснимое… (Мелодия «Секретные материалы»)

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Ну да ладно, к этому мы вернёмся дальше, когда будем вращать пушку при помощи скрипта. Создадим из объекта «Tower» новый префаб, перетащив его в папку «Prefabs».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Оригинал башни удаляем со сцены.

Поле битвы

Создадим объект плоскость. На плоскости будет происходить вся тусовка. Применим к ней любой материал.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Переименуем плоскость в «Ground».

Нам нужна платформа для возможности установки на ней сторожевой башни. Для этого создадим куб, позицию проставим по нулям и сплющим его по оси Y. Также, отключим отбрасывание тени. Назовём куб «TowerPlace».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Закинем его в папку префабов. Теперь дублируем объект на сцене, нажав сочетание клавиш CTRL+D. После, зажав CTRL перетащим объект в сторону. Этим действием мы перетащили новую копию объекта через привязку к сетке, которая позволяет перемещать объект на одинаковую длину шагов. Сейчас шаг сетки равен единице.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Вот кстати интересная особенность префабов. Если мы изменим, как сейчас, размер объекта, и нажмём кнопку «Apply» — «Применить», то новые параметры этого префаба распространятся на все его копии.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Теперь нужно заполнить копиями объекта всю плоскость. Ах да, забыл выставить позицию плоскости по нулям, как раз из-за этого всё отображается криво.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Камера по той же причине расположена неправильно. Создадим новый пустой объект «TowerPlaces» хранящий объекты мест для установки башен.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Теперь сформируем дорожку для движения ботов, простым удалением объектов «TowerPlace».

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Waypoints

Создаём пустой объект для вэйпоинта. Вэйпоинты — это точки маршрута, по которым перемещаются боты. Позицию ставим по нулям. Зададим иконку для невидимого объекта, что бы его было видно в окне редактора.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Приподнимем объект по оси Y что бы он не сливался с плоскостью. Неважно на сколько, главное не трогаем координаты X и Z, они должны быть по нулям.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Закинем его в папку префабов и переместим оригинал к началу пути с зажатой клавишей CTRL. Заметьте координаты объекта, сохраняют своё целочисленное значение по оси X и Z.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Дублируем вэйпоинты и размещаем на краях поворота, держа при этом зажатой клавишу CTRL. Делаем это всё до конца пути.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Поместим все вэйпоинты в пустой объект.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Spawner

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

В папке материалов создадим новый материал. Присвоим его спаунеру. Становится красиво.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

В папке скриптов создаём новый скрипт с именем «Spawner». Перейдём в редактор кода двойным щелчком по скрипту. Редактором кода может быть Visual Studio, MonoDevelop или вовсе обычный блокнот. На работу скрипта это никак не повлияет, если только на удобство. А на ошибки укажет редактор Unity.

Завершение первой части

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Для большей наглядности можно посмотреть видеоурок:

P. S.: Если у вас есть вопросы или пожелания, оставляйте свои комментарии на YouTube под видео.
На хабре я комментарии не читаю.

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

Источник

Как создать простую Tower Defense игру на Unity3D, часть первая

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

Всем заинтересовавшимся — добро пожаловать под кат!

Первые шаги

Базовая сцена
Добавляем пушку

Немного теории: Префаб (Prefab) — такой специальный вид объекта, который содержит в себе другой(ие) объект(-ы) со своими настройками, а также их можно будет быстро спаунить на сцене (и нам это пригодится в дальнейшем). Префабы в списке объектов сцены имеют синий цвет.

Нажмите на файл пушки (cannon2) — в инспекторе свойств загрузятся свойства плагина импорта пушки.
Установите значения следующим образом:
Scale Factor поставим равным 0.1
Отметим галочкой Generate Colliders
Остальное не трогаем, чуть ниже жмём кнопочку Apply.

Этим самым мы задали пушке адекватный размер (изначальный 0.01 слишком мал, а единица очень огромная), и сгенерировали коллайдеры, чтобы пушка не проваливалась под землю.

В окне Project перетащим нашу пушку (cannon2) на свежесозданный префаб (gun_prefab).

Теперь можно перетаскивать наш префаб прямо на сцену — пушка будет клонироваться, но при этом каждый новый экземпляр будет являться отдельным объектом. Попробуйте! А когда наиграетесь — удалите все пушки со сцены (выделите их и нажмите Delete).

Создаём мобов

Карты, деньги, два ствола

А теперь, собственно, сам код AI в комментариях:
PlasmaTurretAI.cs

Комментарии, думаю, довольно ясно описывают код. Единственным непонятным может показаться такой монстр, как кватернион. Не стесняйтесь, погуглите, почитайте, эта тема не всем легко даётся. А здесь можно почитать про кватернионы в Unity3D на их же сайте.

Сохраните изменения и переключитесь назад на Unity3D.

Чтобы «натянуть» наш свеженаписанный скрипт на пушку, нужно перетащить файл скрипта прямо на её префаб. После этого, если нажать на префаб пушки — в инспекторе свойств появится раздел с нашим скриптом, где можно настраивать все public поля в коде!
Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Далее, для теста нашего кода, нам нужно приделать тег Monster к нашему монстру. Нажмите на него в Project, затем посмотрите на Инспектор объекта: в верхней его части есть выпадающее поле Tag, сейчас там стоит значение Untagged. Нажимаем на этот список и в нижней его части жмём Add tag.
Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Разворачиваем список Tags, и в поле Element 0 пишем «Monster» (без кавычек, как на скрине).
Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Школа начинающего моба

До сих пор наши мобы были просто объектами, но теперь мы научим их ползти к пушке и наносить ей радость, счастье и, прежде всего, урон.
Уже известным способом создаём новые C# скрипты: MobAI, GlobalVars, MobHP, TurretHP, SpawnerAI. Начнём по порядку:

GlobalVars.cs — класс глобальных переменных

А следующий класс я не комментировал, он почти полная копия MobHP, за некоторыми различиями (например, ему не надо лерпить свой цвет).

А теперь необходимо поправить код AI пушки. Найдите там switch (FiringOrder) и замените весь блок полностью на такой:

Также необходимо заменить в самом конце этого же класса строчку

Это называется «тернарный оператор». Если условие до знака «?» верно — то оно вернёт null, иначе вернётся nearestmob. Смысл выражения в том, что пушка не схватит цель, до которой не может достать.

В целом, код готов. Теперь надо подготовить игровые объекты. Создайте объект MobSpawner, его местоположение не играет роли, лишь бы не мешался в дальнейшем. Повесьте на него скрипт SpawnerAI и выставьте желаемые значения переменных. На значение переменной Mob перетягиваем наш префаб моба.
Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense
Спаунер более не трогаем.

Создайте объект с именем GlobalVars и перетащите на него одноименный скрипт, укажите стартовое количество денег у игрока.
Далее, создайте нужное количество объектов (для удобства именуйте в духе «имя_порядковыйНомер») для точек спауна и разместите их в желаемых местах спауна мобов. Присвойте им тег Spawnpoint, а заодно создайте тег Turret и присвойте его префабу пушки.

Повесьте на мобов наши 2 скрипта MobAI и MobHP, а на пушку — TurretHP. Не забывайте побаловаться со значениями переменных.
На значение target в MobAI префаб пушки перетягивать не надо, AI сам ищет цели. Очень примитивно, медленно, но ищет.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

ПоторGUIем?

Для создания GUI нам понадобится новый C# скрипт с названием Graphic:

Ах да, теперь нам ещё нужно неплохо изменить скрипт GlobalVars:

Далее, нам надо создать призрак пушки, а делается это довольно легко: дублируем пушку, закидываем в неё какой-либо пустой ГО, удаляем его и пушка отвязывается от своего префаба, главное в него же не сохранить! Далее проходимся по всей иерархии объектов внутри пушки и меняем попавшиеся шейдеры на Transparent Diffuse. Кстати, чтобы увидеть абсолютно всю структуру пушки — её необходимо поместить на сцену и раскрывать иерархию уже там. Если возникнут проблемы с созданием призрака — выложу уже готовый. У некоторых всё же возникли — ссылка на скачку пакета здесь (3,7 мб).

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

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

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

Источник

Создание игры Tower Defense в Unity — Часть 1

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Игры жанра tower defense приобретают всё большую популярность, и это неудивительно — немногое может сравниться с удовольствием от наблюдения за собственными линиями защиты, уничтожающими злых врагов! В этом туториале из двух частей мы создадим игру tower defense на движке Unity!

Вы узнаете, как сделать следующее:

Примечание: вам необходимы начальные знания Unity (например, вы должны знать, как добавляются ассеты и компоненты, что такое префабы) и основы языка C#. Для изучения всего этого я рекомендую вам пройти туториалы по Unity Шона Даффи или серию Beginning C# with Unity Брайана Мокли.

Я буду работать в версии Unity для OS X, но этот туториал подойдёт и для Windows.

Сквозь окна башни из слоновой кости

В этом туториале мы создадим игру tower defense, в которой враги (маленькие жучки) ползут к печеньке, принадлежащей вам и вашим миньонам (разумеется, это монстры!). Игрок может размещать монстров в стратегических точках и улучшать их за золото.

Вот скриншот готовой игры:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Монстры, объединяйтесь! Защищайте печеньку!

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

Скачайте эту заготовку проекта, распакуйте её и откройте проект TowerDefense-Part1-Starter в Unity.

В заготовке проекта есть ассеты графики и звуков, готовые анимации и несколько полезных скриптов. Скрипты не связаны напрямую с играми жанра tower defense, поэтому я не буду здесь о них рассказывать. Однако если вы хотите больше узнать о создании 2D-анимаций в Unity, то изучите этот туториал по Unity 2D.

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

Откройте GameScene, находящуюся в папке Scenes и задайте для режима Game соотношение сторон 4:3, чтобы все метки правильно совпадали с фоном. В режиме Game вы увидите следующее:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Место помечено крестом: расположение монстров

Монстров можно ставить только на точки, помеченные знаком x.

Чтобы добавить их в сцену, перетащите Images\Objects\Openspot из Project Browser в окно Scene. Пока позиция для нас не важна.

Выбрав в иерархии Openspot, нажмите на Add Component в Inspector и выберите Box Collider 2D. В окне Scene Unity покажет прямоугольный коллайдер с зелёной линией. Мы будем использовать этот коллайдер для распознавания нажатий мыши на этом месте.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Аналогичным образом добавьте к Openspot компонент Audio\Audio Source. Выберите для параметра AudioClip компонента Audio Source файл tower_place, который находится в папке Audio, и отключите Play On Awake.

Нам нужно создать ещё 11 точек. Хотя существует искушение повторить все эти действия, в Unity есть решение получше: Prefab!

Перетащите Openspot из Hierarchy в папку Prefabs внутри Project Browser. Его название станет в Hierarchy синим, это означает, что он присоединён к префабу. Примерно так:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Теперь, когда у нас есть заготовка-префаб, мы можем создать сколько угодно копий. Просто перетащите Openspot из папки Prefabs внутри Project Browser в окно Scene. Повторите это 11 раз, и у нас появится в сцене 12 объектов Openspot.

Теперь воспользуемся Inspector, чтобы задать этим 12 объектам Openspot следующие координаты:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Размещаем монстров

Чтобы упростить размещение, в папке Prefab проекта есть префаб Monster.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Префаб Monster готов к использованию

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

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

Теперь мы создадим скрипт, который будет располагать Monster на Openspot.

В Project Browser выберите в папке Prefabs объект Openspot. В Inspector нажмите на Add Component, а затем выберите New Script и назовите скрипт PlaceMonster. Выберите в качестве языка C Sharp и нажмите на Create and Add. Так как мы добавили скрипт к префабу Openspot, то у всех объектов Openspot в сцене теперь будет этот скрипт. Отлично!

Дважды нажмите на скрипт, чтобы открыть его в IDE. Затем добавьте две переменные:

По одному монстру на точку

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

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

Этот код располагает монстра при нажатии мыши или касании экрана. Как он работает?

Использование подходящего префаба

Сохраните файл и вернитесь в Unity.

Чтобы задать переменную monsterPrefab, сначала выберите в браузере проекта объект Openspot из папки Prefabs.

В Inspector нажмите на кружок справа от поля Monster Prefab компонента PlaceMonster (Script) и выберите в появившемся диалоговом окне Monster.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Вот и всё. Запустите сцену и создавайте монстров на разных местах нажатием мыши или касанием экрана.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Повышаем уровень монстров

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Какой милаха! Но если вы попробуете украсть его печенье, этот монстр превратится в убийцу.

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

Добавим этот скрипт.

Задание уровней монстров

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Изобретать велосипед заново — обычно плохая идея.

В верхней части MonsterData.cs добавим следующую конструкцию using :

Примечание: обобщения — это мощная концепция C#. Они позволяют задавать типобезопасные структуры данных, не придерживаясь типа. Это удобно для таких классов-контейнеров, как списки и множества. Чтобы подробнее узнать про обобщённые структуры, прочитайте книгу Introduction to C# Generics.

Теперь добавим следующую переменную в MonsterData для хранения списка MonsterLevel :

Сохраните файл и переключитесь в Unity, чтобы настроить каждый уровень.

Выберите Prefabs/Monster в Project Browser. В Inspector теперь отображается поле Levels компонента MonsterData (Script). Задайте для параметра size значение 3.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Далее зададим стоимость для каждого уровня:

Развернём Prefabs/Monster в Project browser, чтобы видеть его дочерние элементы. Перетащите дочерний Monster0 в поле visualization Element 0.

Далее назначим Element 1 значение Monster1, а Element 2 значение Monster2. В GIF показан этот процесс:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Когда вы выбираете Prefabs/Monster, префаб должен выглядеть так:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Задание текущего уровня

Вернитесь к MonsterData.cs в IDE и добавьте к MonsterData ещё одну переменную.

В частной переменной currentLevel мы будем хранить текущий уровень монстра.

Теперь зададим currentLevel и сделаем его видимым для других скриптов. Добавьте следующие строки в MonsterData вместе с объявлением переменных экземпляра:

Довольно большой кусок кода на C#, правда? Давайте разберём его по порядку:

OnEnable будет вызван сразу же при создании префаба (если префаб был сохранён в состоянии enabled), но OnStart не вызывается, пока объект не начинает выполняться как часть сцены.

Сохраните файл и вернитесь в Unity. Запустите проект и расположите монстров; теперь у них отображаются правильные спрайты самого нижнего уровня.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Апгрейд монстров

Вернитесь в IDE и добавьте в MonsterData следующий метод:

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

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

Проверяем функционал апгрейдов

Сохраните файл и вернитесь к PlaceMonster.cs в IDE. Добавьте новый метод:

Реализуем улучшения за золото

Чтобы включить опцию апгрейда, добавим к OnMouseUp ветвь else if :

Сохраните файл и вернитесь в Unity. Запустите игру разместите и улучшите любое количество монстров (но это пока).

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Платим золотом — Game Manager

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

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

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

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Все выделенные игровые объекты должны знать, сколько золота есть у игрока.

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

Нажмите правой клавишей на Hierarchy и выберите Create Empty. Назовите новый объект GameManager.

Добавьте к GameManager новый скрипт C# с названием GameManagerBehavior, а затем откройте его в IDE. Мы будем отображать общее количество золота игрока в метке, поэтому в верхней части файла добавьте следующую строку:

Теперь, когда GameManager знает о метке, как нам синхронизировать количество хранящегося в переменной золота и отображаемой в метке величины? Мы создадим свойство.

Добавьте в GameManagerBehavior следующий код:

Насколько щедрыми мы будем? Добавьте в Start() следующую строку, чтобы дать игроку 1000 золота, или меньше, если вам жалко денег:

Назначение объекта метки скрипту

Сохраните файл и вернитесь в Unity. В Hierarchy выберите GameManager. В Inspector нажмите на круг справа от Gold Label. В диалоговом окне Select Text выберите вкладку Scene и выберите GoldLabel.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Запустите сцену и в метке отобразится Gold: 1000.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Проверяем «кошелёк» игрока

Откройте в IDE скрипт PlaceMonster.cs и добавьте следующую переменную экземпляра:

Мы воспользуемся gameManager для получения доступа к компоненту GameManagerBehavior объекта GameManager сцены. Чтобы задать её, добавьте в Start() следующее:

Возьми мои деньги!

Мы пока не вычитаем золото, поэтому дважды добавим внутрь OnMouseUp() эту строку, заменив каждый из комментариев // TODO: вычитать золото :

Сохраните файл и вернитесь в Unity, улучшите несколько монстров и посмотрите на обновление значения Gold. Теперь мы вычитаем золото, но игроки могут строить монстров, пока им хватает места; они просто берут деньги в долг.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Бесконечный кредит? Отлично! Но мы не можем этого позволить. Игрок должен иметь возможность ставить монстров, пока у него достаточно золота.

Проверка золота для монстров

Переключитесь в IDE на PlaceMonster.cs и замените содержимое CanPlaceMonster() следующим:

Задание для вас: самостоятельно добавьте в CanUpgradeMonster() проверку, достаточно ли у игрока золота.

Она будет проверять, больше ли у игрока Gold, чем цена апгрейда.

Сохраните и запустите сцену в Unity. Теперь попробуйте-те как неограниченно добавлять монстров!

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Теперь мы можем строить только ограниченное количество монстров.

Башенная политика: враги, волны и точки маршрута

Настало время «проложить дорогу» нашим врагам. Враги появляются на первой точке маршрута, движутся к следующей и повторяют процесс, пока не дойдут до печенья.

Заставить врагов двигаться можно так:

Создание дороги из точек маршрута

Нажмите правой клавишей на Hierarchy и выберите Create Empty, чтобы создать новый пустой игровой объект. Назовите его Road и расположите в точке (0, 0, 0).

Теперь нажмите правой клавишей на Road в Hierarchy и создайте ещё один пустой игровой объект как дочерний элемент Road. Назовите его Waypoint0 и разместите в точке (-12, 2, 0) — отсюда враги будут начинать своё движение.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Аналогичным образом создайте ещё пять точек маршрута со следующими названиями и позициями:

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Теперь создадим несколько врагов, чтобы они могли двигаться по дороге. В папке Prefabs есть префаб Enemy. Его позиция равна (-20, 0, 0), поэтому новые экземпляры будут создаваться за пределами экрана.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

Двигаем врагов по дороге

Добавьте новый скрипт C# с названием MoveEnemy к префабу Prefabs\Enemy. Откройте скрипт в IDE и добавьте следующие переменные:

В waypoints в массиве хранится копия точек маршрута, а строка [HideIninspector] над waypoints гарантирует, что мы не сможем случайно изменить это поле в Inspector, но по-прежнему будем иметь доступ к нему из других скриптов.

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

Добавим эту строку в Start() :

Так мы инициализируем lastWaypointSwitchTime со значением текущего времени.

Чтобы враг двигался вдоль маршрута, добавим в Update() следующий код:

Разберём код пошагово:

Сообщаем врагам направление движения

В своём текущем состоянии враги не знают порядка точек маршрута.

Выберите Road в Hierarchy и добавьте новый скрипт C# под названием SpawnEnemy. Откройте его в IDE и добавьте следующую переменную:

Мы будем использовать waypoints для хранения ссылок на точку маршрута в сцене в нужном порядке.

Сохраните файл и вернитесь в Unity. Выберите Road в Hierarchy и задайте Size массива Waypoints равным 6.

Перетащите каждый из дочерних элементов Road в поля, вставив Waypoint0 в Element 0, Waypoint1 в Element 1 и так далее.

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Проверяем, как всё это работает

Откройте в IDE SpawnEnemy и добавьте следующую переменную:

Чтобы создать врага при запуске скрипта, добавим в Start() следующий код:

Сохраните файл и вернитесь в Unity. Выберите в Hierarchy объект Road и выберите для параметра Test Enemy префаб Enemy.

Запустите проект и посмотрите, как враг движется по дороге (в GIF для большей наглядности скорость увеличена в 20 раз).

Как сделать свой tower defense. Смотреть фото Как сделать свой tower defense. Смотреть картинку Как сделать свой tower defense. Картинка про Как сделать свой tower defense. Фото Как сделать свой tower defense

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

Куда двигаться дальше?

Мы уже сделали многое и быстро движемся к созданию собственной игры в жанре tower defense.

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

Скачайте готовый результат отсюда.

Во второй части мы рассмотрим создание огромных волн врагов и их уничтожение. До встречи!

Источник

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *