Карты смещения

Люди просили меня быстренько рассказать, как работают карты смещения, так что эээ…

Итак, в PR #26709 я добавил карты смещения. Ура. Это позволяет деформировать спрайт на основе другого, специально подготовленного спрайта. Как же нам сделать эти специально подготовленные спрайты?

Формат карты смещения

Карты смещения должны работать так же, как у BYOND. Я вообще не тестировал BYOND, так что есть ненулевой шанс, что я неправильно прочитал их документацию и они интерпретируются наоборот или типа того. Как бы там ни было.

Основная идея в том, что каждый пиксель карты смещения задаёт, насколько «сдвинуть» пиксели в позиции. Следует заметить, что из-за того, как работают GPU, это может работать не так, как вы ожидаете. Вместо указания «Пиксель X смещается в позицию Y», на самом деле указывается «Пиксель X читает из позиции Y». То есть если вы укажете смещение +1 пиксель по горизонтали, спрайт визуально сместится влево, потому что берёт цвет из пикселя текстуры на +1 вправо.

Красный канал управляет горизонтальным отклонением, зелёный канал — вертикальным. Значения красного и зелёного 128 — «нейтральны», то есть без различия. Большие значения красного или зелёного приводят к выборке смещений в правый нижний угол, что фактически означает, что спрайт сдвигается в «левый верхний угол».

Само значение смещения можно изменить параметром «size» в шейдере. По сути этот параметр размера — «на сколько пикселей сдвигается при максимальном значении пикселя». При «size» равном 4 значение 255 сдвинет на 4 пикселя. При size 127 каждое значение канала — это сдвиг на один пиксель (129 -> +1, 130 -> +2).

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

Синий канал игнорируется; я лично использовал его, чтобы отмечать «изменённые» пиксели и было легче видеть, что делает карта смещения в графическом редакторе.

Собственно шейдер

Собственно шейдер карты смещения в SS14 находится по адресу /Textures/Shaders/displacement.swsl. У него три параметра: displacementSize — это размер, описанный выше, а displacementMap и displacementUV предназначены для заполнения системой CopyToShaderParameters спрайтового компонента. Смотрите PR, который я привёл выше, как пример.

Параметры загрузки RSI для карт смещения

Не забудьте установить следующее в meta.json вашего RSI, иначе sRGB сожрёт ваше лицо и вся математика потеряет смысл:

"load": {
    "srgb": false
}

Скрипты Aseprite

Я написал несколько скриптов для Aseprite, помогающих создавать карты смещения. Их можно найти в папке Tools/ репозитория SS14.