カスタムフォントリスト

PDF テキストとエディターのフォントメニューは、関連はあるものの異なるデータソースを使います。

データソース	制御する内容
`document.assets.fonts` とテキストランの `fontId`	ネイティブ内容の再現に使う、インポート済み PDF フォントのメタデータとリソース。
編集可能なテキストランの `fontFamily`	編集可能テキストのレイアウトと描画に使う CSS フォントファミリー。
Univer の共有フォントリスト	PDF インスペクターのフォントドロップダウンに表示する選択肢。

共有リストに選択肢を追加しても、document.assets.fonts にアセットは追加されず、フォントファイルのダウンロードや埋め込みも行われません。

エディターのフォントリストを設定する

editor.enabled が true の場合、PDF インスペクターは共有の FontFamilyDropdown を使います。ブラウザー設定の UniverUIPlugin でリストを指定します。

TypeScript

import { UniverUIPlugin } from '@univerjs/ui'univer.registerPlugin(UniverUIPlugin, {  container: 'app',  customFontFamily: {    list: [      {        value: 'Inter',        label: 'Inter',        category: 'sans-serif',      },      {        value: 'Noto Serif',        label: 'Noto Serif',        category: 'serif',      },    ],    override: false,  },})

ブラウザーフォントは @font-face やスタイルシートで別途読み込んでください。読み込まれていない場合、Canvas はブラウザーの代替フォントを使います。

実行時に選択肢を追加する

UI Facade の読み込み後は、addFonts で同じ共有リストに選択肢を追加できます。

TypeScript

univerAPI.addFonts([  {    value: 'Inter',    label: 'Inter',    category: 'sans-serif',  },])

このメソッドが更新するのはアプリケーションのフォントリストだけです。フォントバイトの読み込みや既存 PDF ランの書き換えは行いません。

編集可能な PDF テキストにフォントを設定する

テキスト挿入時に fontFamily を渡すか、PDF Facade で編集可能なテキストボックスを更新します。

TypeScript

const page = univerAPI.getActivePdf()?.getPageByIndex(0)const textBox = page?.insertTextBox({  text: 'Hello PDF',  fontFamily: 'Inter',  fontSize: 14,  left: 36,  top: 36,})textBox?.setTextStyle({ fontFamily: 'Noto Serif' })

page.getTextSpans() が返すインポート済みネイティブテキストはスナップショットであり、その場ではスタイルを変更できません。replaceText(...) で編集可能なテキストボックスへ昇格してから setTextStyle を呼び出してください。

このガイドはいかがですか？