Заключительная часть серии статей посвященных визуальному редактору шеидера.
Приступим к созданию. По задумке наш шейдер должен модифицировать всю сцену.
Поэтому поверх всей сцены кладем ноду CanvasLayer под которой будет ColorRect.
Развернем рект на весь экран, и подключим в него шеидер.
Подключаем в цвет текстуру (не забываем выбрать в качестве источника Screen), а в качестве UV координат используем ScreenUV.
Это даст нам координаты всего экрана.
Начинаем раскладывать цвет на составляющие RGB.
Для этого добавим ноды VectorDecompose и VectorCompose.
XYZ тут переходят в RGB. Поэтому если мы подключим только Х канал, то получим только красный цвет.
По этому же принципу отделяем зеленый и синий цвет.
Так как нам нужен сдвиг цвета, то будем модифицировать UV координаты для каждого из цветов.
Далее, для того чтобы сдвиг координат был только по одной оси, нам снова надо разложить вектора. Но на сей раз вектора UV.
Добавляем ноды ScalarOp для подмешивания данных, и ScalarUniform для вывода значения в меню. Подключем в вектор и при изменении значения видим как один из каналов сдвигается по оси Х.
Отлично. Повторим процедуру для зеленого канала.
Я подключил на сдвиг зеленого канала тот же ScalarUniform , чтобы одним значением управлять сдвигом двух цветов.
Проверяем:
Всё в порядке. Осталось добавить крутилку яркости.
Для этого подмешиваем еще один ScalarUniform в VectorOp.
И, на этом вобщем то и всё.
ИТОГИ
Как вы могли заметить, в определенный момент времени каша из нод начинает представлять из себя краине сложную для понимания структуру. И это наверное самый главный минус.
Сам по себе редактор тоже пока еще сырой. Нет возможности коллапсить блоки в группы, нет миникарты. Пути могут перекрываться нодами и не всегда понятно куда они идут.
Но для простых вещей он вполне подходит.
И напоследок, для сравнения приложу два скрина.
1) Код в визуальном виде
2) Тот же код в классическом виде
Надеюсь вам был полезен этот материал.
Подписывайтесь на канал, и вступайте в группу в ВК.