OrthographicSize을 이용한 모바일 해상도 대응

Unity로 2D 탑뷰 게임을 개발하며 모바일 해상도 대응 작업을 하다가 이 글을 쓰게 되었다.

카메라의 투영 타입 (Projection Type) 에는 Perspective와 Orthographic이 있다.

Perspective는 원근 카메라이며 Orthographic은 직교 카메라이다.

Unity Document - Camera.orthographicSize

그중, Orthographic에는 orthographicSize라는 프로퍼티가 있는데, Unity 공식 문서에 따르면,

The height of the viewing volume is (orthographicSize * 2)

즉, 화면 높이 = orthographicSize * 2라고 한다.
orthographicSize가 10이라면 10 * 2 = 20의 화면 높이를 가지게 된다.

여기서 화면 높이는 Unity의 월드 좌표계의 기본 길이 단위인 '유닛'을 기준으로 한다.

예를 들어, 씬에서 Cube와 같은 기본 오브젝트 생성 시, transform scale (1, 1, 1) 일 때, x, y, z가 1 유닛이라고 하는데, 기본 Cube 오브젝트를 20개 이어 붙인 게 화면 높이에 꽉 차게 된다.

그러면 화면 너비는 어떻게 결정되는가..?

화면 너비는 화면 높이와 화면 해상도의 종횡비 (Aspect) 로 결정된다.
예를 들어, 기기의 해상도가 2340 x 1080이고 orthographic size가 6이라면,
화면 높이 = 6 * 2 = 12가 되고 화면 너비는 12 * (2340 / 1080 = 2.166) = 25.922가 된다.

화면 너비에는 약 26개의 Cube, 화면 높이에는 12개의 Cube를 담을 수 있다는 뜻이다.

이를 활용하면 다음과 같은 기능을 만들 수 있다.

public class CameraContentFitter : MonoBehaviour
{
    public MeshRenderer contentRenderer;

    private void Start()
    {
        // 화면 높이 = orthograpicSize * 2
        // 화면 너비 = 화면 높이 * aspect

        var contentWidth = contentRenderer.bounds.size.x;
        var aspect = (float)Screen.width / (float)Screen.height;
        var orthograpicSize = (contentWidth / aspect) / 2f;
        Camera.main.orthographicSize = orthograpicSize;
    }
}

위에서 설명한 공식을 이용해 orthograpicSize를 조정하여 콘텐츠의 가로길이가 카메라 안에 꽉 차도록 하였다.

내가 만들고 있는 게임에서는 배경 이미지가 항상 카메라 안에 모두 담겨야 했기 때문에 해당 기능을 만들게 되었다.