게임 리팩토링 - 카메라, 타일맵

찡완이·2023년 8월 29일

서론

게임 리팩토링 2번째, 카메라 및 타일맵에 관한 내용입니다.
이전에 했던 뱀서라이크 클론 코딩 과정에서 배운 내용이 몇몇 포함되어 있습니다.

1. 카메라

1.1. 기존 카메라

카메라의 위치를 스크립트를 통해 플레이어의 위치와 비교하여 이동시킴.
* 카메라의 자연스러운 움직임을 만들고자 코드를 짰지만 정작 자연스러운 움직임은 구현되지 않음.
- 소스 코드의 각 기능을 구별해놓지 않아서 기능을 한번에 알기 힘듦.
특정 위치에서 타일 사이에 까만 줄이 생기는 오류가 존재.

기존 코드

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Camera : MonoBehaviour {

    public GameObject player;

    public float offsetZ; // 기본값 : -35f;

    //private float speed = 0.03f;

    float x = 0;
    float y = 0;
    void Start() {

    }
    void LateUpdate() {
        Vector3 cameraPosition;

        cameraPosition.x = player.transform.position.x + x;
        cameraPosition.y = player.transform.position.y + y;
        cameraPosition.z = player.transform.position.z + offsetZ;

        /if (Battery.onoff)
        {
            if (90 (Player.direction + 1) == 270)
            {
                if (player.transform.position.x + 1f > cameraPosition.x)
                    x += speed;
            }
            else if (90 * (Player.direction + 1) == 90)
            {
                if (player.transform.position.x - 1f < cameraPosition.x)
                    x -= speed;
            }
            else if (90 * (Player.direction + 1) == 360)
            {
                if (player.transform.position.y + 1f > cameraPosition.y)
                    y += speed;
            }
            else if (90 * (Player.direction + 1) == 180)
            {
                if (player.transform.position.y - 1f < cameraPosition.y)
                    y -= speed;
            }
        }
        else
        {
            if (player.transform.position.x < cameraPosition.x)
                x -= speed;
            else if (player.transform.position.x > cameraPosition.x)
                x += speed;
            if (player.transform.position.y < cameraPosition.y)
                y -= speed;
            else if (player.transform.position.y > cameraPosition.y)
                y += speed;
        }*/

        transform.position = cameraPosition;
    }
}

1.2. 수정 방향

Pixel Perfect Camera를 사용.
-> 타일 사이 까만 줄이 생기는 버그 방지.
Cinemachine 도입.
-> 카메라의 자연스러운 움직임 연출, 스크립트 없이 플레이어를 따라다니도록 설정 가능.
-> 결과적으로 스크립트 없이 카메라 움직임을 구현할 수 있음.

1.3. 해결 과정

1.3.1. Pixel Perfect Camera 추가

카메라에 Pixel Perfect Camera 컴포넌트 추가 및 값 설정

1.3.2. Cinemachine 추가

카메라에 CinemachineBrain 컴포넌트 추가
Hierarchy -> Cinemachine -> Virtual Camera를 통해 Virtual Camera를 생성
Virtual Camera의 컴포넌트 옵션에서 Follow에 플레이어의 Transform을 투입, Body를 Transposer, Aim을 Same As Follow Target으로 설정.

2. 타일맵

2.1. 기존 타일맵

기존 타일맵의 경우, 타일을 Wall, Floor 2가지로 분류하였음.
- 벽의 경우, 타일 콜라이더를 컴포넌트로 추가하여 플레이어가 지나가지 못하도록 함.
아래쪽 벽은 플레이어를 가리고, 위쪽 벽은 플레이어를 가리지 말아야하는데, 이를 구현하기 위해 스크립트를 추가하였음.
벽 윗부분을 그냥 검은 색으로 처리해서 벽과 잘 맞지 않음.

기존 타일맵

기존 코드

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class SortingLayer : MonoBehaviour
{
    public SpriteRenderer sr;
    public int order;
    void Start()
    {
        sr = GetComponent<SpriteRenderer>();
    }

    // Update is called once per frame
    void Update()
    {
        order = -((int)transform.position.y + 243);
        sr.sortingOrder = order;
    }
}