【Unity】TextMesh Proで日本語表示 完全ガイド

UnityのTextMesh Proで日本語を扱う方法について詳しく解説します。

TextMesh Proのインポート

プロジェクトでTextMeshProオブジェクトを作成しようとすると、以下の「TMP Importer」ウインドウが表示されます。「Import TMP Essentials」をクリックしてTextMesh Proをインポートしましょう。

サンプルと追加アセットはインポートしなくていいでしょう。

インポートに成功すると「Assets/TextMesh Pro」フォルダに諸々のリソースが配置されます。

日本語フォントのダウンロードとインポート

初期状態ではTextMesh Proで使えるのはLiberation Sansという欧文フォントだけなので、日本語が文字化けしてしまいます。

フォントのダウンロード

使用する日本語フォントを用意します。ここではGoogle FontsのNoto Sans Japaneseを使います。

フォントのインポート

ダウンロードしたZIPファイルを展開してstaticフォルダを開きます。フォントのウェイト（太さ）別に9個のTFFファイルがあります。お好きなウェイトを選んでUnityにインポートします。ここではRegularを選びました。

インポート先フォルダは「Assets/Fonts」にしました。ドラッグ&ドロップでインポートします。

日本語の文字データの準備

日本語フォントで使用するすべての文字の一覧を用意する必要があります。

あらゆる文字を表示したいならば、ひらがな、カタカナ、漢字、記号、ASCII文字などを網羅する必要があります。約10,000文字を網羅したリストがこちらになります。ご査収ください。

japanese_10000.txt

ゲーム内で使用する文字が限定的ならば、このリストを使用する必要はありません。使用する文字だけのリストを用意してください。文字数が少なければ使用メモリを節約できます。

文字一覧ファイルはAssetsフォルダ下に配置する必要があります。「Assets/Fonts」などにインポートしましょう。

フォントアセットの作成

ここからが本番です。フォントアセットを作成します。フォントアセットとはTextMesh Proがテキストを描画するために使用するデータコンテナです。

Font Asset Creatorを開く

Unityのメニューバーから「Window > TextMeshPro > Font Asset Creator」を選択して「Font Asset Creator」ウインドウを開きます。

Font Asset Creatorの設定

以下の「Font Asset Creator」ウインドウが開くので、各項目に値を設定していきます。

設定項目の推奨値は以下のとおりです。

項目名	推奨値	説明
Source Font	使用するフォントファイル（ここではNotoSansJP-Regular）	使用するフォントのフォントファイルを選択します
Font Face	自動的に設定されるので変更不要	フォントの識別名
Sampling Point Size	30以上	Font Atlasに描き込む文字のサイズ
Padding	Sampling Point Sizeの10%以上	Font Atlasで各文字の周囲にどれくらいの余白をもたせるか
Packing Method	Fast	Font Atlas上に各文字のグリフ（文字の形）をどのように配置するか
Atlas Resolution	4096 * 4096	Font Atlasのサイズ
Character Set	Characters from File	Font Assetに含める文字の範囲
Character File	文字一覧ファイル（japanese_10000.txt）	Font Assetに含める文字一覧のファイル
Render Mode	SDFAA	Font Atlasに文字のグリフをどのような方法でレンダリングするか
Get Font Features	無効	フォントの合字、異体字、カーニングなどの情報をFont Assetに組み込むか

Source Font

フォントファイルを選択します。

拡張子が.ttfまたは.otfのファイルを使用することができます。拡張子が.ttcのファイルは複数のフォントを1つのファイルにまとめた形式で読み込めない場合があります。

•  .ttf(TrueType Font)
•  .otf(OpenType Font)
•  .ttc(TrueType Collection)

Font Face

フォントの名前です。

Source Fontで選択したフォントファイルから自動的に読み込まれて設定されます。

Sampling Point Size

Font Atlas（フォントテクスチャ）を作成する際に、文字をどれくらいのサイズで描き込むかの設定です。

値を大きくすると、文字のレンダリングが高精細になり拡大しても滑らかな文字を表示できます。ただし、大きくしすぎるとFont Atlasのテクスチャサイズが大きくなりメモリ使用量が増加します。

値を小さくすると、メモリ使用量を節約できますが、文字を拡大したときにギザギザが目立ちます。

設定値は以下のいずれかです。

• Auto Sizing: Atlas Resolutionに基づいて自動的に最適な値を計算します。
• Custom Size: 手動で値を設定します。単位はポイントです。

この記事ではCustom Sizeを選択して手動で値を設定してみます。Font Atlasのテクスチャサイズ(Atlas Resolution)を先に決めて、その範囲内で設定可能な最も大きいサイズを設定することになります。

一般的に、30ポイント以上の値であればほとんどのケースで違和感なく表示できるとされています。

Padding

Font Atlas（フォントテクスチャ）を作成する際に、各文字の周囲にどれくらいの余白を持たせるかの設定です。

Paddingを適切に設定しなかった場合、隣の文字のピクセルが滲み出し文字の輪郭がぼやけるブリーディングという現象が発生します。また、文字の装飾（アウトラインやシャドウなど）をする場合にも、Paddingがなければ装飾が途切れてしまいます。

Paddingの推奨値はSampling Point Sizeの10%以上（10〜20%）とされています。ゴリゴリに装飾したい場合は値を大きめにしましょう。

設定値の単位は「%」と「px」を選択できますが、「px」がおすすめです。というのも、「%」で指定した場合、割り切れなければ整数に丸められるので、それが想定した値と違ってしまう可能性があるからです。「px」で指定するのが確実です。

Packing Method

Font Atlas（フォントテクスチャ）上に各文字のグリフ（文字の形）をどのように配置するかを決定する設定です。

「Fast」または「Optimum」から選択します。推奨値は「Fast」です。

Fast

• 文字の配置を高速に行うアルゴリズム。
• Font Atlasの利用効率は低い。
• 処理時間が短い。

Optimum

• 最も効率的に文字を配置するアルゴリズム。
• Font Atlasの利用効率が高い。
• 処理時間が長い。

開発中はFastで確認し、本番ではOptimumを使うのがよいとされていますが、それは英語圏の話で、日本語フォントでは漢字、ひらがな、カタカナのサイズがほぼ同じなので、Optimumの恩恵を受けにくいんです。なので、Fastで充分です。

Atlas Resolution

Font Atlas（フォントテクスチャ）のサイズをピクセル単位で設定します。

文字数に応じて推奨値が変わります。

文字数	推奨値
128文字（ASCIIのみ）	512 * 512
約2500文字（ひらがな、カタカナ、常用漢字、記号、ASCII）	2048 * 2048
約5000文字（ひらがな、カタカナ、JIS第一・二水準漢字、記号、ASCII）	4096 * 2048
約10000文字（ひらがな、カタカナ、JIS第三・四水準の実用的な漢字、記号、ASCII）	4096 * 4096

最大の設定値は 8192 * 8192 ですが、一部のモバイルデバイスでサポートされないので、4096 * 4096 までに収めましょう。

Character Set

Font Assetに含める文字を指定します。

• ASCII: 標準的なASCII文字。英数字 (a-z, A-Z, 0-9)、一般的な記号 (!, ?, @, #など)。
• Extended ASCII: ASCIIに加え、ウムラウトやアクセント記号付きの文字などを含む。
• ASCII Lowercase: 小文字の英数字および基本的な記号。
• ASCII Uppercase: 大文字の英数字および基本的な記号。
• Numbers + Symbols: 数字と一般的な記号。
• Custom Range: 文字コードの範囲を10進数で指定。
• Unicode Range (Hex): 文字コードの範囲を16進数で指定。
• Custom Characters: 文字のリストをテキストボックスに直接入力して指定。
• Characters from File: 外部のテキストファイルから文字リストを指定。

今回はCharacters from Fileを選択し、あらかじめ用意しておいた、japanese_10000.txt を使います。

Render Mode

Font Atlas（フォントテクスチャ）に文字のグリフ（形）をどのような方法でレンダリングするかを決定する設定です。推奨値はSDFAAです。

SDF (Signed Distance Field)

SDFは文字の輪郭からの距離情報をテクスチャに保存し、GPUでリアルタイムに高品質な描画を行う技術です。文字の拡大・縮小に強く、アウトラインやシャドウなどの装飾が滑らかに適用できます。

モード名	特徴	用途
SDF / SDF8 / SDF16 / SDF32	距離情報マップの解像度を指定します。数字が大きいほど、距離情報が詳細になり、文字の描画品質が向上します。	最高品質を求める場合。
SDFAA	SDFにアンチエイリアス処理を適用したモード。高品質と生成速度のバランスが最も良く、標準的な設定として最も推奨されます。	標準的な設定。
SDFAA_HINTED	SDFAAにフォントのヒント情報を利用し、小さな文字での視認性を高めます。	小さな文字を使用する場合。

Raster

Rasterモードは、文字を通常のビットマップ画像としてテクスチャに直接描き込むため、SDFのような高度な処理は行いません。

モード名	特徴	用途
RASTER	生成は速いですが、拡大・縮小時にジャギー（ギザギザ）が目立ちます。	ピクセルフォントとして利用したい場合や、速度を最優先する場合。
RASTER_HINTED	RASTERにフォントのヒント情報を利用し、小さな文字での視認性を高めます。	小さな文字を使用する場合。

Smooth / Color

これらのモードは、アンチエイリアスを適用したグレースケールやカラーのビットマップ描画です。TextMeshProが本来の強みとするSDFのメリット（高品質な拡大縮小、エフェクト）を活かせないため、特殊な場合を除きSDFモードが推奨されます。

モード名	特徴	用途
SMOOTH	アンチエイリアスを適用したグレースケールのビットマップ描画。RASTERよりは滑らかですが、拡大・縮小には弱いです。	使いません。
SMOOTH_HINTED	SMOOTHにヒント情報を利用。	使いません。
COLOR	カラービットマップを描画します。主にカラー絵文字や、テクスチャが色情報を持つフォントを扱う際に使用されます。	カラー絵文字フォントをアセット化する場合。
COLOR_HINTED	COLORにヒント情報を利用。	小さな文字を使用する場合。

というわけで、日本語フォントでの推奨値はSDFAAで、消費メモリと生成時間を犠牲にしてでも最高品質を求める場合の推奨値はSDF32になります。

Get Font Features

フォントに含まれる合字、異体字、カーニングなどの情報をインポートするかどうかの設定です。そもそも日本語フォントは非対応の場合が多いので、無効でOKです。

設定の最適値を見つける

Font Atlasを作成する際の設定の最適値を見つける手順を解説します。

Sampling Point SizeをAuto、Paddingを%指定にすれば手っ取り早いのですが、Font Atlasの仕組みについて理解を深めるために、あえて手動で設定してみます。

以下の設定項目は推奨値が固定なので、以下のとおりに設定します。

設定項目	推奨値
Source Font / Font Face	使用するフォント
Packing Method	Fast
Character Set	Characters from File
Character File	japanese_10000.txt
Render Mode	SDFAA
Get Font Features	無効

残りの設定、Sampling Point Size, Padding, Atlas Resolutionを調整していきます。

最小の推奨値を試してみる (Sampling Point 30 / Padding 5)

最初にAtlas Resolutionを決定します。これは使用する文字数によって決まります。今回は約10000文字を使うので 4096 * 4096 に設定します。

次にSampling Point Sizeを決めます。Font Atlasに書き込む文字の大きさですね。推奨値は30ポイント以上です。とりあえず30に設定します。

Paddingを決めます。Paddingの推奨値はSampling Point Sizeの10〜20%です。ということは3〜6pxですね。今回はやや大きめの5pxにしてみました。

「Generate Font Atlas」ボタンをクリックするとFont Atlasが作成されます。

ウインドウの左下のステータスを見ましょう。Excluded charactersが0ならば問題なしです。

項目名	説明
Characters included	Font Assetに正常に収録され、Font Atlasにグリフデータが書き込まれた文字の総数。
Missing characters	Character Setで指定されたにもかかわらず、Source Font File内に存在しなかった文字の総数。
Excluded characters	Source Font Fileには存在するものの、設定された Atlas Resolutionに収まりきらなかったために、Font Assetから除外された文字の総数。

ウインドウの右側に表示されているのがFont Atlasです。4096 * 4096 の領域に約1万個の文字が敷き詰められています。右上に注目してください。余白がありますね（この場合、余黒？）。この余白をできるだけ小さくするのが我々に課されたミッションです。

大きめの値を試してみる (Sampling Point 34 / Padding 5)

余白を小さくするということは、Sampling Point Sizeを大きくするということです。Sampling Point Sizeを34にして、Font Atlasを生成してみました。

余白はなくなりました。しかし、Excluded charactersの値が568になっています。収まりきらない文字があるということです。

Sampling Point Sizeをもうちょっと小さくする必要がありそうです。

最適な値の発見 (Sampling Point 33 / Padding 5)

Sampling Point Sizeを33にして、Font Atlasを生成します。

Excluded charactersは0だし、余白も最小限になっています。というわけで、Sampling Point 33 / Padding 5が最適値でした。

フォントアセットの保存

設定の最適値が見つかったら、フォントアセットを保存します。

「Save as…」ボタンをクリックします。保存ダイアログが表示されるので「Assets/Fonts」などのお好きな場所にフォントアセットを保存します。

フォントアセットの適用

TextMesh Proオブジェクトにフォントアセットを適用します。

オブジェクトのインスペクターを開いて、TextMeshProコンポーネントの「Font Asset」に先ほど作成した「NotoSansJP-Regular SDF」をアサインします。

日本語が文字化けせずに表示されるようになりました。いえい。

デフォルトフォントアセットの設定

TextMesh Proオブジェクトを作成するたびにFont Assetを設定するのは面倒なので、初期値を設定してしまいましょう。

メニューバーの「Edit > Project Settings…」を選択します。

「Project Settings」ウインドウが開くので、サイドバーの「TextMesh Pro > Settings」を選択して、「Default Font Asset」を設定します。

以上で、TextMesh Proオブジェクトを作成するとFont Assetが自動的に設定されるようになります。

【おまけ】フォントアセット生成速度の比較

いろいろな条件でフォントアセットを生成したときに生成速度にどれくらいの差があるのか調べてみました。

説明	Sampling Point Size	Padding	Packing Method	Render Mode	生成速度
推奨値	33	5 px	Fast	SDFAA	32秒
文字の配置を効率的に	33	5 px	Optimum	SDFAA	2時間22分
Render Modeを最高品質に	33	5 px	Fast	SDF32	13分22秒
文字のサイズ設定を自動化	Auto Sizing	10 %	Fast	SDFAA	5分39秒

「Packing Method: Optimum」だけは絶対にやってはいけないことがわかりました。日本語フォントでこれやってもほとんど効果ありませんからね。

さいごに

TextMesh Proの設定は一度覚えてしまえば楽勝です。豆腐地獄とおさらばしましょう。

でわでわ