【Unity】TextMeshProでテキストを手動で改行する方法

TextMeshProで改行する方法 Unity

こんにちは、ともくんのゲーム作り部屋にようこそ!

このページでは、

「TextMeshProでテキストの改行をしたい!」

「TextMeshProの改行の設定を知りたい!」

というお悩みの方に向けた内容となっています。

Unityで使えるTextMeshProでテキスト内に改行を入れる場合、エディター上であればそのまま改行を入れてあげるだけで問題ありません。

しかし、スクリプトからテキストを指定して改行する場合は、改行位置に\n「<br>」をテキスト内に入れてあげる必要があります。

また、TextMeshProの設定次第で、改行時の処理などが変わってきます。

そこで、このページでは、UnityのTextMeshProコンポーネントでテキスト内に改行を入れる方法と、改行の設定項目についてまとめていきます。

なお、

Windows11
Unity Hub3.11.0
Unity6

のバージョンで解説しています。

この記事を書いた人

ゲーム作りを学び始めた一児のパパです。
このブログは、子供から「ゲームを作ってみたい!」と言われ、非プログラマーでゲーム作りをしたことない僕が、ゲーム作りの本を読んで独学でゲーム開発を学んでいるブログです。
同じように初めてゲーム作りをしている方と一緒に学んでいけるようなブログに出来たらいいなと思っています。
また、「このコードはおかしい」とか「もっと良い書き方があるよ!」などあれば、どんどん指摘して頂けると助かります。

TextMeshProでテキストを手動で改行させる方法

まずは、TextMeshProを使って、テキストを手動で改行させる方法を紹介していきます。

ここでは、以下のUI要素のTextMeshProを配置して説明していきます。

なお、TextMeshProについて、以下のページでも詳しく解説していますので、あまり知らない方は参考にしてみてください。

エディターからテキストを指定する場合

Unityのエディター上からテキストを指定して改行させる場合は、入力したテキスト内に改行を入れておくだけで、表示されるテキストも改行されるようになります。

例えば、以下のようにテキスト内に改行を入れておきます。

すると、ゲーム内に表示されるテキストも改行されるようになっているのが分かります。

ちなみに、この後紹介する\n」「<br>」をエディター上のテキストに入れた場合も、改行させることができます。

スクリプトからテキストを指定する場合

スクリプトからテキストを指定する場合は、そのままテキスト内に改行を入れても認識してくれません。

スクリプトからテキストに改行を入れる場合は、

  • \nを指定して入力
  • <br>タグを指定して入力

の2つの方法があります。

\nを指定して入力

スクリプト内のテキストの中で「\n」を入れてあげることで、その部分に改行が入るようになります。

この「\」バックスラッシュという記号になりますが、半角英数モードでキーボードの「¥」もしくは「ろ」のキーを押すと打てます。

また、環境によっては「\n」ではなく「\n(半角)」と表示されますが、同じ改行として認識されます。

例えば、以下のようなスクリプトを作り、TextMeshProに紐づけておきます。

using TMPro;    // TextMeshProを使うために記述
using UnityEngine;

public class Test : MonoBehaviour
{
    TextMeshProUGUI tmp;

    void Start()
    {
        tmp = GetComponent<TextMeshProUGUI>();  // TextMeshProを取得する処理
        tmp.text = "こんにちは。\n今日は\n寒いですね。";
    }
}

11行目で、テキストとテキストの間に「\n」を入れて指定しています。

これでゲームを実行してみると、

上記のように改行されているのが分かります。

ちなみに、「\n」エスケープシーケンスと呼ばれるもので、「Parse Escape Characters」という項目で使用するかどうかを決めることができます。

<br>タグを指定して入力

「\n」と同様に、テキストの中で「<br>」というタグを入れてあげることでも、改行を行うことができます。

例えば、以下のようなスクリプトをTextMeshProに紐づけてあげます。

using TMPro;    // TextMeshProを使うために記述
using UnityEngine;

public class Test : MonoBehaviour
{
    TextMeshProUGUI tmp;

    void Start()
    {
        tmp = GetComponent<TextMeshProUGUI>();  // TextMeshProを取得する処理
        tmp.text = "こんにちは。<br>今日は<br>寒い<br>ですね。";
    }
}

11行目で、テキストとテキストの間に「<br>」を入れて、改行を指定しています。

これでゲームを実行してみると、

テキスト内に改行が入っているのが分かります。

ちなみに、この「<br>」リッチテキストタグと呼ばれているもので、「Rich Text」の項目で使用するかどうかを決めています。

TextMeshProのテキストの改行に関する設定

ここからは、TextMeshProでの改行における設定について紹介していきます。

Rich Text:<br>などのリッチテキストタグを使うかどうか

Rich Textは、そのTextMeshProにおいてリッチテキストタグを使うかどうかを決めている項目です。

リッチテキストタグは、マークアップタグと呼ばれるもので、以下のように文字やテキストに対して太字斜体改行を指定するタグです。

<color=red>こん</color>にちは。
太字<b>こん</b>にちは。
斜体<i>こん</i>にちは。
改行こん<br>にちは。

このRich Textの項目のチェックを外していると、タグを記述しても認識せずに、そのままテキストとして表示されるようになります。

Parse Escape Characters:\nなどのエスケープシーケンスを使うかどうか

Parse Escape Charactersは、そのTextMeshProにおいてエスケープシーケンスを使うかどうかを決めている項目です。

エスケープシーケンスは、直接テキストとして入力できない改行タブなどを表現するための文字のことで、「\(バックスラッシュ)」を付けて以下のように表示します。

改行こん\nにちは。
タブこん\tにちは。
行復帰こん\rにちは。

このParse Escape Charactersの項目のチェックを外していると、エスケープシーケンスで記述しても認識されなくなり、そのままテキストで表示されるようになります。

Text Wrapping Mode:自動改行と改行時の空白の処理を設定

TextMeshProでは、手動で改行させる以外にも、以下のようにテキスト幅に応じて自動で改行させることができます。

Text Wrapping Modeは、テキスト幅によってテキストの折り返しを設定している項目で、改行を自動で行うかどうか、また改行の直前の空白の処理方法を決めています。

Text Wrapping Modeの設定は、以下の4つから選択することができます。

  • No Wrap
  • Normal
  • Preserve Whitespace
  • Preserve Whitespace No Wrap

No Wrap

No Wrapは、自動での改行を行わないで、TextMeshProの表示領域を超えても、そのままテキストが表示されるようになります。

ちなみに、表示領域が超えている部分は、そのまま表示させるだけでなく、「Overflow」の項目で以下のように省略記号を表示させたり、超えた部分を表示しないようにすることもできます。

Overflow = Ellipsis
Overflow = Truncate

また、No Wrapでは、手動改行時の手前に空白が入力してある場合、その空白が無視されるようになります。

例えば、以下はテキストの配置を決めるAlignmentを「Center」にしていますが、改行時の直前の空白部分が無視されていて、全ての行がセンタリングされて表示されているのが分かります。

Normal

Normalは、TextMeshProの表示領域を超えたテキストがある場合は、自動的に改行して表示させます。

また、先ほどのNo Wrapの設定と同様に、改行時の直前の空白が無視されて表示されるようになります。

Preserve Whitespace

Preserve Whitespaceは、Normalの設定と同様に、TextMeshProの表示領域を超えた場合は、自動で改行を行います。

また、改行時に空白がある場合は、以下のようにその空白を維持するように表示します。

Preserve Whitespace No Wrap

Preserve Whitespace No Wrapは、No Wrapの設定と同様に、TextMeshProの表示領域を超えても自動で改行せずに、そのまま表示されるようになります。

また、手動で改行した場合に、直前の空白を維持するように表示させます。

以下は、Alignmentを「Center」にした場合の表示となり、空白も含めてセンタリングされているので、それぞれの行が少しずれて表示されているのが分かります。

まとめ

このページでは、UnityのTextMeshProでテキストを改行させる方法と、改行における設定についてまとめていきましたが、いかがでしたでしょうか?

TextMeshProでテキストを改行させる場合、エディター上ではそのまま改行して入力することで、改行を認識して表示させることができます。

一方で、スクリプトから改行を行う際は、「\n」「<br>」という記号を使って指定することで、改行させることができます。

また、それぞれの記号を使う場合は、「Rich Text」「Parse Escape Characters」の設定にチェックが入っている必要があります。

最後までお読みいただきまして、ありがとうございました!

コメント