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

Основы создания 2D персонажа в Godot. Часть 1: компилирование игрового движка, создание проекта и анимация покоя героя

Время на прочтение6 мин
Количество просмотров52K
Пару дней назад увидел статью о публикации исходного кода под свободной лицензией MIT игрового движка Godot и сразу решил поковыряться в нём.
Оказалось не всё так сложно, скорее забавно. В своей первой публикации хотелось бы рассказать о первых шагах на пути к созданию игрового платформера, и всех подводных камнях, о которые я чуть было не переломал пальцы за эти дни.



Если это кому-то интересно, добро пожаловать под Хабракат!

Встречаем: компилирование и установка godot на GNU/Linux x86, создание простейшей сцены и анимированного персонажа


Сразу определимся, чтобы не было недопонимания:
1) На написание статьи меня сподвиг image Charoplet со своим циклом статей «2D персонаж в Unity 3D». Спасибо ему за это, творческих успехов и новых публикаций.
2) Опять же, для наглядности взял (без спроса) текстуры (персонажа) из его уроков. Надеюсь, меня за это простят.
3) На борту имею только GNU/Linux, x86 и amd64 соответственно. Под другие ОС достаточно скачать бинарные файлы с сайта создателей. Так как под amd64 всё уже есть, а под x86 предвидится в ближайшем будущем (автор обещал скомпилировать бинарные файлы как только сможет), я и решил что для 32-битных систем статья будет более актуальна и интересна.

Компиляция

Устанавливаем зависимости, если ещё нет в системе (Если что-то не получается, информация устарела, посмотрите на сайте разработчиков):

GCC or LLVM
Python 2.7+ (3.0 ещё не тестировался).
SCons build system.
X11 and MESA development Libraries
ALSA development libraries
Freetype
pkg-config
Пользователям Ubuntu:
apt-get install git scons pkg-config libx11-dev libxcursor-dev build-essential libasound2-dev libfreetype6-dev libglu-dev


Клонирование исходных кодов:
git clone https://github.com/okamstudio/godot.git


Само компилирование:
cd ./godot
scons bin/godot


scons поддерживает параллельную компиляцию. Достаточно добавить опцию -j с аргументом, указывающим на количество потоков, например
scons -j 4  bin/godot
У меня быстрее всего получалось когда число потоков == числу ядер.

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

Чай приготовили, компиляция ещё идёт? Тогда можно сходить на сайт издателя и почитать документацию, скачать Демо и примеры, а так-же Шаблоны экспорта проектов под нужные операционные системы.

Первый запуск, создание проекта

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

Давайте создадим свой первый проект.

New Project -> Project Path — соответственно директория, в которой он и будет находиться; Project Name — его название.
Не долго думая выбираем место назначения, называем test, клацаем кнопочку Edit, и созданный проект вылетает с segmentation fault.

Сначала я думал что у меня руки кривые. Пересобрал из git, запускаю — опять двадцать пять. Собрал на другой машине — всё заработало! На своей — нет. И тут до меня допёрло! Товарищи! Программа не понимает кириллицу! В общем переместил я всё в другой каталог, и всё заработало и на моей машине. Что ж, впредь будем осторожнее.

Ну вот и главное окно программы.



Для начала давайте создадим новую сцену. Сцена — это эпизод игры. Это может быть целый уровень. Заставка. Анимация персонажа. Задний план. Godot — программа редактирования сцен. Мы сегодня не будем углубляться в создание полнофункциональной игровой сцены, а просто создадим персонажа.

Создание игрового персонажа

Первое что надо сделать — это добыть спрайты. Нарисовать/скачать/украсть. Я пожалуй возьму из урока про Unity3D. Спрайты от image Charoplet.

Качаем Idle.png.
Импортируем в Godot:

image

Указать какое изображение(я) куда импортируем



Указать степень сжатия

image

И нажать «Import». В Wiki есть более подробная информация об импорте текстур на английском. Рекомендую к прочтению.

Ну а мы довольные результатом пробуем создать персонажа.

Сцена персонажа

В верхнем правом углу в окошке Scene нажимаем на единственную активную кнопку «Add/Create a new Node», или сочетанием клавиш Ctrl+A создаём «Ноду». Я думаю самый близкий перевод — шестерня, но звучит не красиво. Пусть будет материал? Документ? Или так и оставить, — «Нода»? Буду рад комментариям.

В поиске «Search» вводим «Rigid», и «Node» отсортируются по названиям. Выбираем RigidBody2D.
Настраиваем параметры в меню Inspector ниже:
Mode: Character
Mass: 3
Friction: 0
Custom Integrato:


Так. Хорошо идём! Теперь натягиваем спрайт:
Опять Ctrl+A, Sprite -> Выбираем Sprite. Не AnimatedSprite, а просто Sprite.
Идём в «Настройки» (Inspector — Контроль?), нажимаем на Texture в самом верху, -> Load. Выбираем уже импортированную текстуру Idle.tex.



Да, она появилась! Теперь нам надо указать, что у нас тут аж целых 8 фреймов (Правда сами фреймы считаются с нуля, их количество считаем с единицы, привыкайте). Параметр Hframes, — Горизонтальные фреймы, ставим равным 8. И что мы видим?



На первом же (который нулевой) фрейме виден хвост капитана из следующего! Это возмутительно! Да что эти OKAM Studio о себе возомнили?! Даже количество кадров в раскадровке нормально посчитать не могут! Как они могут такие программы писать?!

Да? Промелькнула мысль? Нет, разработчики не виноваты. Виноваты мы. Поленились нарисовать свои спрайты. Взяли чужие — вот и расплата.
Персонаж на спрайте расположен криво. Будем править.

… Спустя 10 минут…

В GIMP'е оказывается делать/изменять/править спрайты не так уж и трудно. Выставляем сетку нужного размера (120 на 120 пикселей). И распихиваем кадры по местам. Готово. Скачать исходные файлы можно тут. Готовая текстура выглядит так:



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

Ок, перезаливаем. Указываем Vframes = 4; Hframes = 8

Наводим на RigidBody2D и переименовываем его в player. Так будет понятнее, не правда ли?

Ctrl+A — создаем «Node» «AnimationPlayer» и сразу же «Camera2D» чтобы не возвращаться. Переименовываем AnimationPlayer в anim, а Camera2D просто в camera. Так дальше будет проще. С камерой я думаю сразу догадались что делать. Больше пока её трогать не будем.

Самое время создавать анимацию! Делать это проще некуда! Выбираем anim, внизу слева появляется меню анимации.
Создадим анимацию. Слева внизу есть кнопка «Create new animation in player». Жмякаем. Называем idle.
Нажимаем на карандаш правее, и вот оно, меню редактора анимации.

Ставим Len(s) — длину анимации 1,1 (секунды), а Step(s) — шаг анимации, 0,15.
Выбираем опять на Sprite в окне Scene вверху справа.

Смотрим на Inspector — ищем переменную Frame. Она должна равняться нулю. Справа нарисован ключик. Нажимаем на него. Нам предлагают создать новую линию анимации «frame» для данного спрайта. Соглашаемся (Create).
Теперь всё просто. Нажимаем Ctrl + Right, выбираем следующую анимацию — нажимаем на ключик. И так далее. Всего должно получиться 8 синих точек, 8 кадров анимации. После этого можно нажать на плеере на play, и посмотреть что у нас получилось. Да, не забудьте зациклить анимацию. (Кнопка Enable/Disable looping in animation).



Сохраняем сцену (Scene -> Save, назвав player.xml).

Так, 30% сделали. Теперь самое интересное.

Будем варить! кодить!

Scene -> player -> Inspector -> Script. Успеваете за мной? На скриншоте выше нарисовано куда идти. Выбираем там New GDScript.

Переключаемся на вкладку скрипты.



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

extends RigidBody2D #объявляем класс

var anim=""  #Объявляем переменную анимации

func _integrate_forces(s):   #Начинаем функцию

	var new_anim=anim #Объявляем переменную смены анимации (понадобится в будущем, когда будем использовать разные анимации)
	new_anim="idle" #присваиваем анимацию покоя

	if (new_anim!=anim): ##Сама смена анимации
		anim=new_anim
		get_node("anim").play(anim)

Ну вот, а вы боялись.
Как и обещал:
extends RigidBody2D

var anim=""

func _integrate_forces(s):

var new_anim=anim
new_anim=«idle»

if (new_anim!=anim):
anim=new_anim
get_node(«anim»).play(anim)

Не забываем сохранить как player.gd.

Так. В принципе почти всё готово. Осталось самое главное:

Создание сцены

Не забываем сохранить сцену с персонажем. И создаём новую. Благо уже умеем.

Для начала создаём пустую «Node» — назовём её Scene.
Теперь к ней привяжем нашего игрока. Нажимаем на «плюс» и выбираем нашего только что созданного player.xml.

Так. Ну и запуск.

image

Упс!

image

Сохраняем нашу сцену как scene.xml. И запускаем ещё раз. Если всё сделали правильно, то увидите потрясающую анимацию нашего Капитана!

Небольшое видео результата с бонусными задниками и землей под ногами:



Ну и в заключение. Как я писал выше, в ОС GNU/linux x86 на данный момент проект экспортировать нельзя. Авторы программы уведомлены. В скором будущем обещали решить эту проблему и скомпилировать не только бинарники для x86, но и Шаблоны экспорта. Также можете протестировать экспорт на другие ОС.

Ну а я, если получится, надеюсь продолжить цикл статей о создании 2D, а в будущем возможно и 3D игр на этом замечательном движке. Приятной пятницы, с Днём Компьютерщика, до скорых встреч!
Теги:
Хабы:
+28
Комментарии23

Публикации

Изменить настройки темы

Истории

Работа

Python разработчик
135 вакансий
Data Scientist
62 вакансии

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

Weekend Offer в AliExpress
Дата20 – 21 апреля
Время10:00 – 20:00
Место
Онлайн
Конференция «Я.Железо»
Дата18 мая
Время14:00 – 23:59
Место
МоскваОнлайн