Размытый фон для элементов UI Toolkit.

Удобный и понятный пользовательский интерфейс для всех.

✔️ Очень простой в использовании

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

✔️ Работает на всех конвейерах рендеринга.

Поддерживаются встроенные протоколы URP и HDRP

✔➡ Примеры включены

Перейдите на страницу Kamgam/UIToolkitBlurredBackground/Examples, чтобы открыть демонстрационную версию.

✔️ Готово для мобильных устройств

Несколько настроек качества, чтобы вы могли адаптировать его к своим потребностям.

✔️ Полный исходный код включен

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

✔️ Поддерживает Unity 2021.2+, 2022, 2023, Unity 6 (да, поддерживает графику рендеринга), Unity 6.3, ... LTS

⚠ Размытие пользовательского интерфейса поверх пользовательского интерфейса только в Unity 6.3+ в сочетании с ФИЛЬТРАМИ

Во всех остальных версиях размыто только содержимое сцены.

ПОЖАЛУЙСТА, ознакомьтесь с инструкцией перед покупкой, если вы хотите использовать UI поверх UI blur. Есть некоторые ограничения и требуется ручная настройка (без кодирования). Ознакомьтесь с инструкцией.

✔️ Работает с USS-фильтрами (новыми в Unity 6.3 🥳)

В Unity 6.3 наконец-то были добавлены фильтры на основе шейдеров (ура). Однако эти фильтры (например, размытие пользовательского интерфейса) влияют только на сам пользовательский интерфейс, а не на содержимое сцены за ним. - Это означает, что если вы хотите получить полностью размытый вид (пользовательский интерфейс и фон), вы все равно можете использовать этот ресурс. Пожалуйста, ознакомьтесь с инструкцией о том, как наилучшим образом использовать размытие фона в сочетании с фильтрами (TLDR: Используйте низкое размытие, например, 0,1 для этого актива, и высокое размытие для нового фильтра, готово).

Что вам следует знать (👓 пожалуйста, прочтите это перед покупкой).

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

Это не ресурс UGUI или IMGUI. Это для нового набора инструментов пользовательского интерфейса.

Если вам нужно размытие UGUI, пожалуйста, ознакомьтесь с моим ресурсом UGUI Blurred Background.

❗️ Вам нужна версия Unity 2021.2 или выше.

❗️ Новый режим "Мировое пространство" в Unity 6000.2+ или выше поддерживается только в URP.

❗️ Нет сглаживания для закругленных углов. Это ограничение UIToolkit, надеюсь, когда-нибудь они его исправят.

⚠️ Встроенный конвейер рендеринга добавит к вашим камерам компонент скрипта, который подключится к процессу рендеринга и сгенерирует размытое изображение. Этот компонент не сохраняется в сцене. При необходимости он будет создан во время выполнения.

⚠️ Он предполагает прямой рендеринг. Если вы используете отложенный рендеринг, то он может не сработать (он не протестирован на средствах отложенного рендеринга).

⚠️ 2D-проекты URP официально не поддерживаются (если вы используете универсальный конвейер рендеринга с 2D-рендерером). Это сработало в некоторых тестовых сценариях, но не было широко протестировано. Обратите внимание: обычные URP-проекты поддерживаются полностью.

⚠️ НЕТ поддержки виртуальной реальности: у меня были сообщения о том, что она не работает в Quest 2, что наводит меня на мысль, что она не работает в виртуальной реальности. Изображение может получиться размытым, но, скорее всего, оно будет смещено.

⚠️ Нет HDR: На данный момент HDR не поддерживается (поддерживается HDRP, но не рендеринг с высоким динамическим диапазоном). Почему? -> это сложно

✍️ Использование

1) Откройте окно конструктора пользовательского интерфейса

2) Добавьте новый элемент UIToolkitBlurredBackground из раздела Библиотека > Проект > Kamgam.

3) Готово. Дальнейшая настройка не требуется. Он ведет себя так же, как любой обычный визуальный элемент.

😎 ПОДСКАЗКА 1:

Размытый фон рисуется ПОВЕРХ обычного фона. Используйте альфа-оттенок в сочетании с ярким цветом фона, чтобы имитировать полупрозрачное белое стекло.

СОВЕТ 2:

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

🤠 ПОДСКАЗКА 3:

Если вы хотите полностью отключить размытие, установите количество итераций размытия или силу размытия на 0. Это отключит эффект.

🤓 ПОДСКАЗКА 4:

Используйте как можно меньше "итераций размытия" (в идеале - 1). Итерации могут повысить качество, но они также являются самой дорогостоящей настройкой, которую вы можете использовать. Лучше использовать эти настройки качества.

СОВЕТ № 5:

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

🥳 ПОДСКАЗКА 6:

В Unity 6.3 используйте низкое значение размытия (например, 0,1), чтобы любой фильтр воздействовал на размытый контент. Этот трюк можно использовать для применения фильтра размытия пользовательского интерфейса к пользовательскому интерфейсу, включающему сцену (чего обычно не происходит). О, и это работает не только для размытия, но и для всех фильтров. Наслаждайтесь :-)

Свечение, контуры и мягкие тени для элементов вашего UI Toolkit.

✔️ Свечение и контуры

Выберите два цвета и наслаждайтесь эффектом свечения. Выберите один и тот же цвет для обоих, и получится контур. ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ: свечение НЕ является шейдерным эффектом BLOOM (UI Toolkit пока не поддерживает шейдеры). Это простой цветовой эффект vertex (как показано на видео). *Более подробная информация приведена ниже.

✔️ Тени

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

😎 Неразрушающий рабочий процесс для glow и outlines

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

Информация: Для теней вам нужно будет использовать пользовательский элемент управления "Тень" (подробнее об этом ниже или в руководстве).

💫 Анимация

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

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

✔️ Атрибуты USS

Управляйте каждым свойством с помощью пользовательских атрибутов свечения.

✔️ Удобные функции

* Наследование цветов границы: позволяет быстро добавлять контуры, соответствующие цвету границы (и вы также можете подкрашивать их).

* Разделение ширины свечения: управляйте шириной свечения с каждой стороны отдельно (полезно для эмуляции теней).

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

📚 Множество примеров и документации

Ознакомьтесь с Kamgam/UIToolkitGlow/Examples.

✔️ Поддерживает URP, HDRP и встроенные

Нет пользовательских шейдеров. Он генерирует геометрию и использует цвета вершин.

✔️ Полный исходный код

Я публикую этот ресурс с полным исходным кодом, потому что, как разработчик, я знаю, как раздражает отсутствие доступа к исходному коду. Если вам это нравится, пожалуйста, напомните другим о покупке плагина. Не копируйте и не вставляйте его везде (за исключением лицензионных частей MIT, которые вы можете скопировать). Спасибо тебе ❤️

✔️ Поддерживает Unity 2021.3+, 2022, Unity 6, Unity 6.3, ... LTS

Возможно, это работает и с более ранними версиями, но они больше не тестируются.

👇 Что вам следует знать* 👇

(Прочтите это перед покупкой)

😲️ Это не продукт uGUI или IMGUI. Это для нового набора инструментов пользовательского интерфейса.

😢️ Это (пока) не полнофункциональное решение для USS BOX SHADOW. Unity объявила, что со временем они добавят их (источник).

Поскольку контур нарисован внутри элемента, вам придется установить значение "ВИДИМЫЙ" для параметра "Переполнение", иначе сетка контура будет обрезана. Если вы хотите, чтобы переполнение было скрыто, то, пожалуйста, разместите дочерний элемент внутри элемента для отсечения.

⚠️ Свечение НЕ является эффектом шейдера BLOOM. К сожалению, UI Toolkit пока не поддерживает пользовательские шейдеры, и поэтому мы не можем добавить к нему эффекты постобработки. Свечение в этом активе основано на цвете вершин. Это будет выглядеть не так красиво, как эффект цветения или свечения на основе шейдеров. Пожалуйста, взгляните на изображения и видео выше, они взяты непосредственно из демонстрационных сцен Unity.

⚠️ Анимация выполняется с помощью вершинной анимации на процессоре (ограничение Unity в UI Toolkit). Будьте осторожны при анимации большого количества элементов одновременно. Обычно это не просто "Вы были предупреждены!". Если у вас возникнут какие-либо проблемы, пожалуйста, свяжитесь со службой поддержки. Возможно, нам удастся найти индивидуальное решение.

❗️ Если вам нужен точный контур, основанный на пиксельной информации изображения (альфа/прозрачность), то это не тот ресурс, который вам нужен. Он генерирует прямоугольные или закругленные контуры (или более сложные контуры с анимацией), но они не основаны на информации о пикселях (альфа / прозрачность) любого изображения.

⚠️ Требуется Unity 2021.3 или более поздней версии (настоятельно рекомендуется использовать версии LTS).

* Я знаю, что некоторые из этих ограничений раздражают. Большинство из них связано с отсутствием функций в UI Toolkit. Однако UI Toolkit все еще разрабатывается Unity, и я уверен, что со временем ситуация улучшится.

✍️ Использование

Worflow A (пользовательские элементы управления)

1) Добавьте элементы управления свечением или тенью в свой макет пользовательского интерфейса

2) Разместите содержимое внутри.

3) Готово

Worflow B (неразрушающий)

1) Добавьте GlowDocument в свой документ пользовательского интерфейса в сцене

2) Настройте новую конфигурацию glow (или повторно используйте существующую)

3) Задайте имя класса (например, "glow-100").

4) Добавьте класс в список классов в UI Builder (или в вашем UXML).

5) Готово

😎 ПОДСКАЗКА 1:

Вы можете использовать либо компонент UI Toolkit Glow, либо компонент UI Toolkit Shadow для обертывания ваших элементов, либо использовать компонент GlowDocument в вашем документе пользовательского интерфейса, который затем позволит вам добавлять и удалять эффекты с помощью имен классов.

🧐 ПОДСКАЗКА 2:

Используйте информацию о внешних вершинах в OnBeforeMeshWrite, чтобы анимировать только внешние вершины. Также в GlowManipulator есть удобный метод "DisplaceVertexOutwardsNormalized()" для перемещения вершин вдоль вектора, направленного наружу.

🤠 ПОДСКАЗКА 3:

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

Используйте GlowUtils.Зарегистрируйте функцию Toggleclassonhover(), чтобы легко добавлять контуры при наведении курсора мыши на элементы.

Этот пакет содержит набор "Простые векторные иконки", состоящий из более чем 320 иконок для вашей игры.

В этот пакет также входит пакет "Ресурсная векторная графика", состоящий из нескольких векторных графических материалов.

Шрифт, показанный в образцах, также включен в комплект и лицензирован по лицензии SIL Open Font License.

Исходные файлы были представлены в формате PSD.

Содержимое этого пакета может быть использовано в коммерческих проектах

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

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

➡️ Этот ресурс является частью пакета PRO UI. Получите 9 ресурсов для создания профессиональных пользовательских интерфейсов и сэкономьте более 50%!

Выгоды

Полная гибкость в создании пользовательского интерфейса за счет использования скруглений, границ, контуров, свечения, теней, затенения и многого другого.
Быстро создайте профессиональный пользовательский интерфейс с помощью простого в использовании редактора и/или кода
Настройте цветовые схемы, используя градиенты в пользовательском интерфейсе, со спрайтами или без них.
Обеспечьте согласованность всего пользовательского интерфейса
Уменьшите размер вашей игры, не требуя использования дополнительных спрайтов для пользовательского интерфейса
Спрайты поддерживаются, но не обязательны, все функции изображения совместимы
Поддержка маскировки позволяет легко комбинировать изображения для создания причудливых форм
Высокая производительность (идентична изображению)

Особенности

Градиенты: Изменяйте цвета пользовательского интерфейса с помощью градиентных эффектов, они доступны в широком разнообразии типов, поддерживают прозрачность и предустановки. Градиенты поддерживают как графический компонент Unity, так и закругленное изображение.
Процедурное округление пользовательского интерфейса: динамически закругляйте углы объектов пользовательского интерфейса, используя спрайты или без них. В редакторе или во время выполнения
Точные хитбоксы: динамические хитбоксы обеспечивают точное определение щелчка или касания в пользовательском интерфейсе, включая возможность учитывать эффекты округления для определения попадания
Инструменты редактора: включает в себя понятный и простой в использовании редактор
Маскировка: Полная поддержка динамических фигур, используйте маскировку для создания необычных фигур или украшения пользовательского интерфейса. (Поддержка компонентов Mask и RectMask2D).
Доступный код: весь код включен в пакет и подробно прокомментирован, что позволяет вам понимать, изменять и расширять его
Эффекты пользовательского интерфейса: используйте сглаживание краев для эффектов свечения, тени и сглаживания алиасов
Границы и контуры: динамически создавайте границы и регулируйте ширину границы для создания контуров
Атласы спрайтов: полностью поддерживаются спрайты из атласов спрайтов или таблиц спрайтов
Совместимость: в качестве дополнения к графическому компоненту все функции изображения остаются совместимыми, включая соотношение сторон и параметры заливки.
Протестировано и оптимизировано для мобильных платформ (iOS и Android) и веб-интерфейса (WebGL).

Известные ограничения:

* Параметры заливки могут предотвратить появление эффекта округления или спада.

**Для использования Sprite sheet/atlas требуется Unity 2020.2 или новее.

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

Независимо от того, являетесь ли вы опытным разработчиком игр или только начинаете свой путь, этот инструмент абсолютно изменит правила игры для любого, кто работает над 2D-игрой. Его универсальность и потрясающие визуальные эффекты поднимут вашу игру на новую высоту, вызывая у игроков благоговейный трепет.

Забудьте о сложных требованиях к программному обеспечению. Для этого пакета вам не понадобится программное обеспечение Spine. Просто возьмите пакет Spine-Unity V4.1, который легко доступен, и все готово!

У вас есть вопросы или вы столкнулись с какими-либо трудностями? Не переживайте. Мы готовы поддержать вас на каждом этапе. Напишите нам по электронной почте по адресу anhkhiem02@gmail.com, и наша команда будет более чем счастлива помочь вам.

Не упустите возможность вдохнуть жизнь в свою игру с помощью этих невероятных анимаций. Воспользуйтесь ими прямо сейчас и дайте волю своему творчеству!

Этот пакет включает в себя :

27 шаблонов сцен, включая файлы PSD + PNG
50 настраиваемых эмодзи в файлах PSD + PNG
+110 настраиваемых элементов в PSD + PNG файлах
+100 элементов для настройки вашего интерфейса (кнопки, всплывающие окна, фон, индикатор выполнения, карточка игрока и многое другое ...)

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

Спасибо :)

Pixelate v2 - это крупное обновление с полностью переработанным пользовательским интерфейсом, более плавным рабочим процессом съемки и новыми мощными инструментами для управления конечным видом ваших спрайтов.

Создавайте согласованные цвета в пиксельной графике с помощью автоматических цветовых палитр или создавайте свой собственный образ с помощью пользовательских цветовых палитр.

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

Экспортируйте стилизованные карты нормалей, разработанные для 2D-освещения URP, чтобы сгенерированные вами спрайты реагировали на 2D-освещение в реальном времени, сохраняя при этом стиль пиксельной графики.

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

Pixelate v2 также включает в себя совершенно новую онлайн- и офлайн-документацию, обновленные демонстрационные сцены и более простую настройку для новых пользователей.

⭐ Выделение функций ⭐

✔️ Превращение 3D-моделей и анимации в 2D-листы спрайтов в пиксельной графике

✔️ Автоматические и пользовательские цветовые палитры

✔️ Предварительный просмотр анимации в реальном времени перед экспортом

✔️ Стилизованные карты нормалей для 2D-подсветки URP

✔️ Общие профили стилей для всех менеджеров захвата

✔️ Экспортируйте статические спрайты или листы анимационных спрайтов

✔️ Контролируйте размер спрайтов, частоту кадров, поворот и количество пикселей на единицу измерения

✔️ Работает в редакторе Unity без режима воспроизведения

✔✅ Включена онлайн- и офлайн-документация

✔️ Активная поддержка

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

4 полностью настраиваемые демонстрационные сцены
Включены элементы атмосферы
Включен короткий эмоциональный саундтрек

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

Высококачественные изображения: Все эмодзи представлены в формате PSD размером 512x512 пикселей, что обеспечивает кристально чистое изображение.
Плавная анимация: Эмодзи анимируются с помощью Unity Animator, что обеспечивает плавную интеграцию в вашу игру.
Гибкая интеграция: Включает пользовательский скрипт ParentFitter.cs для идеального масштабирования 2D-эмодзи до любого прямоугольного размера пользовательского интерфейса. Не удаляйте файл ParentFitter.cs!
Универсальное использование: Префабы и анимации разработаны для пользовательского интерфейса, но мы также предоставляем префабы world-space canvas, позволяющие использовать эмодзи в сценах за пределами пользовательского интерфейса.

Независимо от того, разрабатываете ли вы мобильную игру, игривый пользовательский интерфейс или уникальную игровую механику, этот пакет предлагает яркий способ заинтересовать ваших игроков!

• графика в разрешении 1920x1080

• Включены файлы в формате PNG для всех элементов ассетов.

• Графический интерфейс с демонстрационной сценой макета и сборками включен

• Кодирование и анимация не включены

◼ Ассеты

• Более 400 исходных текстов в формате PNG

• 72 значка кнопок (синий, серый, красный, желтый)

• 72 значка пиктограмм (64x64, 128x128, 256x256, 512x512)

• 23 редактируемых векторных слоя в формате PSD

• 1 пиктограмма с иконками AI

◼ Готовые шаблоны (более 98)

Кнопки, рамки, всплывающие окна, слайдеры, UI_Etc, демонстрация