Список пользовательских шрифтов
Структура описания шрифта
В Univer шрифты определяются с помощью интерфейса IFontConfig:
| Свойство | Тип | Описание |
|---|---|---|
value | string | Уникальный идентификатор шрифта, обычно также предпочтительное значение CSS-свойства font-family. |
label | string | Ключ перевода для интернационализации. Если при создании экземпляра Univer этот ключ не задан, значение отображается без изменений. |
category | FontCategory | Категория шрифта, используемая для группировки в интерфейсе (необязательно). |
Univer не запрещает пользователям выбирать неустановленные шрифты. Если шрифт не установлен на устройстве, браузер заменит его шрифтом по умолчанию.
Использование пользовательских шрифтов
Пункты раскрывающегося списка шрифтов можно задать с помощью параметра customFontFamily плагина UniverUIPlugin.
TypeScript
import { FontCategory, UniverUIPlugin } from '@univerjs/ui'univer.registerPlugin(UniverUIPlugin, { container: 'app', customFontFamily: { list: [ { value: 'PingFang SC', label: '苹方（简）', category: FontCategory.SANS_SERIF, }, { value: 'Helvetica Neue', label: 'Helvetica Neue', category: FontCategory.SANS_SERIF, }, ], // Whether to override the default font list, defaults to false override: true, },})Facade API
Помимо настройки при инициализации, новые шрифты можно динамически регистрировать во время выполнения через Facade API. Это особенно удобно, когда файлы шрифтов необходимо загружать асинхронно.
TypeScript
import { FontCategory } from '@univerjs/ui'univerAPI.addFonts([{ value: 'PingFang SC', label: 'PingFang SC', category: FontCategory.SANS_SERIF,}, { value: 'Helvetica Neue', label: 'Helvetica Neue', category: FontCategory.SANS_SERIF,}])Насколько полезно это руководство?