Как добавить поддержку эмоджи в Unity?

Компонент для работы с текстом в Unity — TMP, поддерживает отображение спрайтов с помощью специальных тегов. Это касается не только эмоджи, таким образом можно отобразить спрайт в тексте из любого атласа.

Но нас интересуют эмоджи (эмодзи). Много эмоджи. Помнить все юникоды всех символов — невозможно, добавить их в атлас и пронумеровать — можно, но неправильно. Поэтому будем использовать специальный хелпер, который по юникоду будет подставлять нужный спрайт в текстовый компонент.

Подготовка

Первое, нужен пак спрайтов с эмоджи. Мне очень нравится JoyPixels. Там есть все символы, постоянно обновляется и пополняется, качественная прорисовка. Для некоммерческого использования можно брать бесплатно.

Есть ещё OpenMoji — бесплатный пак со всеми символами, в том числе с разными начертаниями: контурные, цветные, чёрно-белые.

В общем, нужен пак со спрайтами, где каждое имя файла имеет соответствие с его юникод значением. Выглядит это как-то так:

Также понадобится программа — TexturePacker и расширение для Unity — TexturePacker Importer. С помощью этого набора подготовим все необходимые файлы для использования в редакторе Unity.

У программы много настроек: различные типы текстур, параметры оптимизации, варианты упаковки и прочее. В документации про всё это написано.

Дальше алгоритм такой:

1. Загружаем эмоджи в программу
2. Выставляем необходимые настройки: формат текстуры, размер атласа и т.п.
3. Экспортируем в формат Unity® - Texture2D sprite sheet – кнопка Publish sprite sheet.
4. После этого меняем формат на JSON (Array) и делаем экспорт еще раз.
5. Получили три файла: ХХХ.png, ХХХ.json и ХХХ.tpsheet.

Импорт в Unity

Теперь нужно из полученных файлов сделать TMP Sprite Asset — файл для TMP по которому он будет ориентироваться: какой файл показывать и с какими отступами.

Перетаскиваете полученные файлы в редактор и запускаете Window → TextMeshPro → Sprite Importer.

Выбираете в качестве источника данных ваш JSON файл и спрайт с эмоджи. Далее жмёте Create, Save по очереди и получаете TMP Sprite Asset.

Вот таких файлов может быть много. Вы разбиваете весь ваш пак с эмоджи на небольшие атласы 1024×1024 или 2048×2048, импортируете, создаёте спрайт ассеты для TMP.

Использование

Финальный этап. Как использовать полученные файлы и показывать эмоджи?

Если юникод эмоджи простой и не состоит из модификаторов (имя файла без дефиса), то всё будет работать даже если вы вставите эмоджи в инспекторе в поле ввода TMP. Эмоджи с модификаторами так использовать не получится, можете сами проверить. Поэтому придётся использовать скрипт который подставляет корректный спрайт.

Если вы не хотите каждый раз у текстового компонента TMP выставлять спрайт ассет, то можно в настройках указать какой файл брать по умолчанию. В проекте найти файл TMP Settings или отрыть через Project settings → TextMesh Pro → Settings и настроить блок Default Sprite Asset.

Тут указано, что в моём проекте есть папка Resources/Emojis в которой хранятся все сгенерированные выше спрайт ассеты и атласы, а также выбран какой ассет использовать по умолчанию.

К этому ассету в качестве «резервных» (fallback) подключены все остальные. Таким образом, если в «основном» ассете не будет нужного эмоджи, будет подгружен один из резервных и эмоджи отобразится в компоненте.

EmojiHelper

Для использования хелпера в коде, можно вызвать метод CheckAndParseEmoji у вашего TMP компонента или статический метод ParseEmojiSequence у хелпера:

/// Можно применять сразу к TMP компоненту
MyTMPText.CheckAndParseEmoji("string with emoji");

/// Или распарсить и использовать позднее в другом месте
var tmpString = EmojiHelper.ParseEmojiSequence("string with emoji");

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

Вроде всё. Теперь ваши приложения и игры на Unity могут быть более привлекательными 😊