-
배경에 sky를 추가해준뒤 카메라에서 배경 색상도 잘 어울리도록 적절히 조절해준다
<정렬 레이어>
레이어 배치와 상관없이 배경 스프라이트에 가려지는 경우가 있다
2D 게임 오브젝트가 그려지는 순서는 스프라이트 렌더러의 정렬레이어가 결정하기 때문
이런 경우에는 정렬레이어를 이용하여 레이어 순서를 맞춰보자
1. Sprite Renderer 컴포넌트에서 Sorting Layer - Add Sorting Layer 클릭
2. +를 눌러 레이어를 원하는만큼 이름을 지어 추가해준다
3. 추가된 레이어를 각각 맞게 지정해주면 된다. 레이어의 숫자가 낮을수록 가장 안쪽에 깔린다고 보면 된다.
위 그림같은 경우 sky는 First 나머지 둘은 sky위로 덮기만 하면 되니 second, Third 상관없다
이제 배경이 될 sky와 Ground가 왼쪽으로 움직이는 스크립트를 작성해주자
using System.Collections; using System.Collections.Generic; using UnityEngine; public class Scroll : MonoBehaviour { public float speed = 10f; void Update() { transform.Translate(Vector3.left * speed * Time.deltaTime); } }Scroll이라는 이름의 스크립트에 만들어주었고
아주 간단하다. 지정해준 speed만큼 Vector3.왼쪽만큼 이동시켜준다
이 스크립트를 배경이 될 sky와 Ground에 넣어주면
잘 작동하는것을 확인할 수 있다
이제 한번으로 끝나는것이 아닌 Sky와 Ground가 계속해서 반복하여 이어지는것이 필요하다
뒷배경이 계속해서 이어지는 원리는 뒤에 적을 Loop 스크립트에 적겠지만 간단한 원리를 설명하자면
배경1 바로 다음에 같은 배경1-1을 연속으로 두고 Scroll 스크립트로 이동시킨다
1. 스크립트가 배경 오브젝트의 X축 위치(transform.position.x)를 계속 검사
2. X축 위치값이 일정값(-width) 이하까지 밀린다면 너무 왼쪽으로 밀렸다 판단하여 현재 위치에서 width*2를 더한다
(배경1 - 배경1-1) => (배경1-1 - 배경1)
3. 즉 -width가 되는 순간 곧바로 +width로 변경되기 때문에 무한반복이 이루어질수 있다
여기서 우리가 얻고 싶은 오브젝트의 가로길이 width는 Box Collider를 추가하여 알아낼수 있다
Sky에 Box Collider를 추가해준뒤 다른 오브젝트까지 물리적으로 함께 밀어내는것을 방지하기 위해
IsTrigger에도 체크해준다
그럼 이제 이 sky 오브젝트에 적용시킬 Loop 스크립트를 만들어주자
using System.Collections; using System.Collections.Generic; using UnityEngine; public class Loop : MonoBehaviour { private float width; private void Awake() { BoxCollider2D backgroundCollider = GetComponent<BoxCollider2D>(); width = backgroundCollider.size.x; } void Update() { if(transform.position.x <= -width) { Reposition(); } } private void Reposition() { Vector2 offset = new Vector2(width * 2f, 0); transform.position = (Vector2) transform.position + offset; } }public class Loop : MonoBehaviour
{
private float width;float형 변수 width 선언
private void Awake()Start과 똑같이 시작할때 한번 실행되지만 Start 메서드보다 한 프레임 먼저 실행된다는 메서드
{
BoxCollider2D backgroundCollider = GetComponent<BoxCollider2D>();변수 backgroundCollider의 값에 Box 콜라이더를 넣어주고
width = backgroundCollider.size.x;변수 width에 Box 콜라이더의 x축 사이즈를 값으로 받는다
}void Update()
{
if(transform.position.x <= -width)만약 x축 위치가 -width보다 낮거나 같아지는 순간
{
Reposition();메서드 실행
}
}
private void Reposition()
{
Vector2 offset = new Vector2(width * 2f, 0);Vector2타입 변수 offset에 x축에다 width*2를 한 값을 넣어줌
transform.position = (Vector2) transform.position + offset;현재 오브젝트의 위치에 offset만큼 더해준다
}
두 오브젝트가 번갈아가며 이어져야 하기 때문에 sky를 하나 더 추가해준뒤
두 오브젝트 모두 Loop 스크립트를 넣어준다
오브젝트가 일정 간격이상 왼쪽으로 넘어갈 경우 곧바로 위치를 오른쪽으로 이동하며
자연스럽게 화면이 이어지는것처럼 보이게 한다