こんにちは、Unityエンジニアのオオバです。

ここ最近のUIシステムは、uGUI一択です。
一昔前はNGUIを採用することもありましたが、
Unity社のがんばりでuGUIでのレベルも上がりました。

オオバはUI周りの仕事に携わることが多いです。

UIデザイナーからもらった画像データをUnityに組み込みます。
NGUIではできたことがuGUIではできない 現実的もあります。

uGUIでできること、できないことを理解して、
UIデザイナーとの対話 も
UIに関わるUnityエンジニアの大きな役目。

本記事ではUnityのUIにおける
テキスト事情の課題と解決 をまとめます。

TextMeshProを使おう

結論を簡単にまとめます。

• uGUIでは文字間の調整は不可
• TextMeshProに置き換えて解決
• TextMeshProはアウトライン表現も美しい

uGUIのデフォルトTextは、
TextMeshProによって淘汰されるでしょう。

圧倒的に機能が豊富です。
では詳細の解説に入ります。

→11万文字で徹底解説した「DOTweenの教科書」Unityアニメーションの超効率化ツールはこちら

デザインの再現はUIエンジニアの腕の見せどころ

デザインする上で文字の扱いは非常に重要な要素です。

• フォントの選択
• 文字の大きさ
• 文字色
• 文字同士間（(カーニング）
• 行間

などなど。

UIデザイナーのこだわりたい点はたくさん あります。
なぜならクオリティアップに必要だからです。

オオバも元々デザイナーでした。
文字には苦労した経験があります。

時間をかけて選びに選んだフォント。
デザイナーではない職種の人からは、
簡単そうに見えるかもしれませんが、
かなり骨の折れる作業 です。

そういうデザイナーの血の滲むような苦労がある分、
UIエンジニアとしてはできる限り要望に応えたい。

むしろ、ここが腕の見せどころではないでしょうか。

uGUIのテキストは文字間変更できない

uGUIのテキストでぶつかった壁は
文字間変更できない こと。

この事実をUIデザイナーに伝えると、
結構ショックを受けます。

それだけUIデザインにとって
文字間とは重要なのです。

uGUIデフォルト機能でテキストを表示させるためには、
uGUIのTextコンポーネント を使用します。

文字間設定が存在しない

よくよく見てみると、、、

カーニング（文字間）設定がないんです!!

ちなみに Line Spacingという
それっぽい設定項目がありますが、

こちらは 行間設定 です。

行間 Before	行間 After

このように行間の調整は可能。

一方NGUIではバッチリ可能

古参のUIアセットNGUIはどうか検証します。

バッチリ文字間の変更できますね。

NGUIの場合は UILabel コンポーネントを使います。
昔はほんとうによく使いました。

TextMeshProでもろもろ解決

現在までの歴史を解説しましたが、今の話をしましょう。
TextMeshProを使うともろもろ解決します。

新規で作り始めるプロジェクトであれば、TextMeshPro一択。
uGUIテキスト、NGUIも使わなくて良いかなと思っています。

文字間、行間ともに対応しています。
また TextMeshProの開発元がUnity になり
サポートが手厚くなりました。

TextMeshProの充実度

• uGUIのText
• NGUIのUILabel
• TextMeshPro

これらのインスペクタを
それぞれ比較してみましょう。

uGUIのText	NGUIのUILabel	TextMeshPro

圧倒的にTextMeshProの設定項目が多く、
機能が充実していますね。

まとめ : uGUIのテキストは捨てて、TextMeshProを使うがベストアンサー

記事の内容を簡単にまとめます。

• NGUIで可能だった文字間設定はuGUIで不可
• TextMeshProは文字間、行間それぞれカバー
• TextMeshProの登場でuGUIのテキストは不要

こんな感じです。

TextMeshProと比べると
uGUIのテキストを使うメリットはなく、
TextMeshProに慣れていくのがよいかと。

TextMeshProには
行間以外にも大きなメリット があります。
それがアウトライン表現です。

以前ツイートした内容ですが、 アウトライン文字の消え方を検証したものです。

若干わかりづらいかも知れませんが、
TextMeshProの方がきれいに消えます。

uGUIテキストはアウトラインが残ってしまうんですよね。

TextMeshProには
他にもたくさん機能があります。

結論としてはuGUIの課題は
技術の進歩で解決していっています。

TextMeshProを使いましょう。

「Unity初心者大学」というUnity初心者向けのYouTube始めました！！
ぜひチャンネル登録をお願いします！

最後まで読んでいただきありがとうございました！
すばらしいUnityライフをお過ごしください。

• Unity2020.3.19f1
• NGUI v3.8.2
• macOS Big Sur11.5.2