2020.08.04. 수업내용 - NGUI(1)

 

 

 

ui root  : 캔버스 같은거

기본적으로 UI root에 달려있는 카메라를 사용해야함

 

Root 에서 캔버스처럼 사이즈 조절 가능

Panel 에서 order 조절 가능

 

 

이게 기본 구조임

 

 

상단에서 새로운 NGUI를 생성할 수 있음

 

 

sprite

이미지를 끌어 넣을 수 없고 무조건 아틀라스를 갖다 써야함

 

NGUI 폴더에서 마우스 우클릭 -> open atlas maker

에셋의 스프라이트를 클릭하면 자동으로 목록에 들어감

create하면 atlas가 생성됨 (아틀라스 파일,메테리얼 파일, 텍스쳐 파일이 생김)

추가, 삭제, 변경하면 다시 클릭해서 목록에 넣고 add/update 누르면 됨

 

스프라이트를 만들고 만든 아틀라스를 넣어주고

sprite에서 선택해주고 snap을 눌러주면 원래 사이즈로 맞춰짐

 

 

slice 해야할 땐

sprite에서 두번째 edit을 누루고 border를 조정해주면 기준선이 생김

그리고 타입을 sliced로 맞춰줌

 

text를 쓸 땐 라벨을 사용함

폰트를 적용하려면 unity로 바꿔주고 폰트파일을 적용함

color tint에서 색을 바꾸고 effect로 shadow를 적용할 수 있음

 

버튼을 만들 때는 반드시 Button 스크립트와 콜라이더가 붙어야함

sprite 컴포넌트에서 auto-adjust to match에 체크해주면

콜라이더가 자동으로 사이즈가 맞춰짐

(이벤트 시스템이 필요없음)

 

버튼을 사용할 땐

Button 이 아니라 UIButton 을 사용하고

addEventListner가 아니라 Add를 함

EventDelegate로 받고 콜백을 사용함

public UIButton btnStart;

 void Start()
 {
        this.btnStart.onClick.Add(new EventDelegate(() =>
        {
            Debug.Log("start");
        }));  
 }

 

전체 씬구성

 

 

 

전체 코드

 

UITitle

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


public enum eMenuType
{
    Items,
    Shop,
    Message,
    Mission,
    Ranking,
    Setting,

}


public class UITitle : MonoBehaviour
{
    public UIButton btnStart;
    public UIButton[] arrBtnMenus;
    public UIButton btnFriend;
    public UIButton btnFacebook;

    public UIBudgets uiBudgets;

    void Start()
    {
        this.uiBudgets.Init();

        this.btnStart.onClick.Add(new EventDelegate(() =>
        {
            Debug.Log("start");
        }));    

        for(int i=0; i<this.arrBtnMenus.Length; i++)
        {
            var btn = this.arrBtnMenus[i];
            var idx = i;
            btn.onClick.Add(new EventDelegate(() =>
            {
                var menuType = (eMenuType)idx;
                Debug.Log(menuType);
            }));
        }

        this.btnFriend.onClick.Add(new EventDelegate(() =>
        {
            Debug.Log("friend");
        }));

        this.btnFacebook.onClick.Add(new EventDelegate(() =>
        {
            Debug.Log("facebook");
        }));

        this.uiBudgets.btnSoulGem.onClick.Add(new EventDelegate(() => { Debug.Log("소울잼 상점 열기"); }));
        this.uiBudgets.btnGem.onClick.Add(new EventDelegate(() => { Debug.Log("잼 상점 열기"); }));
        this.uiBudgets.btnCoin.onClick.Add(new EventDelegate(() => { Debug.Log("코인 상점 열기"); }));

    }

    
}

 

UIBudgets

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

public class UIBudgets : MonoBehaviour
{

    public UILabel soulgemLabel;
    public UILabel coinLabel;
    public UILabel gemLabel;


    public UIButton btnSoulGem;
    public UIButton btnCoin;
    public UIButton btnGem;


    public void Init()
    {
        this.soulgemLabel.text = "FULL";
        this.coinLabel.text = "1000000";
        this.gemLabel.text = "300";
    }
}