Настройка игровой зоны

Для начала мы настроим игровую область. Давайте начнем с импорта стартовых ресурсов и настройки игровой сцены.

Мы подготовили проект Godot с 3D-моделями и звуками, которые мы будем использовать в этом уроке. Ссылка на него находится на главной странице. Если вы ещё этого не сделали, вы можете скачать архив здесь: Squash the Creeps assets.

После загрузки распакуйте .zip архив на своем компьютере. Откройте менеджер проектов Godot и нажмите кнопку Импорт.

../../_images/01.import_button.webp

Во всплывающем окне импорта введите полный путь к только что созданному каталогу 3d_squash_the_creeps_starter/. Нажмите кнопку Browse справа, чтобы открыть браузер файлов и перейти к файлу project.godot, содержащемуся в папке.

../../_images/02.browse_to_project_folder.webp

Нажмите Import, чтобы открыть проект в редакторе.

../../_images/03.import_and_edit.webp

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

../../_images/import_project_to_4.x_prompt.webp

Если он не открылся сразу, откройте проект из вашего списка проектов.

Начальный проект содержит иконку и две папки: art/ и fonts/. В них вы найдёте ресурсы, которые мы будем использовать в игре.

../../_images/04.start_assets.webp

Здесь имеются две 3D-модели player.glb и mob.glb, материалы для этих моделей и музыкальный трек.

Настройка игровой зоны

Мы собираемся создать нашу основную сцену с простым Node в качестве ее корня. В доке Scene нажмите кнопку Add Child Node, представленную значком «+» в левом верхнем углу, и дважды щелкните Node. Назовите узел Main. Альтернативный метод переименования узла — щелкнуть правой кнопкой мыши по Node и выбрать Rename (или F2). Альтернативно, чтобы добавить узел в сцену, вы можете нажать Ctrl + A (Cmd + A на macOS).

../../_images/05.main_node.webp

Сохраните сцену как main.tscn, нажав Ctrl + S (Cmd + S на macOS).

Мы начнём с добавления пола, который предотвратит игроков от падения. Чтобы создать такие статические коллайдеры такие, как пол, стены или потолок, вы можете использовать узлы StaticBody3D. Им необходимы дочерние узлы CollisionShape3D, чтобы определить область столкновения. Выбрав узел Main, добавьте узел StaticBody3D, затем CollisionShape3D. Переименуйте StaticBody3D в Ground.

../../_images/adding_static_body3D.webp

Ваше дерево сцены должно выглядеть так

../../_images/06.staticbody_node.webp

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

../../_images/07.collision_shape_warning.webp

Чтобы создать форму, выберите узел CollisionShape3D, перейдите в Инспектор и щелкните по полю <пусто> рядом со свойством Shape. Создайте новый BoxShape3D.

../../_images/08.create_box_shape3D.webp

Форма параллелепипеда идеальна для плоской поверхности и стен. Её толщина делает её надёжной в качестве преграды для быстро двигающихся объектов.

В окне просмотра появится каркас параллелепипеда с тремя оранжевыми точками. Вы можете нажать на них и перетащить для того, чтобы отредактировать размеры фигуры в интерактивном режиме. Мы также можем с точностью настроить размер в инспекторе. Нажмите на BoxShape3D, чтобы расширить источник. Установите его размер равным 60 по оси X, 2 по оси Y и 60 по оси Z.

../../_images/09.box_size.webp

Collision shapes(то есть формы столкновения, или коллизии) являются невидимыми. Нам необходимо добавить видимый пол. Выберите узел Ground и добавьте к нему дочерний узел MeshInstance3D.

../../_images/10.mesh_instance3d.webp

В инспекторе, щелкните на поле рядом с Mesh и создайте BoxMesh, чтобы создать видимый параллелепипед.

../../_images/11.box_mesh.webp

Опять же, по умолчанию он слишком мал. Нажмите на иконку куба, чтобы открыть его свойства и установите его Размер на 60, 2, и 60.

../../_images/12.cube_resized.webp

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

We're going to move the ground down so we can see the floor grid. To do this, the grid snapping feature can be used. Grid snapping can be activated 2 ways in the 3D editor. The first is by pressing the Use Snap button (or pressing the Y key). The second is by selecting a node, dragging a handle on the gizmo then holding Ctrl (Cmd on macOS) while holding the selected node.

../../_images/use_snap.webp

Включите привязку. Переместите узел Ground, используя ось Y (зеленая стрелочка) и привязку к сетке.

../../_images/move_gizmo_y_axis.webp

Примечание

If you can't see the 3D object manipulator like on the image above, ensure the Transform Mode is active in the toolbar above the view.

../../_images/14.select_mode_icon.webp

Переместите поверхность вниз на 1 метр. Ярлык в нижнем левом углу окна просмотра показывает, насколько вы перетащили узел.

../../_images/15.translation_amount.png

Примечание

При перемещении узла Ground вниз, оба дочерних узла перемещаются вместе с ним. Убедитесь, что вы перемещаете узел Ground, а не MeshInstance3D или CollisionShape3D.

В конечном итоге, transform.position.y у Ground должен быть -1

../../_images/ground_down1meter.webp

Давайте добавим направленный свет, чтобы наша сцена не была серой. Выберите узел Main и добавьте дочерний узел DirectionalLight3D.

../../_images/create_directional_light3d.webp

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

В Inspector включите Shadow, установив флажок.

../../_images/16.turn_on_shadows.webp

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

../../_images/17.project_with_light.webp

Это наш отправной пункт. В следующей части мы будем работать со сценой игрока и передвижением.