Menu

© 2025 ういやまラボ

BLOGTOOLSPRODUCTNOTES
    リストに戻る
    JAEN
    日本語English

    【Unity】Unityで差がつく！TextMeshProで実現する高品質なテキスト表示と最適化の秘訣

    作成: 2025-12-10

    TextMeshProの導入からリッチテキスト機能、パフォーマンス最適化まで解説。高品質なテキスト表示を実現しましょう。

    概要

    Unityでゲームやアプリケーションを開発する際、ユーザーインターフェース（UI）の品質は、プレイヤー体験に直結する非常に重要な要素です。しかし、Unityの標準機能であるTextコンポーネント（レガシーなGUITextや新しいuGUI.Text）を使っていると、以下のような問題に直面することが少なくありません。

    • テキストがぼやける、ギザギザになる: 特に高解像度環境や、テキストを拡大・縮小した際に、文字のエッジが不鮮明になりがちです。
    • パフォーマンスの低下: 複雑なUIや大量のテキストを表示する際、ドローコール（描画命令）が増加し、フレームレートが低下する原因となります。
    • 表現力の限界: 文字のグラデーション、アウトライン、影といったリッチな表現が難しく、凝ったUIデザインを実現できません。

    これらの問題を根本的に解決し、プロ品質のテキスト表示を実現するのが、Unityの公式パッケージであるTextMeshPro (TMP) です。本記事では、TextMeshProの基本概念から、高品質なテキスト表示を実現するための設定、そしてパフォーマンスを最大化するための最適化テクニックまでを、初心者から中級者の個人開発者向けに徹底的に解説します。

    TextMeshProの基本概念：SDFとは？

    TextMeshProが標準のテキストコンポーネントと決定的に異なるのは、テキストのレンダリングにSDF (Signed Distance Field) という技術を採用している点です。

    標準のテキストは、フォントをビットマップ画像としてテクスチャに焼き付けて使用します。この方式では、テキストを拡大するとピクセルが引き伸ばされ、エッジがぼやけたりギザギザになったりします。

    一方、SDFは、文字の輪郭からの距離情報をテクスチャに格納します。これにより、GPUがこの距離情報を使ってリアルタイムで文字の輪郭を滑らかに描画するため、どれだけ拡大・縮小しても、高解像度で鮮明なテキスト表示が可能になります。これが、TextMeshProの「高品質」の根幹です。

    TextMeshProの導入方法

    TextMeshProはUnityの標準パッケージです。Window -> Package Manager を開き、Unity Registry から Text Mesh Pro をインストールします。シーンに配置するには、GameObject -> UI -> TextMeshPro - Text を選択します。

    初心者が躓きやすいポイントと解決策

    1. フォントアセットの作成を忘れる

    TextMeshProは、通常のフォントファイル（.ttfや.otf）をそのまま使用できません。必ず専用のフォントアセット（Font Asset） を作成する必要があります。

    躓きポイント: シーンにTMPテキストを配置しても、フォントがデフォルトの「Liberation Sans SDF」のままで、日本語フォントなどを設定しても反映されない。

    解決策:

    1. 使用したいフォントファイル（例: NotoSansJP-Regular.otf）をプロジェクトにインポートします。
    2. インポートしたフォントファイルを右クリックし、Create -> TextMeshPro -> Font Asset を選択します。
    3. 生成されたフォントアセットを、TMPコンポーネントの Font Asset スロットにドラッグ＆ドロップします。

    2. 文字の抜け（アトラスのサイズ不足）

    日本語や中国語など、文字種が多い言語を使用する場合、作成したフォントアセットにすべての文字が含まれず、一部の文字が「□」や「?」と表示されてしまうことがあります。これは、フォントアセットのテクスチャ（アトラス）に、必要な文字がすべて焼き付けられていないためです。

    解決策: フォントアセット作成時に、Character Setの設定を見直します。

    • カスタム文字リストを使用する: 必要な文字だけをテキストファイルにリストアップし、Custom Characters に設定するのが最も効率的です。
    • ダイナミックアトラスを使用する: Atlas Population Mode を Dynamic に設定すると、実行時に必要な文字を自動でアトラスに追加してくれます。ただし、パフォーマンスへの影響やメモリ使用量の増加に注意が必要です。

    実践的なC#コード例：動的なテキスト操作とリッチテキスト

    TextMeshProは、標準のテキストコンポーネントと同様にC#スクリプトから簡単に操作できますが、参照するコンポーネントの型が異なります。

    1. 基本的なテキストの更新

    TMPコンポーネントを操作するには、using TMPro; を宣言し、TextMeshProUGUI（uGUI用）または TextMeshPro（3D用）を参照します。

    using UnityEngine;
using TMPro; // 必須

public class TmpTextUpdater : MonoBehaviour
{
    // インスペクターからTextMeshProUGUIコンポーネントをアタッチ
    [SerializeField]
    private TextMeshProUGUI scoreText;

    private int currentScore = 0;

    void Start()
    {
        // 初期テキストを設定
        UpdateScoreText();
    }

    // スコアを増加させ、テキストを更新するメソッド
    public void AddScore(int amount)
    {
        currentScore += amount;
        UpdateScoreText();
    }

    private void UpdateScoreText()
    {
        // テキストを直接更新
        scoreText.text = "現在のスコア: " + currentScore.ToString();
    }
}

    テキストの更新は、可能な限りUpdate()やLateUpdate()内ではなく、イベントドリブン（スコアが変更されたときなど）で行うようにしましょう。毎フレームのテキスト更新は、メッシュの再構築を発生させ、パフォーマンスを低下させる主要因となります。

    2. リッチテキストタグの活用

    TextMeshProの強力な機能の一つが、HTMLに似たリッチテキストタグです。これにより、スクリプトから動的に文字の色、サイズ、スタイルなどを変更できます。

    using UnityEngine;
using TMPro;

public class TmpRichTextExample : MonoBehaviour
{
    [SerializeField]
    private TextMeshProUGUI messageText;

    // 重要なメッセージをリッチテキストで表示する
    public void DisplayImportantMessage(string playerName, int damage)
    {
        // <color>、<b>、<size>などのタグを使用
        string richMessage = $"<color=#FF0000><b>{playerName}</b></color>に、<size=150%>{damage}</size>ダメージを与えました！";
        
        messageText.text = richMessage;
    }

    void Update()
    {
        // 実行時に色を動的に変更する例
        // <alpha>タグを使って透明度を点滅させる
        float alpha = Mathf.Abs(Mathf.Sin(Time.time * 3f)); // 0から1で点滅
        messageText.text = $"<alpha=#{Mathf.RoundToInt(alpha * 255):X2}>システムメッセージ：接続安定";
    }
}

    この例では、<color=#FF0000>で色を、<b>で太字を、<size=150%>でサイズを動的に変更しています。特に<alpha>タグを使った点滅表現は、標準テキストでは難しい高度な表現です。

    パフォーマンス最適化の秘訣

    TextMeshProは標準テキストより高性能ですが、不適切な使い方をするとパフォーマンスを損なう可能性があります。

    1. ドローコールの削減

    TextMeshProの最大の最適化ポイントは、同じフォントアセットとマテリアルを使用するテキストオブジェクトは、可能な限り一つのドローコールにまとめられるという点です。

    • フォントアセットの統一: UI全体で、同じフォントアセットを使用するように徹底しましょう。
    • マテリアルインスタンスの共有: テキストの色やアウトラインなどの設定を、マテリアルプリセットとして作成し、複数のテキストオブジェクトで共有することで、ドローコールを削減できます。

    2. テキストの再構築を避ける

    テキストの内容が変更されると、TextMeshProはテキストメッシュを再構築します。これは負荷の高い処理です。

    • 文字列の変更を最小限に: スコア表示など、頻繁に更新されるテキストは、文字列の生成（特にstring.Formatや文字列結合）を最適化し、必要なときだけ更新するようにします。
    • 非表示テキストの無効化: 画面外や非表示のテキストは、gameObject.SetActive(false)で無効化するのではなく、textComponent.enabled = false を使用してコンポーネントのみを無効化することで、Unityの描画パイプラインから除外され、パフォーマンスが向上します。

    まとめ

    TextMeshProを導入することで、UnityプロジェクトのUIテキスト品質とパフォーマンスは劇的に向上します。本記事で解説した重要なポイントを以下にまとめます。

    1. SDF技術の理解とフォントアセットの作成: TextMeshProの高品質な描画はSDF技術によるものであり、使用するフォントは必ず専用のフォントアセットとして作成・設定する必要があります。
    2. リッチテキストタグの活用: <color>, <size>, <b>などのタグをC#スクリプトから動的に使用することで、表現力豊かなUIを簡単に実現できます。
    3. ドローコール最適化の徹底: 複数のテキストオブジェクトで同じフォントアセットとマテリアルプリセットを共有し、描画負荷を最小限に抑えることが、大規模UIでのパフォーマンス維持に不可欠です。
    4. 動的更新の最適化: スコア表示など頻繁に更新されるテキストは、毎フレームの更新を避け、必要なタイミングでのみテキスト内容を変更することで、メッシュの再構築による負荷を軽減できます。

    これらの知識を活用し、あなたのUnityプロジェクトのUIを次のレベルへと引き上げてください。