Godot. Путь к основам VFX. Пишем свой outline shader. Ч1⁠⁠

День добрый, уважаемые любители Godot'a. Хотел вроде разобрать вариант предложенный создателями самого Godot, но у меня как всегда семь пятниц на неделе и почему-то подумалось, что лучше написать этот велосипед с нуля и самостоятельно, по своему разумению. А потом уже сравнить с нормальным вариантом, попутно по возможности выяснив, а как правильнее и лучше. Может кто подскажет заодно, как вообще это выяснить, наверняка должен быть какой-нибудь профайлер для шейдеров)

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

Godot путь новичка. Первый Enemy и первый Шейдер

Вот ссылки на документацию
https://docs.godotengine.org/ru/stable/tutorials/shaders/ind...
https://docs.godotengine.org/ru/stable/tutorials/shaders/sha...

Ну ладно хватит с деталями. Стартуем.

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

Теперь создадим новый шейдер и проверим что все идет как надо.

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

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

Можно это все конечно сократить очень сильно в плане количества кода, сразу будет выглядеть по "шейдерному"(в смысле что нихуя не понятно что происходит), но мне пока больше нравится так, нормальный такой рабочий, джуновский код, пока высшее дао не откроется, буду писать подобным образом) Ну и мне кажется так проще для понимания + когда перейду к доработкам шейдера, очень наглядно будет видно что писать подобным образом, это обрекать себя на переписывание больших кусков кода))

Ну и теперь осталось только добавить настраиваемую ширину каемочки.

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

Во-первых мы использовали 4-Way для определения соседей вместо 8-way, что сразу порождает кучищу проблем, ну да ладно, это всего лишь первая часть, чтобы было что исправлять, надо чего-то и наговнякать же сначала, отправная точка хотя бы имеется)

Ну кому лень делать, в следующей части тогда наглядно покажу.
Спасибо за внимание, всем Godot.