unity04 게임 UI 만들기

2026. 2. 9. 16:03·공부

[UI 란]

게임 자체가 아니라 게임의 진행 상황 등 메타적인 정보를 보여주는 것

e.g. 캐릭터 HP, 목표 지점까지 남은 거리 등

 

[UI 만들기]

1. UI 부품을 씬에 배치

    - UI 를 그리는 기본템들을 모아둔 toolkit 인 Unity UI(uGUI) 를 사용한다

2. UI를 갱신하는 감독 스크립트 작성

3. 빈 오브젝트에 감독 스크립트 적용

 

[Unity UI]

1. GameObject 를 사용해 UI를 그리는 시스템이다

- GameObject 기본 구조:   

GameObject (e.g. "Player"라는 GameObject 정의)
├─ Transform   (기본 탑재 / 위치·회전·스케일, 부모-자식 계층 정보 저장)
│   ├─ Position (x, y, z)
│   ├─ Rotation (x, y, z)
│   └─ Scale    (x, y, z)
└─ Component  (선택적으로 여러 개 추가 가능)
    ├─ Mesh Renderer        (보이게 렌더링)
    ├─ Collider             (충돌)
    ├─ Rigidbody            (물리)
    ├─ Animator             (애니메이션)
    ├─ Audio Source         (사운드)
    └─ Script (e.g. PlayerController) (직접 작성한 코드 / Player라는 오브젝트의 동작 & 기능 로직)

    - GameObject = Unity 내의 물체, 카메라, 조명 등 화면에 나타나는 모든 것. Component 의 컨테이너 역할. 기본은 빈 상태.

    - Component = GameObject 의 동작 방식 & 기능 등을 정의해둔 부분. (Sprite 에 부착하는 Script 도 Component 이다)

2. Canvas 라는 컨테이너 역할을 하는 GameObject 위에 모든 UI(Button, Text 등)가 그려진다

3. UI 를 그리는 GameObject 의 위치 & 이동 설정 시, GameObject에 기본 포함된 Transform Component가 아닌 RectTransform  Component을 사용한다

4. 유저 인터렉션 입력을 받는 EventSystem 이라는 GameObject 를 사용한다

 

[텍스트 표시하기]

- Hierarchy 의 좌측 상단 + 버튼 > UI > Text - TextMeshPro 를 클릭한다

 

[메서드]

- ToString(): 수치(정수 double형 or 소수 float형) -> 문자열 변환 

   e.g. ToString("D3"): 3자리 정수로 표현해라 (자릿수 채워지지 않으면 앞에 0 붙임)

          ToString("F3"): 소숫점 이하 3자리까지 표시해라

- GameObject.Find(씬에 존재하는 다른 오브젝트명): Scene 안에서 인수명으로 전달된 오브젝트를 찾아 반환

   ** gameObject 변수는 스크립트가 적용된 오브젝트 자신을 가리킴

- GetComponent<컴포넌트명>(): GameObject의 특정 컴포넌트 변수/메서드에 접근하기 위해 사용됨

   e.g. GameObject명.GetComponent<컴포넌트명>().정보명

   ** transform 컴포넌트의 경우 특별히 위의 메서드를 사용하지 않고, object.transform 으로 접근 가능 

   ** 오브젝트 자신의 스크립트에서 사용하는 경우, 오브젝트명을 붙이지 않아도 됨

 

[감독 만들기]

1. 감독 스크립트 생성

2. 빈 오브젝트 생성

3. 빈 오브젝트에 감독 스크립트 적용

 

[레이어 설정하기]

- 기본 레이어는 0으로 세팅됨

- 레이어가 높은 순으로 앞(유저가 보는 방향)에 배치됨 

- 오브젝트 별로 레이아웃 설정 가능

 

[이미지 사용하기]

- Canvas > Image 오브젝트를 활용

- Image Type >  Fill 등을 활용해 원형 / 수직 / 수평 HP 바의 이미지의 보여지는 부분을 제어해 HP 변경을 표현할 수 있다

- fillAmount 값을 점점 줄여가면 이미지를 표시하는 비율을 줄이며 HP 가 줄어드는 기능을 구현 가능

 

[앵커링]

- 앵커링 위치를 지정하면, 해당 오브젝트는 해당 위치를 기준으로 상대 위치에 존재하게 된다

- 앵커링 위치를 top right 으로 설정한다 -> 화면의 비율이 줄어들어도, 오브젝트가 화면 밖으로 나가지 않는다

 

[버튼 사용하기]

- Canvas > Button 오브젝트를 활용

- 앵커 포인트를 설정 (e.g. bottom right)

- 불필요한 레이블 삭제

- 버튼 오브젝트를 클릭했을 때, 동작시킬 대상 오브젝트를 연결

- 대상 오브젝트의 컨트롤러 스크립트에 대상을 동작시킬 public 메서드 정의

- 버튼 오브젝트에서 해당 메서드를 사용

 

[게임 상태가 바뀐 것을 감독 스크립트에 전달하기]

1. 감독 스크립트에서 상태값을 저장하는 변수의 값을 바꾸는 함수를 public으로 선언

2. 컨트롤러 스크립트에서 해당 함수를 호출하여 사용

   e.g. a. 감독 스크립트가 적용된 오브젝트를 가져온다 (GameObject.Find(오브젝트명))

          b. 해당 오브젝트의 컴포넌트를 가져온다. (GetComponent<오브젝트명>().메서드명)

          c. 컴포넌트의 변수/메서드에 접근한다

 

 

[감독 스크립트의 활용]

- 게임의 배경을 변경해야하는 경우 (e.g. 캐릭터가 이동하면 배경이 함께 바뀌어야 하는 경우)

 

[씬 전환]

1. 전환할 새로운 씬을 만든다 / 이미지를 새로운 씬에 드래그 & 드롭한다 / position 0,0,0 설정한다

2. 감독 스크립트를 작성한다

    - SceneManager.LoadScene(씬 이름) 을 사용하여 씬을 로드한다

3. 빈 오브젝트를 만들고 감독 스크립트를 적용한다

4. Build > Scenes In Builds 를 통해 씬을 모두 선택해서 unity에 등록해주고 전환할 순서대로 씬을 정렬한다

 

'공부' 카테고리의 다른 글

unity06 반복되는 오브젝트 / 애니메이션 만들기  (0) 2026.02.10
unity05 중력/충돌  (0) 2026.02.10
unity03 게임 설계하기  (0) 2026.02.09
unity02 2d 게임 제작해보기  (0) 2026.02.08
unity01 c#으로 스크립트 작성하기  (0) 2026.02.03
'공부' 카테고리의 다른 글
  • unity06 반복되는 오브젝트 / 애니메이션 만들기
  • unity05 중력/충돌
  • unity03 게임 설계하기
  • unity02 2d 게임 제작해보기
c_jm
c_jm
  • c_jm
    c_jm
    c_jm

    🎋 어제보다 발전한 오늘

  • 전체
    오늘
    어제
    • 분류 전체보기 (51)
      • 프로젝트 (7)
      • 백준 문제풀이 (19)
      • 프로그래머스 문제풀이 (4)
      • 공부 (12)
      • 문제 해결 (2)
      • 기타 (5)
      • 궁금궁금 (1)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    글자색
    다크모드
    티스토리 다크모드
    jquery
    docker-compose.yml
    docker-compose
    리버스 프록시 서버
    docker
    reverse proxy
    nginx
    백준 #1152 #c++
    홈서버
    인라인 css
    html
    복붙
    도커
    리버스 프록시
    코드블럭
    도커컴포즈
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
c_jm
unity04 게임 UI 만들기
상단으로

티스토리툴바