Добавить в корзинуПозвонить
Найти в Дзене
Игровой движок Godot engine

№182. GODOT 4. Смешивание картинок.

В Godot есть метод который позволяет "смешивать" текстуры.
В данной статье покажу как «смешать» одну текстуру с другой, на примере вот такого тира. «Впаивать» будем следы от пуль в мишень, поэтому добавляем в проект эти два спрайта. Добавляем в сцену ноду Sprite2D. Снимаем галочку у offset/center.
Подключаем на него текстуру мишени , и скрипт. Начинаем накидывать код. Для начала нам надо выделить три переменные:
1) Текстура которая будет в итоге подаваться в спрайт.
2) Картинка мишени.
3) Картинка следа пули. Продолжаем в функции ready.
Тут нам необходимо загрузить картинку из файла в переменную img и перевести данные в формат RGBA8.
( ВАЖНО. Форматирование нужно лишь тогда, когда вы используете разные форматы смешиваемых изображений, например PNG и JPEG. В моем же конкретном случае этот шаг не нужен так как форматы одинаковые изначально.
Но я оставил эту строчку просто чтобы вы понимали что это может быть необходимо.) В функции input прописываем по клику следующую последовательность

В Godot есть метод который позволяет "смешивать" текстуры.
В данной статье покажу как «смешать» одну текстуру с другой, на примере вот такого тира.

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

Добавляем в сцену ноду Sprite2D. Снимаем галочку у offset/center.
Подключаем на него текстуру мишени , и скрипт.

-2

Начинаем накидывать код.

Для начала нам надо выделить три переменные:
1) Текстура которая будет в итоге подаваться в спрайт.
2) Картинка мишени.
3) Картинка следа пули.

-3

Продолжаем в функции ready.
Тут нам необходимо загрузить картинку из файла в переменную
img и перевести данные в формат RGBA8.
(
ВАЖНО. Форматирование нужно лишь тогда, когда вы используете разные форматы смешиваемых изображений, например PNG и JPEG. В моем же конкретном случае этот шаг не нужен так как форматы одинаковые изначально.
Но я оставил эту строчку просто чтобы вы понимали что это может быть необходимо.)

-4

В функции input прописываем по клику следующую последовательность:
Загружаем из файла изображение следа пули в переменную
blitImage.
Через функцию
blend_rect смешиваем данные в переменной img (изображение мишени) с данными переменной blitImage (изображение следа пули). В качестве координаты, в которой нужно «впаять» след у нас выступает локальная координата курсора мышки.
Затем так же переводим итоговые данные в формат RGBA8 . (Опять же, я тут перевел «для галочки», так как в моем случае исходники одного формата)

-5

Проверим.

-6

Всё вроде работает как и должно.
Единственное что тут «режет глаз» - создание следа пули идет не в центре курсора. Как мы помним, центр трансформаций у спрайта это левый верхний угол.
В качестве решения можно брать ширину и высоту изображения, делить пополам и вычитать из позиции курсора.

-7

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

Подписывайтесь на канал, вступайте в группу в ВК, и не забывайте что у нас есть дискорд сервер.
Удачи в изучении годо !