2D 게임 만들기 (6) 점수 시스템(Canvas)

이번 포스팅에서는 점수 시스템을 만들어보려고 합니다.

 

간단한 게임이지만, 점수 시스템이 필요하겠죠??

 

하이어라키 창 우클릭 -> UI -> Canvas를 클릭해서 UI를 만들 준비를 해봅시다.

 

캔버스는 UI를 만들기 위해서는 가장 먼저 만들어야 하는 오브젝트입니다.

 

캔버스를 만들면 EventSystem이 자동으로 함께 생성되는데, Canvas위에서 일어나는 Input 관련 이벤트에 관여하는 오브젝트입니다.

 

하지만 이번 포스팅에서는 캔버스 위주로 설명하도록 하겠습니다.

 

우선 우리 게임의 UI가 다양한 해상도에 대응하도록 만들어보겠습니다.

 

 

캔버스에서 가장 많이 사용 되는 스케일 모드는 고정 픽셀 크기(Constant Pixel Size), 화면 크기에 따른 스케일(Scale With Screen Size) 모드 입니다.

 

고정 픽셀 크기(Constant Pixel Size) 모드

- 캔버스의 크기가 변해도 배치된 UI 요소의 크기를 변경하지 않음

- 화면 크기가 달라지면 UI 요소의 크기 / 간격이 개발자의 의도와 다르게 표기됨

- 간단함

 

화면 크기에 따른 스케일(Scale With Screen Size) 모드

- 기준 화면 크기를 정하고, 실행 화면의 크기가 기준 화면 보다 크거나 작으면 자동으로 확대/축소

- 다양한 화면 해상도에 대응가능

 

저희는 640X360 해상도를 기준으로 화면 크기에 따른 스케일 모드를 사용하겠습니다.

 

Canvas 우클릭 -> UI -> Text로 텍스트 UI를 추가해 봅시다.

 

너비 200, 높이 50을 주고,

 

top - center로 pivot(중심점)을 정했습니다.

Shift키를 누르고 자신이 원하는 pivot을 선택하면 pivot이 변경되고,

Shift키와 Alt키를 동시에 누르고 pivot을 누르면 pivot과 위치가 동시에 변합니다.

 

Text 컴포넌트의 내용을 알아보고 변경해봅시다.

 

Text - 화면에 표시되는 String   /  Score : 

Character - 폰트 / Arial 25

Paragraph - 정렬방식 / 가운데 정렬

top-center(상단, 중앙)에 저희가 정한 Text 컴포넌트의 설정대로 표시되어있습니다.

 

---

이번엔 캐릭터의 행동에 따라 점수를 조정해줄 오브젝트를 새로 만들어 보겠습니다.

 

하이러라키 창 우클릭 -> Create Empty로 빈 오브젝트를 만들고, 다음 컴포넌트 GameController를 넣어봅시다.

 

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

public class GameController : MonoBehaviour
{
    public Text text;
    int score = 0;
    
    private void Start()
    {
        SetText();
    }
    
    public void GetScore()
    {
        score += 100;
        SetText();
    }
    
    public void SetText()
    {
        text.text = "Score : " + score.ToString();
    }

}

Text 컴포넌트의 내부 score의 값에 따라 text내용을 바꿔주는 간단한 기능을 합니다.

 

인스펙터 창에서 Text를 기존에 만들었던 Text오브젝트를 드래그&드랍하여 넣어줍니다.

 

이제 플레이 버튼을 누르면, " Score : 0 " 이 표시됩니다.

 

---

다음 포스팅에서는 보석(Gem)을 획득하여 GameController의 GetScore를 호출하며 점수를 갱신하도록 하겠습니다.