Наложение спрайтов: 2D эффекты со слоями в Unity
![Наложение спрайтов: 2D эффекты со слоями в Unity](https://coremission.net/wp-content/uploads/2020/02/2d-effekty.jpg)
Я начал работать над этой системой после того, как меня спросили о простом 2D лайтинге, но потом я стал играться с эффектом и получил более причудливые результаты. Хочу подбросить еще несколько советов про 2D наложение спрайтов, поэтому выкопал кое-какие старые ассеты.
Идея состоит в том, чтобы для имитации освещения использовать на отдельном слое программные спрайты. Есть и другие способы сделать лучшее освещение, но это настолько простая система, что мне захотелось ею поделиться :)
![ассеты](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-4.png)
![текстура света](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-5.png)
Это шейдеры эффектов изображения, поэтому я *думаю*, что они будут работать в UDP. Но я не пробовал!
Система пошагово:
![добавьте новую камеру](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-6.png)
1. Добавьте новую камеру как дочерний объект главной камеры и сбросьте их положения.
![камера рендерит черный цвет](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-7.png)
2. Убедитесь, что новая камера рендерит черный цвет.
![добавить новый слой на сцену в Unity](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-8.png)
3. Создайте новый слой для рендеринга новой камерой, поставьте спрайты лайтинга на этот уровень.
![слой рендерит только дочерняя камера](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-9-1024x326.png)
4. Настройте, чтобы главная камера не рендерила этот слой, а дочерняя камера освещения рендерила только его.
5. Добавьте к главной камере скрипт Lighting Render Texture.
Скрипт: ссылка на PasteBin
Этот сценарий создаст Render Texture для камеры освещения, отправит ее в шейдер, а затем нарисует материал поверх основной камеры.
6. Импортируйте один из шейдеров, которые упоминаются в статье ниже.
![наложение спрайтов в Unity](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-10.png)
7. Создайте новый материал из шейдера, перетащите его в скрипт.
8. Перетащите камеру освещения в другой слот скрипта.
Простое наложение спрайтов в шейдере
Просто берет спрайты и их подсветку и накладывает друг на друга, никаких дополнительных эффектов.
![наложение спрайтов, кусок кода в шейдере](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-11-1024x148.png)
Этот шейдер берет Render Texture, результат главной камеры.
Затем совмещает (с помощью lerp) наложение результата с камеры, имеющего затемненный цвет, и нормального.
Код шейдера с комментариями: ссылка на PasteBin
Граница с шумом
(Перемещающийся) шум в экранном пространстве вокруг освещенной области.
![кусок кода шейдера](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-12-1024x226.png)
Эта версия создает шум с завитушками и добавляет его к Render Texture освещения, затем через smoothstep создается граница, чтобы можно было контролировать мягкость.
Код шейдера с комментариями: ссылка на PasteBin
Искажение
Искажает по краям
![кусок кода](https://coremission.net/wp-content/uploads/2020/02/nalojenie-spraitov-13-1024x107.png)
Этот шейдер добавляет к главной UV искажающий шум.
Умножая smoothstep на инвертированный smoothstep мы можем взять кольцо вокруг освещенной области и рисовать на нем искажение.
Код шейдера с комментариями: ссылка на PasteBin
Другие эффекты
С этой системой границ освещенной области вы, конечно, можете использовать другие эффекты. Можно изменять цвета сцены за пределами освещенной области, инвертировать цвета, размывать их.
Или поменять местами первые два значения в lerp и поместить эффекты внутрь области!
Оригинал статьи: https://www.patreon.com/posts/2d-sprite-33606001