【Unity 2D】背景を使い回して無限ステージを作る方法

Unityの2Dシーンにおいて、背景を再利用してステージを組み上げたいと思います。

これによってエンドレスなステージを作ることが可能ですし、オブジェクトを新たに作り続けるより使い回した方が端末への負荷を抑えることができます。

LoopGG

本記事での背景の使い回しは、右方向にメインカメラが強制スクロールする状況で、横に並べた３枚の画像を順繰りと移動させるものです。メインカメラの移動に合わせて一番左の画像が一番右に移動していく仕組みです。

なお、一番左に配置している画像を「左画像」、中心にある画像を「中心画像」、一番右に配置している画像を「右画像」と呼ぶことにします。

GIFのようなシーンを作る手順を要点だけ列記します。

  1. カメラを覆うようにして中心画像を配置。その両隣りにも同じサイズの画像を配置。画像は「2D Object → Sprites → Square」で四角形を作成して色を変えています。
  2. 左画像のオブジェクト名は「 LEFT」、中心画像は「CENTER」、右画像は「RIGHT」にします。
  3. 下記のスクリプトをメインカメラにアタッチします。再生するとGIFのように、メインカメラの右端が右画像の中心を過ぎると左画像が一番右に移動します。
using UnityEngine;

public class LoopBg : MonoBehaviour
{
    string BG_LEFT = "LEFT";  // 左画像のオブジェクト名
    string BG_CENTER = "CENTER";  // 中心画像のオブジェクト名
    string BG_RIGHT = "RIGHT";  // 右画像のオブジェクト名

    void Update()
    {
        // カメラの移動(メインカメラに本スクリプトをアタッチ)
        Vector3 v3 = Vector3.right * Time.deltaTime;
        transform.position += v3;

        //*** 左画像を右画像に移動 ***//
        // メインカメラ右端のX座標を取得
        float camera_rightend_x = Camera.main.ViewportToWorldPoint(Vector2.one).x;

        // 右画像のゲームオブジェクトを取得
        GameObject bg_right = GameObject.Find(BG_RIGHT);

        // メインカメラ右端が右画像の中心X座標を超えたら、左画像を右画像の右隣に移動
        if (camera_rightend_x > bg_right.transform.position.x)
        {
            // 右画像の横幅を取得
            float size_x = bg_right.gameObject.GetComponent().bounds.size.x;
            // 移動先のX座標を算出
            float new_x = bg_right.transform.position.x + size_x;

            // 左画像のゲームオブジェクトを取得
            GameObject bg_left = GameObject.Find(BG_LEFT);
            // 左画像を右画像に移動
            bg_left.transform.position = new Vector2(new_x, bg_left.transform.position.y);

            // 移動に伴いオブジェクト名を修正(左画像=>LEFT, 中心画像=>CENTER, 右画像=>RIGHT)
            GameObject.Find(BG_CENTER).name = BG_LEFT;
            bg_right.name = BG_CENTER;
            bg_left.name = BG_RIGHT;
        }
    }
}

 

sponsor