【Unity】ワンランク上のUI TextMeshPro完全攻略!

Unity Unity

TextMeshPro完全攻略!ワンランク上のUI

文字には色々な役割があります。ゲームの雰囲気を決めたり、レイアウトで見栄えを変えたり、一文字で意味を伝えたりすることができます。しかし、Unityの標準装備であるuGUIでは、文字の魅力を100%引き出すことができていません。今回はTextMeshProを用いて文字の魅力を引き出すことでゲーム制作に役立てていきます。

TextMeshProの魅力5選

拡大しても文字がにじまない

uGUIでは画面の解像度からフォントを決めているので、文字を拡大すると解像度が足りず文字がにじむことがある。しかし、TextMeshProを使うことで、拡大してもにじまない文字を作成することができる。

Compare1

様々なレイアウト調整機能がある

uGUIでは文字を表示したい範囲に等間隔に文字を並べるなどのことができません。しかし、TextMeshProを使うことでカーニングをつけることができます。

文字にエフェクトを容易につけることができる

uGUIでは文字に複雑なエフェクトをつけることができません。しかし、TextMeshProを使うことで複雑なエフェクトをつけることができます。また、エフェクトの設定・変更が即座に反映されることも魅力です。

Compare3

Compare4

文字に演出を加えることができる

TextMesh Proにはエッジや光沢を加えることができます。Game Scene内のLightから影響を受けて影をつけたりオプションもあります。

Compare6

タグによるリッチテキストの制御ができる

uGUIでは太文字やインタリックなどしかできません。しかし、TextMeshProを使うことで、マージン、ハイライト、アイコン表示などをすることができます。

Compare7

TextMeshProの使い方(日本語対応)

 TextMeshProを追加

SceneにTextを追加していきましょう。

Hierarchy→3D Object→Text – TextMeshPro

AddTextMeshPro

TextMeshProを追加すると初めて使う場合は、以下のような画面が表示されます。

Import TMP Essentialsをクリックしてください。

TextMeshProInpoter

これで追加は完了です。

日本語対応

現在画面にはSample Textと書かれていますが、日本語の文字を入力してみてください。下記のように日本語を表示することができないはずです。

TextMeshPro-Japanese

そもそもTextMeshProには、日本語フォントが含まれていないので追加する必要があります。

それでは日本語のフォントを用意しましょう。

今回はGoogle Fontsからフォントを持ってきました。

Fontsフォルダを作成しダウンロードしたフォントを追加しておいてください。

ダウンロードしたフォントをTextMeshProに対応させるために確認用ファイルと完全版のファイルをダウンロードする。

確認用ファイル

完全版ファイル

Font

以上で下準備が完了です。

Window→TextMeshPro→Font Asset Creator

FontAssetCreator

Source Font Fileにダウンロードしたフォントを追加

Add-Font

Character SetをASCIIからCharacters From Filesに変更し、Character FileにTextMesh Pro 作成確認用サンプルファイルを追加してダウンロードした日本語のフォントをTextMeshProに対応させる。

CharactersFormFile

Generate Font Atlasをクリックして、Saveをクリックします。

*完全版のファイルを使うと変換までに時間がかかるので、まずは確認用ファイルで実行しましょう。

 

Font Assetを先ほど変換したフォントに変更しましょう。

これで日本語表示ができるようになったはずです。

*確認用ファイルでは漢字のひょうじはできません

FontAsset

 

できたら今度は完全版ファイルで同じことを繰り返して終了です。

*完全版ファイルはGenerate Font Atlasに時間がかかるので注意してください。

Japanese-Full

これで漢字の表示もできるようになりました。

 

まとめ

TextMeshPro uGUI
・ズーム時にエッジがきれい

・複数のフォントサイズ時に有利

・フォントテクスチャの再構築がない

・事前に使用する文字を登録する必要がある

・禁則処理、アイコン表示ができる

・解像度が一致していればきれい

・ダイナミックフォント対応

・フォント更新時(追加時ではない)にスパイクが起こる

 

コメント

タイトルとURLをコピーしました