UGUI, NGUI

JMG·2023년 11월 2일

게임 특징

C# Script, Engine, Physics, UI, Effect, Sound, Tool, Animation, Input, Visual, State, Data

UGUI (Unity GUI)

OnGUI -> NGUI -> UGUI 순서로 업데이트됨

  • GameObject 기반 UI 시스템

Draw order of elements

Canvas에 순서대로 그림 (나중에 그려진 그럼이 앞으로 보임)

  • Transform 구성 요소에서 SetAsFirstSibling, SetAsLastSibling, SetSiblingIndex 메서드를 사용해서 스크립팅에서 순서 제어 가능

Canvas - Render Modes

  • Screen Space - Overlay: 화면 위에 덧그려지는 방식
  • Screen Space - Camera: 카메라 기준으로 가까운 것이 위에 그려짐
  • World Space: 오브젝트처럼 그림 (ex. 캐릭터 머리 위 체력바)

Basic Layout

위치, 회전, 스케일이면 충분한 오브젝트와 다르게 여러가지 옵션(Anchors, Pivot 등)이 필요 (React Transform 참고)

  • Pivot: 중심축 기준으로 회전
  • Anchors: 특정 점(Anchor; 기준점)을 중심으로 얼마큼 떨어져 있는지 (화면 크기가 변해도 같이 따라서 움직임)
  1. 여러 크기의 화면을 지원하기 위해 사용
  2. 위치만 변경 (오른쪽 하단)
  3. 화면 크기에 따라 UI도 같이 크기 변경(비율 변경)이 가능하게 할 수 있음 (하단에 쪼개서 Anchor 2개 이상 지정)
  • Anchor presets에서 기준별로 어떻게 UI를 조절할지 정할 수 있음
    • Anchor Min(왼쪽 아래), Anchor Max(오른쪽 위)

Visual Components

  • Text, Image
    • Image에선 확대 시에도 테두리가 자연스럽게 처리할 수 있도록 9slice 기능을 제공 (Sprite Edit)

Interaction Components

  • 버튼, 토글, 체크박스 등

Rich Text

ex) We are <b>not</b> amused.

스프라이트 패커 (2020.1 이상 미지원)

Sprite Atlas

스프라이트 패킹 (한 이미지에 여러 스프라이트를 넣어서 사용)

Edit -> Project Settings -> Editor -> Sprite Packer -> Mode 변경

  • Assets -> Create -> 2D -> Sprite Atlas 표시됨
  • Sprite Atlas 생성 후 여러 이미지를 추가한 뒤 Pack Preview로 확인 가능

NGUI (Next-Gen UI kit)

UGUI 이전에 주로 사용하던 GUI

  • 이벤트형 UI 프레임워크
  • UGUI와 다르게 커스터마이징 가능

UI Camera

Event Sources, Thresholds 등 설정 가능

UI Texture, UI Sprite, UL Label

script로 되어있음

profile
DIY Coding

0개의 댓글