UIで簡単にエンドロールを作る（トリガー検出）

2022年11月10日

複雑なものを必要としない場合のサンプルになります
基本の動きに絞っていますので、必要に応じてカスタマイズします

1. 実行結果
2. シーンの構成
3. スクリプト
- 3.1. EndPointCheck
- 3.2. Telop
4. 最後に
5. 参考

実行結果

このサンプルでは、無限ループになるように作られています
単純なエンドロールであれば、ループの箇所を省略することができます

シーンの構成

テロップ

テロップは、３つのパーツに分ています
キャプチャーはそのうちの１つですが、後の２つも位置が違うだけで同じです
トリガー検出のため、BoxCollider2Dをアタッチします
サイズは１でもいいですが、RectTransformに合わせてあります

エンドポイント

UIのテキストを上方向に移動させています
エンドポイントの位置にテロップが来ると、OnTrigger Enterイベントが発生して、スタートポイントにジャンプするようにしておきます

テロップコントローラ

空のゲームオブジェクトを作成し、テロップを動かすためのスクリプトをアタッチします
必要なパラメータをアウトレット接続します

スクリプト

EndPointCheck

エンドポイントのオブジェクトにアタッチします
トリガーがヒットしたテロップの座標をスタートポイントに変更します

using UnityEngine;

public class EndPointCheck : MonoBehaviour
{
    [SerializeField]
    RectTransform startPoint;

    private void OnTriggerEnter2D(Collider2D collision)
    {
        collision.transform.localPosition = new Vector3(
            collision.transform.localPosition.x,
            startPoint.transform.localPosition.y,
            collision.transform.localPosition.z);
    }
}

Telop

テロップのコントローラーオブジェクトにアタッチします
ひたすらすべてのテロップを移動させる仕事です

using UnityEngine;

public class Telop : MonoBehaviour
{
    [SerializeField]
    RectTransform[] telops;

    void Update()
    {
        for (int i = 0; i < telops.Length; i++)
        {
            telops[i].localPosition += Vector3.up * .1f;
        }
    }
}