ゲーム化!tomo_manaのブログ

ゲーム化!tomo-manaのブログ

Unityでゲームを作る方法について紹介しています

Unity学習#15 (Unity 2019.4.1f1) テキストの日本語化(TextMeshPro)

今回はテキストの日本語化に挑戦しました。今回もどはまりするかと思いきや、意外とすんなり日本語にできました。先駆者の方がいて下さることに感謝です!

参考にしたサイト

以下を参考にさせていただきました。ありがとうございます!
qiita.com

フォントのインポート

日本語に対応したフォントを、ProjectウィンドウのAssetにドラッグ&ドロップします。

Windows10 の場合、フォントは全てのユーザー向けには C:\Windows\Font にあります。複数ユーザーで1台を使用している場合は、ユーザーごとに C:\Users\(ユーザ名)\AppData\Local\Microsoft\Windows\Fonts に格納されています。

インポートすると、Project ウィンドウに以下のようなアイコンが表示されます。

f:id:tomo_mana:20200910203247p:plain
インポートされたフォントファイル

試しに「Meiryo UI」をインポートしてみたところ、5分ほどかかりました。これはPCの環境によって大きく違うと思いますが、それなりに時間がかかりました。(その後、HG丸ゴシックM-PRO 標準もインポートしてみましたが、今度は1秒と高速でした。初回のインポートだけ時間かかるのかもしれません)

アセットの作成

インポートしたフォントはそのままでは使えないので、TextMeshPro用のアセットに変換します。TextMeshProに付属の Font Asset Creator というツールを使用します。

Font Asset Creator の表示

(1) Unity画面のメニューから、Window > TextMeshPro > Font Asset Creator を選択
Font Asset Creator が表示されます。

f:id:tomo_mana:20200910202818p:plain
Font Asset Creator (初期表示)

最初は日本語を表示するテストができれば十分なので、「日」「本」「語」の3文字を試しに登録してみます。

日本語の登録

(2) Font Asset Creator に以下のパラメータを設定します。

パラメータ 設定値
font source MEIRYO(Meiryo UI使いたいので)
Sampling Point Size Custom Size, 48
font padding 5(デフォルト)
Packing Method Fast(デフォルト)
Atlas Resolution 512, 512(デフォルト)
Character Set Custom Characters
Select Font Asset None(デフォルト)
Custom Character List 日本語(日本語の3文字を表示させたかったので)
Font Style (表示されない)
Font Render Mode SDFAA_HINTED
Get Kerning Pairs チェックしない(デフォルト)

(3) Generate Font Atlas をクリック
少し待ち時間があり、登録した文字一覧の画像が作られます。

f:id:tomo_mana:20200910211636p:plain
Font Asset Creator (出力時)

(4) Save as ... をクリックして、Asset フォルダに保存します。

Asset フォルダに保存すると、以下のアイコンが追加されます。

f:id:tomo_mana:20200910203613p:plain
Font Asset アイコン

作られたアイコンを展開すると、Material と Atlas が作られています。左が Material で、右が Atlas です。Material は文字の質感を表現するためのパラメータ群、Atlas はアトラス画像といって複数の画像を1枚の画像にまとめたもので、その切り出し方をまとめた配列(ID - 座標)とセットで使うようです。Material は、後述する Render Mode の設定によって、表現できる質感に違いがあるようです。

TextMeshPro に関連付ける

先ほど作成されたアイコンを TextMeshPro に取り付けます。

(1) Hierarchyウィンドウから、TextMeshPro のゲームオブジェクトを選択
(2) Inspectorウィンドウから、TextMeshPro - Text (UI) > Main Settings > Font Asset を見つけます。
(3) Projectウィンドウにあるフォントアセットアイコンを、先ほどの Font Asset 欄にドラッグ&ドロップ

付けた瞬間に日本語に変わります。今回は「日」「本」「語」の3文字を画像にしたため、「日」「本」「語」の3文字が日本語で表示できるようになりました。

f:id:tomo_mana:20200910204443p:plain
適用前(日本語部分は四角になる)
f:id:tomo_mana:20200910204523p:plain
適用後(日本語も表示される)

補足

日本語化が意外とすんなりいったので、いろいろ興味が湧いてきて、少し調べました。

Liberation Sans SDF の格納場所

Unityの開発環境に最初から入っている LIberation Sans SDF は、以下にありました。

フォント:Assets > TextMeshPro > Fonts
フォントアセット:Assets > TextMeshPro > Resources > Fonts & Materials

f:id:tomo_mana:20200910231541p:plain
Liberation Sans SDF

Liberation Sans SDF と Liberation Sans SDF - Fallback の 2つがあります。アトラス画像を見ると、Fallback は表示できない文字に対してあてがう文字と思われます。(たとえば日本語を表示しようとすると四角になるとか)

Render Mode による違い

Render Mode の違いによって、選択できるパラメータに違いがあります。
先ほどの日本語を表示する時に、Render Mode に SMOOTH_HINTED を選択したのですが、そうすると作られたフォントアセットでは (Liberation Sans SDF では選択できたはずの) Outline やUnderlay が使えないので、少し焦りました。以下にモード毎の Atlas と Material を示します。

Render Mode Atlas Material
SMOOTH_HINTED f:id:tomo_mana:20200910214116p:plain f:id:tomo_mana:20200910214220p:plain
RASTER_HINTED f:id:tomo_mana:20200910214134p:plain f:id:tomo_mana:20200910214234p:plain
SDF16 f:id:tomo_mana:20200910214148p:plain f:id:tomo_mana:20200910214251p:plain
SDFAA_HINTED f:id:tomo_mana:20200910214205p:plain f:id:tomo_mana:20200910214304p:plain
  • SMOOTH_HINTED は最低限の機能で、Outline や Underlay が使えないようです。
  • RASTER_HINTED は日本語の3文字がすでに表示されません。
  • SDF16 は以前まで標準で使われていたようです。
  • SDFAA_HINTED は TextMeshPro Ver1.40以降、標準になったようです。

HINTED は 文字間の高さが揃っているように見えたり、文字の隙間がくっきり見えるようにして、可読性を高める画像化の手法(ヒンティング)のようです(Wikipedia

Material の設定はそれぞれ以下のようです。

  • Face:文字の色、文字表面の質感
  • Outline:文字の囲み
  • Underlay:文字の影
  • Lighting:文字に当てる光
  • Glow:文字のバックライト

常用漢字レベルまでの日本語に対応する (Character指定 と Range指定)

常用漢字レベルまでの日本語を表示させるために、リストを作って下さっている方がいます。Character 指定と、Range指定それぞれで試してみました。どこまで含めるかで文字数がかなり違います。

(参考)
ASCII:95字
全角英数:62字
全角かな:169字
記号:442字
半角英数字記号と全角英数字かなカナ記号の一覧まとめ - Qiita

常用漢字:2136字(2010年改訂版)
常用漢字はJIS第一水準だけでなく、第二水準、第三水準も若干含まれているそうです。
常用漢字とJIS漢字水準の微妙な関係 - Qiita

JIS第一水準:2965字
JIS第二水準:3390字
日本語の文字一覧 - Qiita

文字指定 (Custom Character)


⇒こちらはJIS第一・第二水準までの漢字です。
サイズ:4096 x 8192 で 7124/7149文字(喪失25文字)。Fastでも時間かかります。

f:id:tomo_mana:20200910230142p:plain
Custom Character (JIS第二水準までの漢字)
文字コード範囲指定 (Custom Range)


⇒こちらは常用漢字です。
サイズ:2048x4096 で 2461/2591文字(喪失34文字)。Fastでは短時間でできます。

f:id:tomo_mana:20200910230226p:plain
Custom Range (常用漢字)

その他参考

TextMeshPro の全パラメータ
qiita.com

次回やること

リストの作成(第14回)で少し疲れたので、少しこまめに分けます。

  • リストの要素を上下キーで選択
  • ENTERキーで次のリストを表示する処理(第13回との連結)はその次にやります。