Улучшаем рендер TMP шрифтов

Пока я присматриваюсь к UniText, как к полноценной замене TMP, в процессе работы над новым проектом появилась неприятная особенность последнего: тексты с использованием моих шрифтов выглядели «не очень», при уменьшении масштаба канваса — появляется полупрозрачный прямоугольник — что-то с альфой. Причем такой неприятный эффект появляется именно при уменьшении масштаба, а не самого размера шрифта.

Сначала я думал что дело в самом ассете шрифта: размере атласа, настройках текстуры, сжатии, и т.п. В общем, с наскока исправить не получилось 😅 Пересоздавал шрифт с разными параметрами, размерами и прочим — результат оставался прежним.

Выглядело это примерно так:

Артефакты и полупрозрачный прямоугольник

Изыскания вместе с ChatGTP тоже не особо помогли, но сократили поле поиска проблемы. Попутно узнал несколько полезных моментов которые тоже стоит учитывать при создании своих шрифтов:

  • следить за Padding, не должен быть слишком маленький (4-8 норм)
  • использовать SDFAA для мягких краёв
  • не делать Softness слишком большим
  • проверить Filter Mode, по умолчанию билинейный, но можно попробовать Point
  • проверять размер атласа, про это я писал в посте про создание шрифтов

В конце подошёл к своему самому «нелюбимому» – шейдерам 😒 Попробовал менять на разные версии, и мобильную и обратно, проверил на устройстве и редакторе — но результат был прежним. Пришлось использовать технологии прошлого — гуглить 😁

И таки ответ был найден!

В шейдере TMP из-за уменьшения масштаба канваса alphaClip уходит в отрицательные значения — появляется полупрозрачный прямоугольник.

Как исправить

В файле TMP_SDF.shader нужно ограничить alphaClip чтобы он не убегал в минус. Это примерно 200 строка. Вот что нужно сделать:

// alphaClip = alphaClip / 2.0 - ( .5 / scale) - weight;

alphaClip = max(alphaClip / 2.0 - ( .5 / scale) - weight, 0.001);

Таким образом ограничиваем нижний порог альфы. Не знаю пока, костыль это прям или не очень, но на мобилках работает хорошо 😅 Ниже скриншот до/после:

Артефакты и исправленный шейдер

По идее можно сделать более адаптивное решение, чтобы это применялось только если ( .5 / scale) становится слишбом большим, это как бы напрашивается, но я в шейдерах тот ещё эксперт…

В общем, проблема решена, можно двигаться дальше. И ждать когда UniText доведут до ума, добавят поле ввода, найдут основные детские болячки.

Нет комментариев

    Ваш комментарий