Pull to refresh

Четыре способа работы с текстом UI в Unity

Reading time 6 min
Views 56K
Original author: Dylan Wolf
В процессе преобразования старого кода Unity на основе 2D Toolkit в чистый код Unity я столкнулся с проблемой: в Unity есть замечательная поддержка стандартных форматов шрифтов, но этого всё равно недостаточно, чтобы сравниться поддержкой создания шрифтов из листов спрайтов в tk2d.


Пример спрайтового шрифта

На самом деле, это не очень серьёзная проблема — в конце концов, проще и логичнее вставить готовый шрифт, но я хотел сохранить стиль, похожий на рукописные надписи.

Поэтому я приступил к каталогизации различных опций, которые предоставляет Unity при работе с текстом UI (в том числе недавно приобретённого Unity и встроенного в версию 2018.1 TextMesh Pro). Хотя мои знания типографики довольно узки (а тема эта, похоже, очень сложна), статья позволит вам понять, какие возможности существуют и как их можно использовать.

Стандартный Unity Font Asset




Стандартная поддержка Unity файлов шрифтов .ttf и .otf — простейший и самый популярный способ реализации текста в игре.

Похоже, что внутри он является динамически создаваемым спрайтовым шрифтом. Unity создаёт из шрифта текстуру с заданным размером шрифта.

Источник: шрифты автоматически создаются из файлов .ttf или .otf.

Применение: только для компонентов UI Text

Возможности масштабирования: текст можно свободно масштабировать в компоненте UI Text. Масштабирование самого шрифта увеличивает размер генерируемой из шрифта текстуры, что делает результат более чётким.

Плюсы/минусы: Прост в использовании, но поддерживаются только импортируемые шрифты.

Подробнее: документация Unity по шрифтам

Unity Custom Font



Unity имеет возможность создания произвольных спрайтовых шрифтов, но возможность их масштабирования ограничена.

Источник: Custom Fonts создаются из материала (Material) (который ссылается на Texture) и таблиц символов.

Таблицы символов кажутся мне немного сложными (но думаю, что это проще, чем разбираться с UV-координатами). Кроме того, похоже. не существует GUI-инструмента для их генерации из самого листа спрайтов. У каждого символа есть следующие свойства:

  • Index: индекс символа ASCII
  • UV texture coordinates: находится в интервале от 0 до 1, обозначает процент ширины и высоты текстуры
  • Vert: пиксельные координаты
  • Advance: шаг в пикселях перед отрисовкой следующего символа, чем больше значения, тем больше пробелы между символами.

Опции масштабирования: похоже, масштабирование является слабым местом Custom Fonts. Судя по тому, что я видел, эти шрифты игнорируют свойство Font Size компонентов Text и ограничены размером импортированной текстуры.

Можно задать масштаб game object, содержащего компонент Text. Однако при этом изменяются границы элемента, поэтому это довольно неудобно, если вы хотите выровнять разные элементы.

Применение: только для компонентов UI Text

Плюсы/минусы: является нативной поддержкой спрайтовых шрифтов в Unity, но размер можно менять только с помощью масштабирования. Нет инструмента для генерации таблиц символов; их необходимо заполнять вручную.

Подробнее: документация Unity по шрифтам

TextMesh Pro Font Asset



В отличие от Unity, в TextMesh Pro есть единый формат для текстовых файлов и спрайтовых шрифтов, и его поведение для обоих типов шрифтов примерно одинаково.

Недостаток шрифтов TextMesh Pro заключается в том, что их можно использовать только с компонентами TextMesh Pro UI. Если вы считаете, что есть причина для использования TextMesh Pro, то лучше принять это решение на ранних этапах проекта и постоянно придерживаться его на протяжении всего проекта. Переделка готового проекта, написанного со стандартными компонентами UI Text, окажется мучительной задачей.

Источник: шрифтовые ресурсы TextMesh Pro создаются из материала (Material) и таблиц символов, почти как Custom Fonts Unity.

Таблицы символов указываются только в пиксельных координатах, а не в UV, поэтому они проще и точнее, чем произвольные шрифты Unity. Кроме того, существует инструмент Font Asset Creator, создающий шрифтовой ресурс TextMesh Pro из файла шрифта. Однако для спрайтовых шрифтов процесс всё равно довольно медленный.


Опции масштабирования: масштабировать шрифт TextMesh Pro можно в компоненте TextMesh Pro UI, меняя размер шрифта и без необходимости изменения масштаба game object. По этой причине, если мне нужно использовать спрайтовый шрифт, то я предпочитаю TextMesh Pro нативному Unity Text.

Применение: TextMesh Pro — только компоненты Text UI

Плюсы/минусы: более гибкий, чем шрифтовые ресурсы или спрайтовые шрифты Unity, но требует собственного компонента TextMesh Pro UI Text. Отсутствует инструмент для создания таблиц символов из листов спрайтов, их приходится делать вручную.

Подробнее: документация TextMesh Pro по шрифтам

TextMesh Pro Sprite Asset


Спрайтовые ресурсы TextMesh Pro немного не к месту в этом списке — на самом деле они не являются шрифтовыми ресурсами в том же смысле, что и остальные три типа. Скорее это дополнительная функция, предоставляемая пользователю компонентами TextMesh Pro – Text.

Спрайтовые ресурсы решают проблему смешения стандартного текста с внутриигровыми символами или значками (в качестве примера можно привести символы предметов, используемые внутри инвентаря Final Fantasy).


Применение: компоненты TextMesh Pro – Text UI. Для каждого компонента можно назначить один шрифтовой ресурс TMP и один спрайтовый ресурс TMP.

Для ссылки на значок спрайта в тексте используется тэг <sprite index=#> (где # — индекс спрайта начиная с 0).

Источник: TextMesh Pro Sprite Assets создаются из материала (Material) и таблиц символов. Концептуально они близки к шрифтовым ресурсам TextMesh Pro. Инструмент Sprite Importer немного лучше, чем Font Asset Creator, потому что он может использовать файлы FNT для генерации таблиц символов листов спрайтов. (См. примечания о файлах FNT в следующем разделе.)

Плюсы/минусы: отсутствуют, потому что этот способ на самом деле является побочным преимуществом использования TextMesh Pro. Если вы по какой-то причине хотите использовать этот функционал в проекте. то лучше всего как можно раньше начать применение TextMesh Pro.

Подробнее: документация TextMesh Pro по спрайтам

Генерация произвольных шрифтов и шрифтовых ресурсов TextMesh Pro из файлов FNT


Это может само по себе стать темой для отдельного поста, об этом точно стоит сказать, потому что благодаря этому создание произвольных шрифтов и шрифтовых ресурсов TextMesh Pro становится гораздо менее монотонным делом.

Основным недостатком создания спрайтовых шрифтов (с помощью средств Unity или шрифтовых ресурсов TextMesh Pro) является то, что отсутствует GUI-инструмент для определения символов из листа спрайтов. По сути, вам приходится вбивать вручную кучу цифр, тестировать шрифт, потом снова повторять, а это очень монотонный процесс.

Но есть и хорошие новости — существует более-менее стандартный текстовый формат для такой информации, который используется во многих GUI-инструментах для создания спрайтовых шрифтов. (Даже я сам написал упрощённую утилиту с частичной поддержкой спецификации FNT.)

Плохая новость заключается в том, что Custom Fonts Unity и шрифтовые ресурсы TextMesh Pro по умолчанию не поддерживают его.

Однако Unity поддерживает концепцию постпроцессоров ресурсов, которые могут считывать «сырые» файлы в проекте и преобразовывать их в ресурсы, используемые в коде. Постпроцессоры ресурсов выполняются при импорте и повторном импорте ресурсов.

Я написал очень простой конвертер FNT-to-TextMesh Pro Font Asset. Можете использовать его в качестве примера. Если вы сможете написать конвертер, который будет достаточно хорош для ваших целей, то он позволит перенести задачу создания спрайтового шрифта в более эффективный инструмент, что сэкономит время.

Подводим итог


Вот таблица с кратким сравнением:

Шрифтовой ресурс Компонент UI Источник Настройка Преимущества/недостатки
Font (стандарт в Unity) UI Text .ttf или .otf В основном автоматическая Простота использования, невозможность использования спрайтов или текстур
Custom Font UI Text Material, Texture и таблица символов Необходимо задавать каждый символ вручную, указывая UV-координаты. (Возможно скриптовое создание шрифтов из файлов FNT или других источников с помощью AssetPostprocessor.) Нет никаких способов изменения размера шрифта, кроме масштабирования GameObject. Нет встроенного GUI-инструмента для создания таблицы символов текстуры.
TextMesh Pro Font Asset TextMesh Pro — Text Material, Texture и таблица символов Необходимо задавать каждый символ вручную, указывая пиксельные координаты. (Возможно скриптовое создание шрифтов из файлов FNT или других источников с помощью AssetPostprocessor.) Нет встроенного GUI-инструмента для создания таблицы символов текстуры. Нельзя использовать со стандартными компонентами Unity UI Text.
TextMesh Pro Sprite Asset TextMesh Pro — Text Material, Texture и таблица символов Необходимо задавать каждый символ вручную, указывая пиксельные координаты или с помощью Sprite Importer. (Возможно скриптовое создание шрифтов из других источников с помощью AssetPostprocessor.) Используется совместно с TextMesh Pro Font Assets для добавления любых значков, не связанных с символом.
Tags:
Hubs:
If this publication inspired you and you want to support the author, do not hesitate to click on the button
+7
Comments 2
Comments Comments 2

Articles