воскресенье, 25 декабря 2016 г.

Unreal Engine 4: Рендер текста со своими шрифтами

Данный текст основан на уроке из раздела вопросов и ответов официального сайта Unreal Engine 4. Тем не менее, это не просто перевод-копирование текста. Автор-таки внес свою лепту в данное руководство, основываясь на личном опыте. :)
Проблема с визуализацией шрифтов в Unreal Engine 4 является одной из самых распространенных, с которой сталкиваются начинающие разработчики. Тем не менее, автор считает, что читатель знаком с основами UE4, так что простейшие вещи в тексте не объясняются.

Шаг 1. Импорт шрифта

В UE4 существует два типа кеширования шрифтов: Runtime (предназначены для использования в UMG) и Offline (как раз для Text Render).
Для начала установите нужный шрифт в системе. Затем в UE4 создайте новый шрифт, обзовите понятным вам образом и перейдите к его настройкам. Должно открыться окно, наподобие этого:
Выберите Font Cache Type — Offline.
Unreal Engine выдаст сообщение с предупреждением о необходимости «переосмыслить» шрифт и попросит указать, какую именно гарнитуру вы хотите использовать, а также ее начертание и размер (обычно что-то между 20 и 30 вполне подойдет, но, все-таки, зависит от задачи).
После инициализации шрифта появятся опции импорта, где нас интересует несколько параметров:
  1. Height — размер (высота) символов шрифта. Следует выбирать, исходя из задачи: насколько крупной должна быть надпись. Шрифт пересчитывается в изображение, так что маленькие символы при большом приближении будут выглядеть печально. Но и сильно громадные буквы на все времена делать не стоит — есть механизмы сглаживания шрифтов при разумном увеличении (см. п. 5).
  2. Character Set и Unicode Range — эти параметры управляют, какие символы войдут в шрифт. По умолчанию кириллические символы (как и многие другие) не включаются в набор, для их использования в поле Unicode Range нужно ввести диапазон: «0410-044F» (если вам нужны и другие диапазоны, перечислите их через запятую). Подробнее о том, как узнать нужные диапазоны символов можно прочитать в конце статьи.
  3. Create Printable Only следует включить, чтобы в наборе символов остались только печатаемые (и исключить все те, которые шрифт не может отображать).
  4. Texture Page Width и Texture Page Max Height — задают размер страниц изображений со шрифтом. Шрифт может разбиваться на несколько изображений, но лучше стараться подобрать эти размеры так, чтобы все нужные символы уместились на одной странице.
  5. Use Distance Field Alpha и настройки Distance Field позволяют значительно улучшить отображение шрифта при его увеличении на экране. Чем выше значение Distance Field Scale Factor, тем лучше будет смотреться шрифт и тем дольше он будет ре-импортироваться — не пугайтесь, будьте к этому готовы, всё нормально. Значения в диапазоне 10-20, как правило, подходят для подавляющего большинства задач.
После изменений, чтобы посмотреть результат, вам нужно переимпортировать шрифт: меню Asset > Reimport [имя_шрифта]... Не забудьте также сохранить результат работы.

Шаг 2. Создание материала текста

Самый простой способ создать материал для Text Render — создать Material Instance и в качестве родителя ❶ выбрать DefaultTextMaterialTranslucent (это Engine Content, если что).
Он содержит единственный параметр — текстуру шрифта ❷, где необходимо указать созданный на первом шаге шрифт. Заслуживает некоторого внимания параметр Font Page, который указывает на страницу текстуры с символами (привет пункту 4 из 1 шага).
Если вам требуется больше контроля, то можно сделать копию указанного материала и изменить в нем все, что пожелаете.

3. Использование шрифта в Text Render

Теперь можно добавить в свой Blueprint компонент Text Render. В блоке Text нужно указать созданные в предыдущих шагах материал ❶ и шрифт ❷.

Примечание: определение (диапазонов) кодов символов

Для этого запустите программу «Таблица символов» (в Windows) или аналогичную, выберите используемый шрифт и определите группу символов. Символы идут последовательно, так что достаточно узнать коды первого и последнего символа в таблице, чтобы получить диапазон («U+» для кодов не вводите).