Unity webgl как запустить файл

Обновлено: 08.07.2024

Опция проекта WebGL позволяет Unity публиковать содержимое Unity, работающее в веб-браузере, с использованием технологии HTMl5 и API рендеринга WebGL в форме программы JavaScript. Для создания и тестирования содержимого WebGL выберите цель сборки WebGL в окне «Build Player» и нажмите «Build & Run»

Поддержка платформы:

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

Многопоточность не поддерживается, поскольку в JavaScript нет технологии поддержки потоковой передачи. Это влияет на использование Unity многопоточности для повышения скорости выполнения, а также на коды сценариев и управляющие dll. Фактически, все те, что находятся в пространстве имен System.Threading, не поддерживаются.
Проекты WebGL нельзя отлаживать в MonoDevelop или Visal Studio. Подробности см. В разделе «Отладка и устранение неполадок в сборках WebGL».
Браузеры не разрешают прямой доступ к IP-сокетам в Интернете по соображениям безопасности. См. "Сеть WebGL" для подробностей.
Графический API WebGl эквивалентен OpenGL ES 2.0, с некоторыми ограничениями, подробности см. В разделе «Графика WebGL».
В проекте WebGL для звуковых эффектов используется настраиваемая серверная часть на основе API веб-аудио. Это поддерживает только основные аудиофункции. Подробности см. В разделе «Использование звука в WebGL».
WebGL - это предварительно скомпилированная платформа, поэтому она не позволяет генерировать динамический код с использованием System.Reflection.Emit. То же самое на всех других платформах IL2CPP, iOS и большинстве консолей.

Экспорт:

Прежде всего, позвольте мне рассказать о большой дыре - в директории расположения проекта, китайца быть не должно!
После того, как мы загрузим соответствующую экспортную конфигурацию WebGL, вы увидите такие параметры.Когда вы установите флажок Development Build, Unity сгенерирует проект разработки, и есть профилировщик событий, который поддерживает консоль разработки для просмотра ошибок. Кроме того, проект разработки не сжимает содержимое (то есть содержимое не минимизируется); оно поддерживается в удобочитаемой форме JavaScript, а имя функции зарезервировано, чтобы пользователи могли получить полезный стек отслеживания ошибок. Обратите внимание: это означает, что проект разработки будет очень большим, слишком большим для выпуска, поэтому обычно не выбирайте Development Build.

Старайтесь не проверять Strip Engine Code при публикации (этот параметр выбран по умолчанию, чтобы разрешить оптимизацию кода с помощью WebGL. При выборе этого параметра Unity не включает код для классов, которые вы не используете. Оптимизация кода может вызвать некоторые проблемы , Так что постарайтесь это не проверять)

Больше ям для справкиЭтот документс участиемЭтот документБар

В любом случае есть так много ям

После экспорта создаются две папки и файл html. Этот файл html является файлом входа, который, как видно, отлично работает в браузере IE (но не в Google. После проверки выясняется, что это так из соображений безопасности Google. Не поддерживает открытие локального WebGL), вот эффект, который я открыл с IE

Чтобы облегчить просмотр в Google и сделать общедоступную сеть доступной для просмотра в будущем, давайте использовать nodejs в качестве бэкэнда и создадим серверную программу:

Нужен файл mime.json для хранения необходимых типов

Также существует файл 404 для решения ситуации, когда путь доступа неверен.

Затем мы помещаем все файлы, упакованные Unity, в статическую папку,

Наконец, на сервере терминального узла, а затем посетите: 127.0.0.1:3001 в браузере.

Полноэкранная адаптация:

Прежде чем говорить о взаимодействии с кодом, давайте поговорим о способе сделать сцену WebGL полноэкранной адаптивной в браузере. Просто проделайте несколько трюков в файле webGL, экспортированном Unity.

Исходный файл HTML

Взаимодействие:

js передается в WebGL:

Добавьте это предложение в html, экспортированный WebGL:

gameInstance - это переменная, которая получает возвращаемое значение UnityLoader.instantiate выше

ObjectName Это имя модели в сцене Unity, которая является объектом верхнего уровня.
LoadAssetBundlesh Имя метода в Unity
value Параметр этого метода (если параметра нет, этот параметр не требуется)
Если есть несколько параметров, используйте запятые для разделения значения нагрузки.

WebGL переходит к js:

Show - это метод, определенный в js
input.text также является параметром, передаваемым в js

В js должна быть такая функция:

Обновить, Application.ExternalCall Метод устарел, можете сослаться на негоОфициальный документ

Во-первых, вам нужно написать JS-скрипт, в основном для вызова метода mergeInto () ;. Первый параметр изменять не нужно, а второй параметр - это набор JS-методов. После записи измените суффикс этого файла на .jslib и поместите его в папку Plugins.

Экспортный путь для устранения китайцев
Шрифт по умолчанию не отображается, рекомендуется запустить Win + R и ввести шрифты, чтобы напрямую открыть системную библиотеку шрифтов.
Найдите нужный шрифт, суффикс должен быть ttf, залейте его

Коммерческая перепечатка Пожалуйста, свяжитесь с автором для авторизации, некоммерческая перепечатка укажите источник, спасибо

Unity – это кроссплатформенный игровой движок, позволяющий создавать игры для ПК, консолей, мобильный устройств и веб-сайтов. Последняя версия движка (Unity 5) имеет возможность экспорта в WebGL, благодаря чему разработчики могут без труда публиковать свои игры в вебе. Как следует из названия, данный экспортер использует WebGL – JavaScript API для рендеринга интерактивной компьютерной 3D графики, а также asm.js – подмножество JavaScript, которое было разработано компанией Mozilla и преподносилось как «язык ассемблера для веба». Больше информации о Asm.js и WebGL для Unity и Unreal Engine доступно здесь.

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

По окончании урока у вас получится вот такая игра (для просмотра потребуется браузер с поддержкой WebGL). Проект также доступен для скачивания из репозитория на GitHub.

Несколько слов о JavaScript в Unity

Говоря о JavaScript в Unity, мы подразумеваем нечто вроде диалекта JS под названием UnityScript. И хотя сами специалисты из Unity называют этот язык JavaScript, более скептично настроенные пользователи интернета полагают, что поддержка JavaScript в Unity – это маркетинговая уловка. Так или иначе, нужно сразу сделать оговорку, что UnityScript не соответствует спецификации ECMAScript, и никто даже не делает попытки устранить эти несоответствия.

Устанавливаем Unity

Для начала нам нужна рабочая версия Unity, скачать ее можно здесь. Файлы установки доступны для Windows и для Mac OS X. Пользователи Linux могут запустить Unity с помощью Wine или использовать другой удобный способ.

После установки можем приступать. Откроем Unity и создадим новый 3D проект.

Настраиваем проект

Теперь, когда программа открылась, давайте кратко пройдемся по основному интерфейсу:

Слева находится панель Hierarchy. Она показывает все элементы текущей сцены. Сцена – это визуальное отображение игры (уровня или меню). На данный момент в панели находятся два элемента: Main Camera и Directional Light.
Панель Scene посредине отображает камеру и свет в 3D пространстве.
Рядом с Scene есть вкладка Game. Там показано, как будет видеть игру игрок. Это необходимо для тестирования игры в редакторе.
Справа находится панель Inspector, где можно менять настройки элементов. Давайте посмотрим, как она работает. Сначала выберем Directional Light в панели Hierarchy. Мы увидим много информации об этом типе света и сможем отключить в нем тени, выбрав Shadow Type: No Shadows.
Внизу экрана находится окно Project, показывающее файлы, которые мы должны создать для игры.

Создаем героя

Герой в нашей игре будет прыгать вверх с одной платформы на другую. Если ему не удастся вовремя заскочить на одну из них, он упадет в пропасть и проиграет. Мы начнем с создания героя. Поскольку игра будет от первого лица, внешность героя не имеет никакого значения, и мы можем использовать вместо него стандартную сферу. Плюс в том, что сфера быстро создается, и ее физические характеристики отлично подходят для прыжков по платформам. Добавим ее, выбрав Create в панели Hierarchy и отредактировав следующие параметры во вкладке Inspector:

Нажмем кнопку Play, чтобы проверить результат. На экране должно появиться 3D пространство со сферой на фоне горизонта.

Чтобы сфера падала, у нее должен быть вес. Выходит, нам нужно добавить к ней новый компонент, нажав в панели Inspector кнопку Add Component и выбрав Rigidbody. Так как мы не хотим, чтобы сфера вращалась, нужно зафиксировать ее положение с помощью компонента Rigidbody. Для этого откройте Constraints и выберите все оси в строке Rotation. Проиграйте сцену еще раз и вы увидите, что теперь сфера падает.

Чтобы предотвратить бесконечное падение сферы, создадим нечто вроде платформы. Для этого добавим плоский куб со значением Scale.Y, равным 0.1. Проиграйте сцену еще раз и убедитесь, что сфера успешно приземляется на платформу. Но, стоит отметить, всё это выглядит не очень естественно. Как же заставить сферу подпрыгивать? Для этого нам пригодятся физические материалы.

Наделяем сферу физическими свойствами

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

Dynamic Friction: 10
Static Friction: 10
Bounciness: 1
Friction Combine: Maximum
Bounce Combine: Maximum

Если мы добавим этот материал в Sphere Collider, сфера будет подпрыгивать, но всегда на одинаковую высоту. Чтобы она подпрыгивала с каждым разом выше, нужно добавить физический материал и для платформы. Создадим еще один материал под названием Bouncy_Platform и применим к нему следующие значения:

Dynamic Friction: 0.9
Static Friction: 0.9
Bounciness: 1
Friction Combine: Average
Bounce Combine: Multiply

Чтобы не запутаться, переименуем наш плоский куб-платформу на Platform, кликнув по нему дважды в панели Hierarchy. Теперь, начав игру, вы увидите, что сфера с каждым разом подпрыгивает выше.

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

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

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

Настраиваем управление в игре

Наша цель – использовать мышь или трекпад, чтобы позволить игроку двигать сферу в определенном направлении. С этой целью мы напишем первый скрипт. Как и в случае с Rigidbody, скрипт добавляется к элементу игры в качестве компонента. В нашем примере мы добавим JS-скрипт под названием InputController к камере. Так же, как мы это делали со сценой и материалами, создадим в панели Project новую папку под названием Scripts, в которой и будет находиться наш скрипт. Двойной клик по новому скрипту откроет стандартный для Unity редактор MonoDevelop. Его можно заменить на любой другой редактор (Unity > Preferences > External Tools), но сейчас это не имеет никакого значения.

Первой идет общедоступная переменная, принадлежащая к типу GameObject. Она обозначает сферу. Вернемся к Unity, по прежнему оставив камеру выбранной. Мы увидим, что эта общедоступная переменная находится рядом с пустым полем для ввода. Перетащим сферу на данный участок, таким образом присвоив значение этой переменной.

Две остальные переменные – закрытые, им будут присвоены значения в функции Start. Эта функция вызывается всего один раз, после запуска сцены. Обоим закрытым переменным будет присвоена половина ширины и высоты экрана соответственно. Для этого мы используем встроенный класс Screen:

Единственное, что осталось реализовать в скрипте InputController – получение данных о положении и передвижении мышки. Для этого мы воспользуемся функцией Update, которая вызывается для каждого кадра:

Каждая из двух новых переменных x и z обозначает соответствующую ось. Когда мы смотрим вдоль оси y, мы видим горизонтальную ось x и вертикальную ось z. Мы будем менять положение сферы на этих осях в зависимости от данных, полученных с мышки. Нам понадобится статическая переменная Input.mousePosition, возвращающая двухмерный вектор. Вектор, нулевое значение которого приходится на нижний левый угол, должен переместиться в нашей системе координат на середину экрана. Следующий фрагмент кода демонстрирует такую трансформацию координат. Наконец, вызовем функцию setHeroPosition с обоими рассчитанными значениями в качестве аргументов. Мы запишем эту функцию в новый скрипт HeroController, привязанный к сфере:

Проверим, как работает наш код: подвигаем мышку или трекпад, чтобы сфера упала с платформы.

Реализуем процедурное создание платформ

Для автоматического создания платформ нам нужно нечто вроде шаблона платформы. В Unity такие шаблоны называются префабами. Чтобы создать префаб, необходимо перетащить платформу из панели Hierarchy в новую подпапку Prefabs папки assets. Префабы легко распознать в панели Hierarchy по голубому цвету. Все платформы, за исключением первой, будут создаваться с помощью нового скрипта GameManager, привязанного к камере. Сначала в скрипте обратимся к необходимым переменным:

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

Переменная boundary определяет границу оси y. Каждый раз, когда герой прыгает выше этой отметки, должна создаваться новая панель.
Вторая переменная отвечает за поворот, необходимый для создания нового экземпляра префаба. Значение Quaternion.identity отменяет поворот, как нам и нужно.
Переменная lastPlatformPosition сохраняет положение последней платформы как трехмерный вектор.

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

Чтобы избежать дублирования значений координат x и z в новой панели по отношению к предыдущей, воспользуемся циклом do while. Функция Unity Random.Range поможет нам получить произвольные значения осей x и z. В любом случае, нам нужно, чтобы их диапазон был между -1 и 2. Наконец, сохраняем новое положение панели в качестве последнего и возвращаем его.

Добавляем меню игры

Прежде всего нужно проверить, упала ли сфера ниже определенной отметки. Для этого отредактируем оператор if функции update в скрипте GameManager. Оператор else if будет проверять, является ли положение сферы ниже -2.0 единиц. Если да, он вызовет закрытую функцию gameOver:

Для отслеживания состояния игры мы воспользуемся новой функцией:

В данном случае мы используем класс Application, позволяющий с помощью метода LoadLevel загрузить новую сцену Menu. Для этого сначала создадим сцену, выбрав File > New Scene, и сохраним ее под названием Menu. Затем нам нужно добавить обе сцены в процесс сборки. Настройки сборки доступны во вкладке File > Build Settings. Не закрывая сцену с меню, нажмите кнопку Add Current и добавьте сцену в настройки сборки. Повторите то же действие с открытой сценой уровня. Теперь по завершении игры у вас на экране будет появляться только что созданная сцена с меню игры.

Добавляем кнопку для начала игры

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

Чтобы добавить кнопку, мы воспользуемся элементами пользовательского интерфейса Unity, которые могут быть добавлены как 3D элементы через панель Hierarchy. После добавления кнопки интерфейса в Hierarchy должны появиться следующие элементы: EventSystem и Canvas вместе с дочерним элементом Button и его дочерним элементом Text.

Canvas – это контейнер для всех элементов интерфейса, его можно сделать в некотором смысле адаптивным. Для этого нужно в панели Inspector переключить настройку Canvas Scaler: UI Scale Mode с Constant Pixel Size на Scale With Screen Size. Теперь можно менять положение кнопки:

Эту функцию можно применить в опциях кнопки в панели Inspector. В настройках компонента Button (Script) можно сделать так, чтобы функция выполнялась, когда пользователь кликает данный компонент. С этой целью мы добавим новую функцию к событию On Click (), нажав иконку +. Теперь можно перетащить саму кнопку на поле ввода. Затем выберем только что написанную функцию из скрипта UIController (UIController.StartGame).

Публикуем проект как браузерную игру для WebGL

С Unity вы можете экспортировать ваш проект как приложение для WebGL. Откройте настройки сборки и выберите WebGL в качестве платформы. Затем подтвердите выбор, нажав кнопку Switch Platform. После этого остается только нажать кнопку Build и выбрать название для игры. По завершении сборки откройте html-файл с помощью любого браузера, поддерживающего WebGL.

Дальнейшие шаги

Конечно же, нашу небольшую игру можно улучшить. К примеру, добавить подсчет очков, разные типы платформ, дополнительные методы ввода, звуки и так далее. Главное, что мы увидели в данном уроке, это то, что кроссплатформенный игровой движок Unity предоставляет хорошее сочетание WYSIWYG-редактора и возможностей скриптов, создаваемых на похожем на JavaScript языке. В зависимости от конкретных требований проекта, Unity может стать достойной альтернативой WebGL-фреймворкам.

Megan Thee Stallion - Girls in the Hood [Lyric Video]

Несколько браузеров (Chrome, Firefox, Internet Explorer) выдают следующую ошибку при попытке открыть локальную сборку Unity WebGL:

Microsoft Edge может запускать его, но я хотел бы знать, есть ли какие-либо настройки, которые можно изменить, чтобы запустить его в Chrome / Firefox / других браузерах.

В верный способ запустить приложение Unity-WebGL локально - использовать простой сервер.

Даже сама Unity работает как небольшой веб-сервер, при котором вы запускаете сборку WebGL из редактора.

Вот один, вот другой, вот целый список других

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

Эти инструкции были найдены в курсе разработки игр доктора Тима Чамилларда:

Fire Fox (рекомендуемый браузер для работы с WebGL)

Введите about: config на панели навигации
Найдите параметр security.fileuri.strict_origin_policy.
Щелкните этот параметр, чтобы изменить его на false

Хром

Добавьте ярлык для Chrome на рабочий стол, если у вас его нет
Щелкните ярлык правой кнопкой мыши и выберите Свойства.
Выберите текстовое поле Target, перейдите в конец, добавьте пробел и добавьте --allow-file-access-from-files
Дважды щелкните HTML-файл индекса для сборки WebGL и скопируйте URL-адрес в панель навигации, когда откроется браузер.
Закройте браузер
Запустите браузер с помощью ярлыка, вставьте URL-адрес, который вы скопировали на шаге 4, и нажмите ввод

Microsoft Edge

Не нужно ничего делать, сборки WebGL работают нормально.

Сафари

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

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

просто откройте свой терминал и войдите в свой каталог (где находится файл HTML) и запустите сервер, используя одну из команд ниже.

Уроки

Или как создать браузерную игру с помощью Unity 5.

С выходом пятой версии движка в Unity появилась возможность экспортировать свои проекты в WebGL.

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

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

Подготовка сцены.

Запустим Unity и создадим сразу несколько папок: Scene, Material, Prefab и Script. В этих папках мы будем хранить две сцены Game и Menu, физические материалы для игровых объектов, префаб объекта и несколько скриптов.

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

Для этой сферы настроим позицию и размер.

Добавим к сфере компонент Rigidbody, для того чтобы сфера падала вниз и во вкладке Constraints выберем все оси в строке Rotation, тогда наша сфера не будет вращаться.

Добавим на сцену куб, чтобы наша сфера не падала вниз при старте игры, и изменим его размеры по оси Y до 0.1.

Сохраним этот куб в префаб в папку Prefab.

Для реализации прыжков нам необходимо создать два физических материала, для сферы:

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

Применим эти материалы к наши игровым объектам.

В игре у нас будет вид от первого лица, поэтому давайте настроим камеру. Сделаем ее дочерним сферы и изменим некоторые параметры.

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

Настройка управления.

Этот скрипт перенесем на камеру и укажем в строке Hero нашу сферу

Следующий скрипт мы назовем HeroController и поместим на сферу, этот скрипт будет перемещать нашу сферу в зависимости от положения курсора мыши:

Для рандомного создания последующих платформ, кроме первой, создадим скрипт GameManager и переместим его на камеру.

Укажем наш префаб платформы и сферу.

Создание меню.

Сохраним сцену Game и откроем сцену Menu. Добавим новый элемент Canvas и дочерний ему Button.

Первым делом настроим камеру.

Далее настроим канвас,

Создадим еще один JS-скрипт UIController и поместим его на кнопку

В обработчике кнопки OnClick нажмем плюс и добавим нашу кнопку, выберем функцию StartGame из скрипта UIController.

Сохраняем сцену и экспортируем нашу сцену для платформы WebGL.

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

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

В этом уроке я собираюсь показать вам, как начать работу с Unity. Я также покажу вам, как создать простую игру в Unity с использованием JavaScript и как экспортировать вашу игру в Интернет.

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

Слово о JavaScript в Unity

Установка Unity

Чтобы начать этот урок, нам нужна работающая версия Unity, которую можно скачать здесь . У Unity есть установщики для Windows и Mac OS X. Пользователи Linux могут запускать Unity через Wine , но ваш пробег может отличаться.

После установки мы готовы! Итак, давайте откроем Unity и создадим новый 3D-проект.

Настройка проекта

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

Создать героя

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

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

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

Чтобы спасти героя от бесконечного падения, мы создадим плоскую коробку, которая служит платформой. Для этого мы должны добавить куб и установить значение Scale . Y равным 0.1 . Воспроизведение сцены подтверждает, что герой благополучно приземляется на платформу, хотя я должен признать, что на самом деле это не выглядит естественно. Так как же заставить героя подпрыгнуть? Добавив некоторые физические материалы.

Сделать герой отказов

Прежде всего, нам нужно создать новый физический материал для сферы, чтобы сделать ее бодрой. Для этого создайте новую папку в папке « Assets » под названием « Materials и создайте новый физический материал. Давайте назовем это Bouncy_Sphere . Значения, которые нам нужно настроить в Инспекторе :

Если мы добавим этот материал в Sphere Collider , это заставит сферу подпрыгивать вверх и вниз, но всегда на равную высоту. Чтобы заставить сферу подпрыгивать все выше и выше с каждым отскоком, мы должны также добавить физический материал на платформу. Для этого мы создадим другой материал с именем Bouncy_Platform и изменим его значения на:

Dynamic Friction : 0.9 Static Friction : 0.9 Bounciness : 1 Friction Combine : Average Bounce Combine : Multiply

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

Добавить перспективу от первого лица

Чтобы добавить перспективу от первого лица, мы перетаскиваем камеру (в Иерархии ) на сферу. Это сделает камеру дочерним элементом героя и заставит камеру следовать за сферой во время движения. Свойства камеры также должны быть настроены на:

Мы также создадим прожектор как второй ребенок сферы. Это даст игроку ощущение текущей высоты прыжка героя. Настройте значения прожектора, чтобы:

Программируйте Контроллер

Первая переменная является публичной и имеет тип GameObject ; оно должно ссылаться на сферу. Переключаясь обратно в Unity с выбранной камерой, мы видим эту общедоступную переменную рядом с полем ввода с пустым значением. Давайте перетащим сферу в этот слот и назначим значение переменной.

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

Единственное, что осталось сделать в скрипте InputController это получить значения от мыши, когда бы она ни перемещалась. Для этого мы используем функцию Update , которая вызывается для каждого кадра:

Обе новые переменные x и z обозначают соответствующую ось. Когда мы смотрим вниз по оси Y, мы видим горизонтальную ось X и вертикальную ось Z. На этих осях мы хотим отрегулировать положение героя после получения ввода мышью. Для этого мы используем Input . mousePosition , который возвращает двумерный вектор . Вектор, нулевое значение которого находится внизу слева, должен быть обработан в нашей системе координат с началом координат в середине экрана. Это происходит в следующих строках. В заключение мы вызываем функцию setHeroPosition с обоими вычисленными значениями в качестве аргументов. Мы напишем эту функцию в новом скрипте под названием HeroController прикрепленном к сфере:

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

Создавайте платформы процедурно

Для автоматического создания платформ нам нужен какой-то шаблон платформы. Это называется «сборным» в Unity. Чтобы создать префаб, нам нужно перетащить платформу из Иерархии в новую папку assets , которая (в соответствии с нашим соглашением об именах) называется Prefabs . Сборные могут быть распознаны в Иерархии по их синему цвету. Все платформы (за исключением первой) будут созданы с помощью нового скрипта под названием GameManager , который прикреплен к камере. Мы запускаем этот скрипт, ссылаясь на необходимые переменные:

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

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

Далее мы можем добавить код, чтобы получить следующую позицию панели. Мы поместим это в дополнительную функцию, чтобы обеспечить читабельность:

Чтобы убедиться, что новые значения x и z вектора положения не совпадают с предыдущими, мы используем цикл do while while. Функция Unity Random.Range является правильным способом получения случайных значений для значений x и z . В обоих случаях мы хотим, чтобы они были между -1 и 2. Наконец, мы сохраняем новую позицию как последнюю позицию панели и возвращаем ее.

Добавить игровое меню

Сначала давайте проверим, падает ли герой ниже определенной точки. Для этого давайте отредактируем оператор if в функции update скрипта GameManager . Оператор else if проверит, находится ли y-позиция сферы ниже -2.0 единиц. В этом случае мы вызываем приватную функцию gameOver :

Мы будем использовать новую функцию для обработки состояния игры, которая выглядит следующим образом:

Здесь мы используем класс приложения Unity, который дает нам доступ к методу LoadLevel который мы можем использовать для загрузки новой сцены с именем Menu . Чтобы заставить этот код работать, мы сначала должны создать сцену через File> New Scene, а затем сохранить ее с именем Menu . После этого нам нужно добавить обе сцены в процесс сборки. Настройки сборки можно открыть в меню «Файл»> «Настройки сборки» . Сцена меню все еще должна быть открыта, поэтому давайте нажмем кнопку Add Current , чтобы добавить сцену в настройки сборки. Повторите это действие с открытой сценой уровня. Теперь, когда мы закончим игру, мы должны перейти на вновь созданную сцену игрового меню.

Добавить кнопку для запуска игры

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

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

элемент EventSystem и
элемент Canvas с
дочерний элемент Button и
его дочерний элемент Text .

Мы можем применить эту функцию в настройках инспектора кнопки. В настройках компонента Button ( Script ) мы можем выполнять функцию всякий раз, когда игрок щелкает ее. Для этого мы добавляем новую функцию в событие On Click ( ) , щелкая значок + . Теперь мы можем перетащить саму кнопку в поле ввода. Затем мы выбираем только что написанную функцию из скрипта UIController . StartGame ( UIController . StartGame ).

Опубликуйте свой проект как браузерную игру WebGL

Unity может экспортировать проект как приложение WebGL. Открыв настройки сборки, мы выбираем WebGL в качестве платформы. Затем мы переключаем место экспорта, нажав кнопку « Переключить платформу» . После этого нам просто нужно нажать кнопку Build и выбрать название для нашей игры. Когда процесс сборки завершится, мы можем открыть html-файл с помощью браузера для настольных ПК с поддержкой WebGL.

Куда мы идем отсюда?

Конечно, эта маленькая игра может быть улучшена, например, с помощью партитур, большего количества типов платформ, дополнительных методов ввода, аудио и так далее. Но в этом уроке мы увидели, что кроссплатформенный игровой движок Unity предлагает комбинацию WYSIWYG-редактора и возможностей сценариев, которые мы можем использовать с языком, похожим на JavaScript. В зависимости от требований нашего конкретного проекта, Unity может быть хорошей альтернативой средам WebGL.

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

Читайте также: