今回は Unity の TextMesh Pro を使ってフォントの作成にチャレンジします。
■Unityプロジェクト
簡単にフォント作成手順を書くと・・・
- Unity のプロジェクトを作成する。
- TextMesh Proをインポートする(
これは一度やればOK)。 - TrueTypeフォントをインポートする。
- 登録する文字の一覧をテキストファイルで用意しインポートする。
- Font Asset Creator で TextMesh Pro 用のフォントアセットを作成する。
- 作成したフォントアセットを保存する。
- 作成したフォントでテキストを表示するゲーム?を作成する。
これだけで作成できるようです。
では、この手順に沿って作ってみます。
1.プロジェクトの作成
Unity でフォントを作成するためのプロジェクトを作成します。今回はプロジェクト名を「PoE2JpFont」としてみました。
2.TextMesh Pro のインストール
・Unityのメニューの[Window]-[Asset Store]でアセットストアを開く。
・検索窓から TextMesh Pro を探して開く。
・価格が「FREE」であることを確認し、IMPORT ボタンをクリックする。
・Import Unity Package 画面が表示されるので、そのまま右下の Import ボタンをクリック。
しばらくするとインポートは終了します。
Unityのメニューで[Window]-[TextMesh Pro] の項目が追加されていればOKです。
3.フォント作成
3-1.作成方針
- 【暫定】日本語フォントは、制限の緩い M+ FONTS を使用する。
- フォントの種類はRegularのみとする。
- テクスチャサイズは、韓国語に習い 4096x4096 で一面とする。
- 【暫定】使用文字種は M+ FONTS でサポートされている8,571文字とする。
- ゲーム内の charset は韓国語(Hangul)のを使用する。(フォント作成とは直接関係なし。覚書)
3-2.フォントのインポート
今回は M+ FONTS の mplus-2p-regular.ttf を使用することにしました。
Unityのメニューの[Assets]-[Import New Assets...]で mplus-2p-regular.ttf を開きます。
インポートが終了すると Assets に mplus-2p-regular が現れます。
3-3.フォントアセットの作成
フォントアセットはインポートした TrueTypeフォントから Font Asset Creator を使用して作成するのですが、フォントアセットに含める文字を指定する必要があります。今回はどの文字がアセットに入っているのかを明確にしたいため、文字の一覧を記載したテキストファイルからフォントアセットを作成することにします。
予め文字の一覧のサンプルを作っておいたものを使用します。以下のURLからサンプルをダウンロードできます。
「PoE2JoFont_mp2pr.txt」
https://gist.github.com/synctam/5c79356cc60a7ee0ba99feb0f0f5f2a0#file-poe2jofont_mp2pr-txt
このファイルを先ほどフォントをインポートした時の手順と同じ様にアセットにインポートします。
フォント「mplus-2p-regular」 文字一覧「PoE2JoFont_mp2pr」 |
これで材料が揃いました。
Unity のメニューの[Window]-[TextMesh Pro]-[Font Asset Creator]で Font Asset Creator 画面を開きます。
設定内容
- Font Source:インポートしたTrueTypeフォント
- Font Size:32point
- Font Padding:5 (default)
- Packing Method:Fast (default)
- Atlas Resolution:4096x4096
- Character File:インポートした文字の一覧
- Font Style:Normal 2 (default)
- Font Render Mode:Distance Fields 16 (default)
- Get Kerning Pairs?:チェックなし (default)
この設定で Generate Font Atlas ボタンをクリックします。
マシンのスペックや登録文字数によりますが、私の環境では25分位かかりました。
完了すると以下のような画面になります。
フォントの作成が完了した時の画面 |
赤枠部分にエラーが表示されていないことを確認します。
フォントアセットの作成に失敗すると、赤枠部分には生成できなかった文字の一覧が表示されます。今回はうまく行ったようです。
Save TextMeshPro Font Asset ボタンをクリックし、完成したフォントアセットを保存します。ファイル名を聞いてきますので指定します。今回はデフォルトのファイル名 mplus-2p-regular SDF.asset で保存しました。
フォントアセット保存後のAssetsの内容 |
実はフォント作成は一度失敗していまして、最初 Font Size を 48 で作成しようとしたのですが 4096x4096 に収まらなかったらしく、はみ出した文字が赤枠部分に沢山表示されました。
4.ゲームの作成
作成したフォントアセットでテキストを表示するゲームを作ります。と言っても、起動するとテキストが表示されるだけのゲームです。
Unityのメニューの[GameObject]-[3D Object]-[TextMesh Pro - Text]で TextMesh Pro のテキストを追加します。
Text Input Box に文字を入れ、位置を調整し、FaceやOutlineなどをいじると、文字が格好良くなります。
最後に、ビルド設定を行います。
Unityのメニューの[File]-[Build Settings...]で Build Settings 画面を開きます。
Platform で PC, Mac & Linux Standalone を選択し、Build ボタンをクリックします。
Exe名を聞かれますので答えます。今回は PoE2JpFont としました。
出来上がったゲームを起動してみます。
起動すると、解像度を聞いてきますので 800x600 を選びました。
もうちょっと、どうにかならんかったのか? |
■作ったゲームの解析
ゲームを作るのが目的じゃないので、次に進みます。
今作ったゲームのアセットを解析します。PoE2JpFont_Dataフォルダーの resources.assets を AssetStudio で開いて、PoE2の韓国語版フォントテクスチャと比較してみます。
PoE2の韓国語のフォントテクスチャ |
自分で作成した日本語のフォントテクスチャ |
両方共、右上に表示されているサイズなどの値は同じです。ひょっとしたら、フォントの作り方はこれが正解なのかもしれません。しかし、確証が持てないのも事実。なにか裏を取る方法はないだろうか? また、フォントの座標情報についてはまだ謎のままです。
今日のところは一旦ここで終わります。次回は座標情報探しの旅に出ようと思います。
謎は深まるばかりだ! 出口は見つかるのか?・・・その2
では・・・
参考資料
「M+ FONTS | JAPANESE」
https://mplus-fonts.osdn.jp/about.html
https://techacademy.jp/magazine/2222
https://qiita.com/hinagawa/items/b606c6a2fd56d559a375
「UnityのText Mesh Proでほぼ全ての日本語を表示させる - Qiita」
https://qiita.com/kgsi/items/08a1c78b3bee71136156
https://qiita.com/thorikawa/items/03b65b75fa9461b53efd
http://inter-high-blog.unity3d.jp/2017/08/18/textmeshpro/
座標情報はBMFontのFont descriptorでBinary出力したフォーマットそのままだったと思いますがバージョンが古いので変わってるかもです
返信削除BMFontでBinary出力はやったことがなかったです。これをヒントに探してみます。
削除ありがとうございました。
座標はフォントのテクスチャ名(Atlasは外す)でバイナリ検索したら場所がでてきませんか?
返信削除某ゲームはMonoBehaviour(UnityEXでTypeが-表示されるもの)に座標情報が含まれていました。
なるほど、MonoBehaviourですか。これは今まで調べたことがありませんでした。情報ありがとうございます。
削除