브릿지 unity3d 기초 스터디 3회

Unity3D 초급스터디3회차 `15. 10. 10.

대학연합게임제작동아리 브릿지

스터디 일정 및 커리큘럼• 9월 12일 : 유니티 소개 및 에디터 조작법

• 9월 19일 : Sprite, Animation, Physics 기초

• 10월 10일 : Unity UI, GameManager

• 10월 24일 : Animation Controller, Timer

• 10월 31일 : 슈팅 게임 개발

• 11월 7일 : 2D 게임 완성(마녀이야기)


지난 시간• 프로그래밍 시스템

• 스프라이트, 2D 애니메이션 기초

• 물리시스템

• 스테이지 관리

• Blinkz 실습


uGUI• 유니티의 새로운(?) GUI 시스템

- 새롭다고 하기에는... - 4.6 이상 버전부터 사용가능

• 자세한 내용은- http://www.slideshare.net/gukhwanji/46-gui


http://www.slideshare.net/gukhwanji/46-gui

Canvas• 모든 UI element를 포함하는 게임오브젝트. Canvas라는 컴포넌

트를 가진다.

• 씬 뷰에서 직사각형 형태- 게임 뷰에서 보이는 영역

• Screen Space : 화면을 기준으로 UI 그림World Space : 필드에 세팅 가능. 오브젝트 영향 받음

• Canvas Scaler- Contant Pixel Size : 스크린 사이즈를 바탕으로- Scale with Screen Size : 스크린 사이즈를 지정


Rect Transform• UI 성분들을 위한 새로운 트랜스폼 컴포넌트

- Pivot : 회전이나 이동 시 쓰이는 기준점 - Stretch : 화면의 사이즈에 따라 변경될 기준점

• http://docs.unity3d.com/Manual/UIBasicLayout.html


http://docs.unity3d.com/Manual/UIBasicLayout.html

Text• 흔히 알고 있는 Label

• 폰트, 사이즈 등 여러 정보 수정 가능

• Vertical, Horizontal Overflow 주의


Image• 스프라이트의 기능을 담당하는 UI Element

• Image type- Simple : 기본- Sliced : 3x3으로 분할. 가장자리 부분이 깨지지 않게- Tiled : 스프라이트가 반복- Filled : 부분적으로 스프라이트 보여줌


Interaction Components• Button

버튼이 눌릴 때 이벤트 처리

• Toggle True/False로 이벤트 처리

• SliderOnValueChanged


Depth• 유니티 기존 GUI (4.6이전 버전)

- Z축 값 조절

• NGUI- Depth넘버로 조절

• uGUI- 하이어라키 뷰 순서조절


Sprite Packer• Atlas 생성

- 드로우콜을 줄이기위해

• 드로우콜?- 오브젝트를 화면에 그리기 위해서 엔진이 그래픽API에 그리기를 요청하는 횟 수


실습(1)


• card1 ~ card12 이미지를 스프라이트 패커로 묶기- packingTag 지정

실습(2)


• UI 이미지, 버튼을 활용해서 다음과 같은 화면 구성- canvas size : 800x600- image size : 80x80

Game Manager


• 카드 뒤집기 게임

• GameManager 스크립트를 만들자.- UI 게임오브젝트 (카드 24장)- 카드 앞면 스프라이트 12개, 뒷면 1개 - 현재 상태 관리- 맞춘 카드 갯수- 첫번째 선택한 카드, 두번째 선택한 카드

오브젝트 참조


• public으로 선언 후 인스펙터창에 하나씩 집어넣는 방법

• 스크립트로 불러오는 방법

• 배열로 불러오자!public GameObject[] cards1 = new GameObject[24];

• List, ArrayListusing System.Collections.Generic;추가, 수정, 삭제 용이

Generic


• 클래스 내부에 사용할 데이터 타입을 외부에서 지정하는 기법 Java의 Generic, C++의 Templete

• List<GameObject> cards2 = new List<GameObject>();

오브젝트 참조

• 캔버스 아래에 “cards”라는 빈 오브젝트 생성- 나머지 카드들을 모두 “cards”의 자식으로 집어넣음

• // 이름이 “cards”인 오브젝트를 검색GameObject o = GameObject.Find(“cards”);// o의 자식 오브젝트들을 모두 cards2에 추가for(int i=0; i<o.transform.childCount; i++){ GameObject card = o.transform.getChild(i).gameObject; cards2.Add(card);}


리소스 참조

• 마찬가지로 public으로 선언뒤 인스펙터 창에서 입력

• 스크립트로 불러오는 방법Asset/Resources/ “경로이름”

• ex)Resources.Load(“cards1”, typeof(Sprite)) as Sprite


리소스 참조

• backSprite = Resources.Load("back1", typeof(Sprite)) as Sprite;

• for(int i=0; i<12; i++){ string fileName = string.Format(“card{0}”,i+1); Sprite sprite = Resources.Load(fileName, typeof(Sprite) as Sprite; sprites.Add(sprite);//sprites.Add(Resources.Load(string.Format("card{0}",i+1), typeof(Sprite)) as Sprite);}


버튼 이벤트 등록• public void CardClick(GameObject o){

//일단 만들어놓고! }

• 오브젝트마다 하나씩 집어넣어보자


버튼 이벤트 스크립트로 등록• 귀찮으면 스크립트로.. 근데 좀 복잡함 ㅠ

• 여러 매개변수 전달, 반복 작업이 간편화

• System.Action (Action Delegate) - C# 문법… 알면 좋으나 일단 그냥 패쓰!!- https://mmxbong9.wordpress.com/2014/09/02/c-action-과-delegate-람다식-action-func-event/


https://mmxbong9.wordpress.com/2014/09/02/c-action-%EA%B3%BC-delegate-%EB%9E%8C%EB%8B%A4%EC%8B%9D-action-func-event/

스프라이트를 바꿔보자• GetComponent : 인스펙터 부의 컴포넌트를 스크립트로 가

져옴

• UI 컴포넌트를 사용하려면 using UnityEngine.UI;

• void CardClick(GameObject o){ o.GetComponent<Image>().sprite = sprites[0];}


Card 클래스• Sprite front // 앞면 스프라이트

• Sprite back // 뒷면 스프라이트

• bool isFront // 앞인가?

• void Awake(){ front = null; back = null; isFront = false;}

• GameManager에서 한꺼번에 만들어주자!!!


Card 클래스• public void Setup(Sprite front, Sprite back){

this.front = front; this.back = back; isFront = false; }

• public void CardOpen(){ if(isFront){ this.GetComponent<Image>().sprite = back; }else{ this.GetComponent<Image>().sprite = front; } isFront = !isFront; }


Game Manager 클래스• Start()에 아래 코드 추가

- card오브젝트에 Card컴포넌트를 추가하고, 카드 뒷면 이미지랑 앞면이미지(랜덤) 추가

• card.AddComponent<Card>().Setup(backSprite, sprites[Random.Range (0,12)]);

• CardClick 함수 변경void CardClick(GameObject o){ o.GetComponent<Card>().CardOpen(); }


(실습3) 여기까지 구현!• 클릭하면 미리 생성된 랜덤 앞면 보여주기

• 다시 클릭하면 뒷면 됨


카드 Shuffle• 미리 나열된 배열을 하나 만듬

[0, 0, 1, 1, 2, 2, 3, 3, ... , 10, 10, 11, 11] (size : 24)

• 위의 배열의 순서를 섞어 버린다!


카드 Shuffle


0 1 2 3 4 5

기준 나머지 중 랜덤으로 하나 선택

4 1 2 3 0 5

자리 교환!

카드 Shuffle


4 1 2 3 0 5


4 5 2 3 0 1

자리 교환!

카드 Shuffle


4 5 2 3 0 1


4 5 3 2 0 1

자리 교환!반복!

카드 Shuffle


• 이렇게 섞임[10, 1, 3, 2, 4, 2, ... , 1, 11, 5]

• int[] index = new int[24];for(int i=0; i<24; i++){ index[i] = i/2;}for(int i=0; i<23; i++){ int randNum = Random.Range(i+1, 24); int temp = index[randNum]; index[randNum] = index[i]; index[i] = temp;}

(실습4) Shuffle 적용하기


• 앞에서 작성한 코드에 Shuffle 알고리즘을 추가

• 모든 카드가 한 쌍씩 세트가 되도록

Invoke• Invoke(“함수이름”, 실행할 시간)

• ex) Invoke(“CardOpen”, 1f) CardOpen함수를 1초뒤에 실행하라.


Button• o.GetComponent<Button>().interactable = false;

- 버튼이 비활성화 됨.

• o.GetComponent<Button>().interactable = true;- 버튼이 활성화 됨.


(실습5) 1초동안 버튼 비활성화• 카드 2개를 오픈 하면 1초간 모든 버튼이 비활성화 되도록

함.

• 1초가 지나면 (정답을 제외한) 모든 버튼 활성화


[과제] 카드뒤집기 게임 완성• 게임 시작하면 5초간 카드의 앞면을 보여주고 다시 뒤집힘

- Invoke활용

• 카드를 차례대로 선택. 두번째 카드가 선택되면 1초간 보여주고 정답 판별- 정답 : +500점- 오답 : -100점

• 점수는 UI의 Text를 활용하여 화면에 배치


[과제] 카드뒤집기 게임 완성• 게임 클리어 : 모든 카드를 찾았을 때

• 게임 오버 : -1000점이되었을때

• 5초 뒤 게임 재시작.


브릿지 unity3d 기초 스터디 3회

Education