こんにちわ、オオバです。

TextMeshPro(テキストメッシュプロ)の始め方を解説します。

UnityのUI上にテキストを表示させる場合、
TextMeshPro一択 です。

Unityが提供するUIシステム(uGUI)にも
Textと呼ばれる機能がありますが、
UIデザイナーの皆さんの要望には答えられない です。

具体的には次の2点。

大きくこの2つを解決することができるTextMeshPro。

という方に向けてわかりやすく解説していきます。

この記事の内容

TextMeshProのインストールは不要

TextMeshProを使うために特別準備は不要です。

本記事はUnity2020.3.19f1を使用しています。
現バージョンで TextMeshProはUnityに
最初からインストールされています。

もしインストールされていない場合は
パッケージを確認ししましょう。

【初心者向け】TextMeshProの始め方_0

Window > PackageManager

【初心者向け】TextMeshProの始め方_1

これでインストールされます。

実際にTextMeshProを使っていきましょう。

ヒエラルキーにTextMeshProを追加

【初心者向け】TextMeshProの始め方_2

ヒエラルキーを右クリック > UI > Text - TextMeshProをクリック。

【初心者向け】TextMeshProの始め方_3

すると TMP Importer というウィンドウが表示されます。
Import TMP Essentials をクリックして
ウィンドウを閉じます。

ちなみに Import TMP Essentials とは
TextMeshProのデフォルト設定ファイルのインストールです。

今後開発していく上でカスタムするファイル群となります。
本記事は初心者向けのため割愛。

【初心者向け】TextMeshProの始め方_4

このように Text(TMP) が追加されました。

ちなみにTMPとは TextMeshPro の略。
デフォルトのTextと区別するために記述されていると思われます。

ではTextMeshProでテキストを描画していきましょう。

これだけは覚えておこうTextMeshProの6つの機能

TextMeshProの機能はメッチャあります(笑)。
一度に覚える量としては多すぎるため、
まずは基本となる6つの機能を紹介します。

【初心者向け】TextMeshProの始め方_5

とりえあえずテキストを使う上で代表的なもの6つ。
まずはこれだけ覚えましょう。

従来のTextでは、できなかった文字間指定を
取り上げて解説します。

文字間指定はSpacing Options

【初心者向け】TextMeshProの始め方_6

文字間は Spacing Options
Character で指定します。

Spacing Options Character : 0

【初心者向け】TextMeshProの始め方_7

Spacing Options Character : 60

【初心者向け】TextMeshProの始め方_8

待望の文字間を指定できるようになりました。

【初心者向け】TextMeshProの始め方_9

プログラミングすればアニメーションも可能です。

まとめ : 【初心者向け】TextMeshProの始め方

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

こんな感じです。

最初からUnityにインストールされているため、
TextMeshProを始めること自体は超簡単 でしたね。

本記事では従来のTextと大した進化の差を
感じなかったかも知れません。

あえて言うなら行間指定ができるようになったくらい。
(これだけでもすごいのですが)

TextMeshProをあなどらないで下さい。

本記事はあくまで導入編です。

などなど。

これらについては 別記事 で詳しく、
わかりやすく 解説していきます。

TextMeshProは今後のUnityのUIを支えていく重要な機能 の1つです。
今マスターしておいて損はないです。

ぜひともUIデザイナー自身がUnity上でさわってみて理解し、
ワンステップ上のUIデザイナー を目指してみてはいかがでしょうか。


フォローすると UIデザイナー力の上がるTwitter やってます!
今日から使えるテクニックを発信中。
ぜひフォローしてみてください!
👉フォローはこちら!

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

オススメ記事
検証環境