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

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

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

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

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

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

TextMeshProを使おう

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

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

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

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

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

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

などなど。

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

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

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

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

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

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

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

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

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

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

Textコンポーネントの全ての項目

【Unity】UIテキストの文字間(カーニング)事情まとめ_0

文字間設定が存在しない

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

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

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

【Unity】UIテキストの文字間(カーニング)事情まとめ_1

こちらは 行間設定 です。

行間 Before行間 After
【Unity】UIテキストの文字間(カーニング)事情まとめ_2
【Unity】UIテキストの文字間(カーニング)事情まとめ_2

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

一方NGUIではバッチリ可能

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

【Unity】UIテキストの文字間(カーニング)事情まとめ_3

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

オオバ
オオバ
さすが歴戦のアセットです

【Unity】UIテキストの文字間(カーニング)事情まとめ_4

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

TextMeshProでもろもろ解決

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

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

文字間の変更

【Unity】UIテキストの文字間(カーニング)事情まとめ_5

行間の変更

【Unity】UIテキストの文字間(カーニング)事情まとめ_6

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

TextMeshProの充実度

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

uGUIのTextNGUIのUILabelTextMeshPro
【Unity】UIテキストの文字間(カーニング)事情まとめ_7
【Unity】UIテキストの文字間(カーニング)事情まとめ_7
【Unity】UIテキストの文字間(カーニング)事情まとめ_7

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

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

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

こんな感じです。

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

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

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

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

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

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

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

TextMeshProを使いましょう。

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

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

オススメ記事
検証環境