Menu
CoddyTech

Canvasとテキスト

CoddyのUnityジャーニー「本格的なゲームを作る」セクションの一部。レッスン 1/56。

Unity は UI システムを使って、画面上にテキスト、ボタン、バーを描画します。Unity 6 では、GameObject > UI > Text - TextMeshPro によって Text (TMP) という名前のテキストオブジェクトが追加されます。初回は、テキストのフォントに必要な TMP Essentials のインポートを Unity が求めます。シーンにまだ Canvas がない場合は、Unity が Canvas を作成してその中にテキストを配置し、UI のクリックを受け取る EventSystem も追加します。Canvas は、その子オブジェクトをカメラの映像に重ねて描画します。カメラがどこを向いていても、画面上の固定された位置に表示されます。Canvas の Canvas Scaler を Scale With Screen Size、1920 x 1080、Match 0.5 に設定しましょう。このコースのすべてのシーンで同じ設定を使っているため、どの画面サイズでもレイアウトの比率が保たれます。

テキストのコンポーネントは TextMeshPro - Text (UI) です。スクリプトでは、基底型 TMP_Text のフィールドに保持します。この型は TMPro 名前空間に属し、text プロパティ(文字列)を通じて表示内容を変更します。このスクリプトは、開始時にレベル名を設定します。

using UnityEngine;
using TMPro;

public class LevelIntro : MonoBehaviour
{
    public TMP_Text titleText;

    void Start()
    {
        titleText.text = "World 2: Ice Caves";
    }
}

Hierarchy から Text (TMP) オブジェクトを Inspector の Title Text スロットにドラッグすると、Unity はそのテキストコンポーネントをフィールドに設定します。using TMPro; がないと、TMP_Text という名前を認識できず、スクリプトはコンパイルされません(CS0246)。スロットを空のままにすると、最初の titleText.text で UnassignedReferenceException が発生します。スクリプトが書き込む内容は、Inspector で入力した Text Input を置き換えます。新しく作成したテキストでは、これは New Text です。

challenge icon

チャレンジ

簡単

探検者は、すでにExplorer.csで実装されているとおり、左右の矢印キーで島を歩きます。画面上部にあるZoneTextに現在の場所を表示しましょう。現在はNew Text:と表示されています。

  • using TMPro;を追加し、zoneTextという名前のパブリックなTMP_Textフィールドを追加します。シーンでは、ZoneTextがこの正確な名前のフィールドにリンクされています。
  • 毎フレーム、探検者のx座標が2未満の間はテキストにZone: Beachと表示し、2以上になったらZone: Jungleと表示します。

Playを押し、草地まで歩いて戻ってから、Checkを押します。

自分で試してみよう

using UnityEngine;

public class Explorer : MonoBehaviour
{
    public float speed = 4f;

    void Update()
    {
        float move = Input.GetAxisRaw("Horizontal");
        transform.Translate(move * speed * Time.deltaTime, 0f, 0f);

        // ZoneTextにゾーンを表示する:x = 2未満ならZone: Beach、2以上ならZone: Jungle
    }
}
quiz icon腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

本格的なゲームを作るのすべてのレッスン