[2주차 게임] 풍선을 지켜라 -1

A. 기본 씬 구성하기

1. 프로젝트 만들기

a. 프로젝트 생성하기

2D의 myShield라는 프로젝트를 생성한다.

 

반갑다 최고쉴드야

 

빌드할떄마다 느끼는건데 무겁긴 진짜 무거운 것 같다 ㅠㅠ 뭔 빌드가 이렇게 오래 걸릴까.. 

 

 

b. 기본 세팅하기

1) windows → Layout → 2x3 

2) Project → One Column Layout

3) free aspect → phone (760x1280)

4) Project 탭에서 Assets → Scenes → SampleScene을 MainScene으로 rename

 

두두둥장

 

2. 배경 구성물 만들기

a.  배경 생성 및 설정하기

GameObject → 2D Object →Sprites → Square

 

1) name : background

2) scale : x: 6 / y: 10

3) rgb 20, 20, 80

4) order in layer 0 (기본값)

 

배경이 생성됐다

 

b. 풍선 생성 및 설정하기

GameObject → 2D Object →Sprites → Circle

 

1) name: ballon

2) Position : y: -3.2

3) order in layer 1

 

내가 지킬 풍선을 생성했다

 

c. shield 생성 및 설정하기

GameObject → 2DObject →Sprites → Circle

 

1) name: shield

2) scale: x:0.5 / y:0.5

3) rgb: 0, 0, 255

4) order in layer 1

 

 

d. 타이머 생성 및 설정하기

타이머는 UI의 Test를 활용해서 생성

 

GameObject → UI → Canvas (생성 후) → (Canvas 에서) Text 추가

 

1) (Text의) name: timeTxt

2) width: 200, height: 200

3) position : x:0, y: 450

4) font size: 70

5) rgb: 255, 0, 0

6) 가운데, 중앙 정렬 / bold

7) text: 0.00

 

 

 

 

B. 풍선 애니메이션 더하기

0. 풍선 애니메이션 설명

1주차에는 이미지 2개를 번갈아 가며 애니메이션을 구현했지만, 

이번에는 다르게 이미지 없이 Sprite만 사용해서 애니메이션을 더할 예정

 

1. 풍선 애니메이션 종류

☆ 풍선이 반짝하는 애니메이션 (기본상태)

★ 상자와 충돌하면 풍선이 터지는 애니메이션 

     (이건 상자를 생성한 후 나중에 생성)

 

2. 풍선이 반짝하는 ☆ 애니메이션 만들기

a.  애니메이션 생성하기

0) Assets 하위에 Animation 폴더 생성

1) animation 폴더 하위에 ballon_idle (기본상태) 애니메이션을 먼저 생성

 

후하후하

 

b.  ☆ 애니메이션 설정하기

 

1) Loop Time 체크

 

2) ballon_idle을 ballon에 부여하기

    → 부여하면 ballon의 Animatior Contorller가 자동으로 Animation 폴더에 생성된다

 

3) ballon_idle 더블클릭하기 (Animation 창 팝업)

 

4) ballon 객체를 클릭해 Animation 창 활성화하기

 

5) 레코드 (빨간색 동그라미)를 눌러서 세팅하기

     (a) 0.0초 / 0.4초에는 처음 모습 그대로 세팅

     (b) 0.2초에는 rgb 200, 200, 255

    → CSS를 수정하면 알아서 점으로 박힘, 위에 초를 드래그하면 시간을 변경할 수 있음

 

6) play버튼을 눌러서 확인

반짝반짝

 

### warning!

<문제>

AnimationEvent has no function name specified! 의 warning msg가 생겼다

난리도 아니다

<해결>

Animation에서 이벤트에 연결된 함수가 없을 때 발생함
(애니에미션 이벤트 안눌렀는데 언제 눌렀는지 모르겠다)

위에 마커부분을 오른족 클릭해서 지워준다

 

깨끗하게 지워지고 로그도 없어졌다

 

 

 

C. 마우스(Shield) 움직임 더하기

0. 마우스 움직임 설명

마우스를 활용해서 shield의 위치를 조절해야 하기 위해서는

마우스의 위치를 알고, 그 위치를 shield의 포지션과 연결해야 함

 

1. Shield 움직임 더하기

a. Shield 생성하기

1) Script 폴더 생성 후 shield 스크립트 생성

 

2)  shield에 스크립트 붙이기

    → 스크립트 생성이 되는 와중에 붙이면 컴파일 에러가 남

 

3) shield 스크립트를 수정해 마우스 포인터를 따라 움직이게 하기

= mouse의 좌표계를 카메라 좌표계로 바꾸고, shield의 위치에 넣어주기

 

void Update()
{
    Vector3 mousePos = Camera.main.ScreenToWorldPoint(Input.mousePosition);
    transform.position = new Vector3(mousePos.x, mousePos.y, 0);
}

 

d) play해서 움직임 확인하기

 

잘 움직인다 하하하하하

 

 

 

D. 네모 생성하기

1. 네모 생성 및 랜덤 설정하기

a. 네모 생성 및 설정하기

MainScene → GameObject → 2DObject →Sprites → Square

 

1) square로 rename

2) position x:0, y:3

3) order in layer 1

 

적이 나타났다

 

b. 네모 랜덤 특성 구현하기

네모는 랜덤한 위치, 랜덤한 색상, 랜덤한 크기로 생성됨

 

1) square.cs 생성하기

랜덤한 크기, 위치, 사이즈를 만들어줘야함

 

(a) square.cs 스크립트 생성 후 네모에 붙이기

 

(b) 랜덤한 위치에서 생성

 

void Start()
{
    float x = Random.Range(-3.0f, 3.0f);
    float y = Random.Range(3.0f, 5.0f);

    transform.position = new Vector3(x, y, 0);
}

 

(c) 랜덤한 사이즈로 생성

 

 // (위 코드와 계속)
 
float size = Random.Range(0.5f, 1.5f);
transform.localScale = new Vector3(size, size, 1);

 

(d) 확인하기

 

잘 생성된다

 

2. 네모의 떨어짐과 충돌구현

a. 구현방법

1주차에 했던 방식과 동일하게, 한쪽에 rigidbody 2D를 주고, 양쪽에 collider가 있으면 끝!

네모와 풍선과 마우스에 충돌이 있어야 하니 collider를 각각 달아줘야 함

 

b. 구현하기

1) Add Component로 네모에 rigidbody 2D와 box collider 2D를 추가함

 

2) 풍선, 마우스에 circle collider 2D 달기

 

콜라이더가 잘 달리면 초록 테두리 선이 생김

 

3) play 눌러 확인하기

에임이슈;;;

 

3. 네모 랜덤 생성하기

a. 네모의 생성 특성 알기

1) 네모는 같은 틀을 사용함 : prefab

2) 네모는 게임이 시작하자마자, 자동 무한 생성 : gameManager, Instantiate

 

b. 네모를 prefab으로 생성

1) Prefabs 폴더를 만들고 square를 끌어다놓기

2) 기존 square 오브젝트는 삭제

 

잘가 square...

 

c. gameManager 생성하기 

여기서 네모를 무한 생성 할 예정

 

1) gamaManager(create empty)와 script를 만들고 서로 붙이기

 

 

2) gamaManager.cs를 열고 반복 실행하게 하기 (확인용)

 

void Start()
{
    InvokeRepeating("makeSquare", 0.0f, 0.5f);
}

void makeSquare()
{
    Debug.Log("반복한다!");
}

우렁차네

 

3) 네모 무한 생성하기

 

(a) square 프리팹을 받아서 연결하기

 

도킹완료

 

(b) 복제하기

 

public GameObject square;

void makeSquare()
{
    Instantiate(square);
}

 

4) 확인하기

 

제거되지 않아서 무한으로 생성되는 네모들