Как воспроизвести GIF-анимацию при загрузке игры Unity WebGL скачать в хорошем качестве

Как воспроизвести GIF-анимацию при загрузке игры Unity WebGL

Как воспроизвести GIF-анимацию при загрузке игры Unity WebGL Как создать пользовательский шаблон Unity WebGL:    • How to Create a Unity WebGL Template   Ссылка на GIF-анимацию, использованную в этом видео: https://files.catbox.moe/6l2nk7.gif Ссылка на готовый шаблон WebGL: https://pastebin.com/3nWaw47e Ссылка на готовый шаблон WebGL с задержкой в ​​5 секунд: https://pastebin.com/sC0Dq3a6 Ссылка на другие уроки по Unity WebGL:    • Unity WebGL Tutorials   Привет! В этом уроке по Unity WebGL мы рассмотрим, как создать пользовательский экран загрузки для вашей игры Unity WebGL. Это будет сделано путем воспроизведения GIF-анимации во время загрузки вашей игры Unity WebGL. Чтобы воспроизводить GIF-анимацию при изменении состояния игры Unity WebGL, нам нужно изменить шаблон WebGL и файл index.html. Сначала нам нужно добавить нужную GIF-анимацию в шаблон WebGL, а затем обновить файл index.html, чтобы создать div-элементы для GIF-анимации и скрыть её после завершения загрузки игры. Чтобы добавить GIF-анимацию загрузки в вашу сборку Unity WebGL, начните с того, что поместите холст в специальный контейнер, определяющий видимую область игры. В вашем коде контейнер Unity имеет фиксированную ширину и высоту, взятые из переменных сборки Unity, и он позиционируется относительно. Именно это относительное позиционирование позволяет слою загрузки располагаться точно над холстом, а не плавать где-то ещё на странице. Затем поместите слой загрузки в тот же контейнер и разместите его перед холстом в HTML. В вашем коде это div для GIF-анимации загрузки. Он позиционируется абсолютно и заполняет весь контейнер с помощью параметра inset, установленного на ноль, так что он покрывает всю область холста от края до края. Вы также устанавливаете высокий z-индекс, чтобы индикатор загрузки всегда отображался над холстом Unity WebGL во время загрузки сборки. Затем центрируйте GIF, используя настройки flex для слоя загрузки. Параметр display flex превращает индикатор загрузки в flex-контейнер, align items center центрирует изображение по вертикали, а justify content center центрирует его по горизонтали. Поскольку индикатор загрузки заполняет ту же область, что и контейнер игры, GIF всегда остается центрированным над холстом Unity без необходимости каких-либо ручных смещений. После этого укажите источник изображения на ваш GIF-файл и убедитесь, что файл размещен в нужном месте. Ваш источник изображения представляет собой простой относительный путь, поэтому GIF должен находиться в той же папке, что и файл индекса WebGL, если вы не измените путь. Браузер автоматически анимирует GIF сразу после загрузки, поэтому функция воспроизведения не требуется. Правила ширины и максимальной ширины, которые вы задаёте, управляют размером отображаемого GIF-изображения и предотвращают его выход за пределы экрана на маленьких экранах. Теперь свяжите скрытие GIF-изображения с завершением загрузки Unity. Ваш вызов createUnityInstance возвращает промис, а функция обратного вызова then запускается, когда Unity завершит инициализацию среды выполнения WebGL и игра будет готова. Внутри этой функции обратного вызова вы устанавливаете display для загрузчика в значение none. Это убирает наложение из поля зрения, отображает холст Unity под ним и останавливает рендеринг GIF-изображения. Наконец, если вы используете мобильную ветку, которая делает холст полноэкранным, имейте в виду, что размер загрузчика определяется контейнером, а не непосредственно холстом. Если вы заметили, что GIF-изображение не покрывает весь экран на мобильном устройстве, примените к контейнеру тот же размер полноэкранного режима, чтобы наложение и холст оставались одинакового размера. Когда контейнер и холст совпадают, GIF остаётся идеально центрированным и покрывает игровую область до тех пор, пока Unity не завершит загрузку и ваша функция обратного вызова then не скроет его. Вот и всё о том, как отображать GIF-анимацию при загрузке игры Unity WebGL. Спасибо за просмотр этого видео по Unity о том, как создать пользовательский экран загрузки для игр WebGL. Если этот урок по Unity WebGL о создании пользовательских экранов загрузки для игр Unity WebGL был вам полезен, подпишитесь на канал, чтобы получать больше уроков по Unity. Как воспроизвести GIF-анимацию при загрузке игры Unity WebGL Как создать пользовательский экран загрузки для игр Unity WebGL Unity: как создать пользовательский экран загрузки для игр WebGL Как редактировать шаблон WebGL для экрана загрузки в Unity Воспроизведение GIF на экране загрузки Unity WebGL Плавная загрузка WebGL Настройка экрана загрузки Unity Web Player Как изменить экран загрузки WebGL Пользовательский эффект загрузки Unity WebGL