유니런(3) - 배경 스크롤링

유니런에서는 캐릭터가 움직이는 것이 아니라

 

배경과 발판이 움직이는 형식으로 게임이 진행됩니다.

 

사용자가 보기에 플레이어 캐릭터는 계속 뛰는 것처럼 보이지만 

 

실제 캐릭터의 x축 위치는 고정되어있으며, 배경과 발판이 플레이어를 향해 다가옵니다.

 

먼저 배경으로 하늘을 추가하겠습니다.

 

에셋의 Sky를 하이어라키로 드래그 드롭해주고

 

메인 카메라 컬러를 변경해줍니다.

 

배경 오브젝트때문에 캐릭터가 가려져있습니다.

 

정렬 레이어를 추가해줍니다.

 

추가한 정렬 레이어를 오브젝트들에 할당해줍니다.

 

Sky 오브젝트를 백그라운드로, 플레이어와 발판을 포그라운드로 변경해줍니다.

 

캐릭터와 배경, 발판이 원하는 대로 구현됐습니다.

 

이제 배경과 발판이 움직이게 하기 위해 ScrollingObject 스크립트를 작성하겠습니다.

 

using UnityEngine;

// 게임 오브젝트를 계속 왼쪽으로 움직이는 스크립트
public class ScrollingObject : MonoBehaviour {
    public float speed = 10f; // 이동 속도

    private void Update() {
        //초당 speed의 속도로 왼쪽으로 평행이동
        transform.Translate(Vector3.left * speed * Time.deltaTime);
    }
}

 

실행해보니 발판과 배경이 움직이는 데 성공했지만 콘솔 창에 오류를 확인할 수 있습니다.

 

실수로 발판에 Player Controller 스크립트가 들어가 있습니다.

 

오류가 뜨지 않게 되었고, 캐릭터가 발판 밑으로 떨어져 데드존에 닿으면 Die 애니메이션이 출력됩니다.

 

그러나 지금은 배경과 발판을 지나면 아무것도 없는 공간이 나오게 됩니다.

 

배경 오브젝트 두 개를 이용해 좌측으로 끝까지 이동한 배경 오브젝트를 계속해서 우측으로 순간 이동하게 만들어

 

배경이 무한 루프 되게 만들겠습니다.

 

배경이 우측으로 순간 이동하게 될 길이를 측정하기 위해

 

박스 콜라이더 2D 컴포넌트를 추가해 Sky 게임 오브젝트의 가로길이를 구합니다.

 

박스 콜라이더 2D 컴포넌트는 트리거로 설정합니다.

 

이제 BackgroundLoop 스크립트를 작성하겠습니다.

 

using UnityEngine;

// 왼쪽 끝으로 이동한 배경을 오른쪽 끝으로 재배치하는 스크립트
public class BackgroundLoop : MonoBehaviour {
    private float width; // 배경의 가로 길이

    private void Awake() {
        //BoxCollider2D 컴포넌트의 Size필드의 x값을 가로 길이로 사용
        BoxCollider2D backgroundCollider = GetComponent<BoxCollider2D>();
        width = backgroundCollider.size.x;
    }

    private void Update() {
        // 현재 위치가 원점에서 왼쪽으로 width 이상 이동했을때 위치를 리셋
        if(transform.position.x <= -width)
        {
            Reposition();
        }
    }

    // 위치를 리셋하는 메서드
    private void Reposition() {
        //현재 위치에서 오른쪽으로 가로 길이 *2만큼 이동
        Vector2 offset = new Vector2(width * 2f, 0);
        transform.position = (Vector2)transform.position + offset;
    }
}

이제 Sky 오브젝트를 한 개 더 생성해줍니다.

 

플레이해보면 Scene에선 처음 Sky 오브젝트가 좌측으로 일정 이상 이동하면

 

우측으로 순간 이동하는 것이 보이지만

 

디스플레이를 통해서는 그저 배경이 계속해서 이어지는 것으로 보게 됩니다.

 

Sky 오브젝트 두 개를 하이어라키창에서 묶어줍니다.