Level Up

스크립트

using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
    [HideInInspector]
    public bool isFacingRight = true;
    [HideInInspector]
    public bool isJumping = false;
    [HideInInspector]
    public bool isGrounded = false;
    public float Speed = 7.0f;
    public float jumpForce = 300.0f;
    public Transform groundCheck;
    public LayerMask groundLayers;
    private float groundCheckRadius = 0.2f;
  
    Rigidbody2D rb2D;
	// Use this for initialization
	void Start () {
        rb2D = GetComponent<Rigidbody2D>();
        
	}
	
	// Update is called once per frame
	void Update () {
        float move = Input.GetAxisRaw("Horizontal");
        Vector2 moveDir = new Vector2(move * Speed, rb2D.velocity.y);
        rb2D.velocity = moveDir;
        isGrounded = Physics2D.OverlapCircle(groundCheck.position, groundCheckRadius, groundLayers);
        if ((move > 0.0f && isFacingRight == false) || (move < 0.0f && isFacingRight == true)) {
            Flip();
        }
        if (Input.GetKeyDown(KeyCode.Space)){
            if (isGrounded == true) {
                rb2D.velocity = new Vector2(rb2D.velocity.x, 0);
                rb2D.AddForce(new Vector2(0, jumpForce));
            }
        }
	}
    
    void Flip()
    {
        isFacingRight = !isFacingRight;
        Vector3 playerScale = transform.localScale;
        playerScale.x = playerScale.x * -1;
        transform.localScale = playerScale;
    }
    
}
       
    }
}

많은 변수들과 함수가 생겼다. 

추가된 변수 설명

[HideInInspector] : 인스펙터 상에서 변수를 보이지 않게한다.

isFacingRight : 플레이어가 오른쪽을 보고있나요? 

isJumping : 점프상태인지 확인

isGrounded : 땅에 붙어있나요? (true : 붙어있음 , false : 안붙어있음)

groundCheck : 그라운드에 붙어있는지 확인하는 체크포인트

groundLayers : 그라운드에 붙어있는지 알 수 있는 레이어 리스트

groundCheckRadius : groundCheck 부터 떨어진 거리

<좌우반전>

이제 플레이어가 움직일 수 있게 되었으니, 좀 더 자연스럽게 보이기 위해서 Player 오브젝트가 이동하는 방향을 바라보게끔 해주려고 한다. 

반전 구현

오른쪽으로 움직이고, 플레이어가 왼쪽을 보고 있을 때

왼쪽으로 움직이고, 플레이어가 오른쪽을 보고있을 때

(진행방향과 보고있는 방향이 다를 때)

Flip ( ) 을 호출한다. 

Flip ( ) 함수 

Player 오브젝트를 좌우 반전시켜주는 함수이다. 

1. 우선 반전시켜줄 것이기 때문에 얼굴방향을 돌려준다.

2. PlayerScale 은 transform 컴포넌트의 Scale 값을 가진다.

3. 플레이어 스케일의 x 값에 -1 을 곱해준다. 

4. transform 컴포넌트 Scale 의 x 값은 -x 가 된다.

(끝)

반전 끝

<점프>

1. 유니티 상에서 Ground 레이어 셋팅 - 점프준비

Player 오브젝트가 Ground 에 붙어있는지 확인하는 이유는 다중 점프(람각)를 방지하기 위해서 이다. 플레이어 오브젝트를 점프시키는 것은 좌우로 이동시키는 것과 같은 원리이기 때문에 (x 값 대신 y 값에 힘을 준다.) 따로 설정을 안해주면 연타로 인한 다중 점프가 가능하다.

따라서 플레이어가 Ground 레이어에 붙어있는지 확인을 하고, 붙어있다면 점프가능, 떨어져 있다면 불가능하게 만들어줄 필요가있다. 

1. Ground 레이어를 추가해준다.

[HideInInspector] 를 써준 애들은 안보인다.

2. Hierarchy 의 Player 오브젝트를  Ground Check 로 드래그해준다.

3. Ground Layers 를 그라운드로 바꿔준다.

Ground Check 에 플레이어 오브젝트를 넣었으니

플레이어 발 아래 파란점이 체크 포인트가 된다.

4. 바닥을 구성하는 모든 오브젝트의 레이어를 Ground 로 바꿔준다.

(셋팅 끝)

2. Physics2D.OverlapCircle

겹치는 부분을 판단해 충돌여부를 감시한다. 정확하고 미세한 작업이다. 3가지의 설정이 들어가 있는데  groundCheckRadius 만큼의 반경을 가지고 있는  groundCheck.position 이 groundLayer 와 겹치는가(닿고있는가)? 정도로 해석할 수 있다.

붙어있다면 isGrounded 는 true 가 된다.

3. 점프 구현

Input.GetKeyDown(KeyCode.Space) : 스페이스바 입력을 받는다.

땅에 붙어있다면 y 값으로 jumpForce 만큼의 힘을 준다. 

3번째 줄에서 x 값을 유지하고 y 값을 0으로 고정시킨 이유는 

경사면에서의 추가 점프를 방지하기 위해서이다.

굳

느낀점:

내용이 별로 없을 줄 알았는데, 예상보다 엄청 긴 포스팅이 되었다. 

Collider 2D

저번에 Player 오브젝트에 Rigidbody2D 컴포넌트를 추가해 주었더니 중력값을 받아 아래로 떨어지는 것을 보았다. 하지만 땅을 뚫고 계속 아래로 내려가는 사태가 발생하였는데, 그 이유는 아직 오브젝트에 충돌체 설정을 해주지 않아서이다. Collider 2D 컴포넌트를 추가해주면 완벽하게 해결이 가능하다. 

우선 player 오브젝트에 Collider 2D 컴포넌트를 추가해 준다.

머리에 적용할 것이기 때문에 Circle Collider 2D 를 추가해준다. 

적용하는 방법

Edit Collider 옆의 아이콘을 누르면 크기를 조정할 수 있다.

offset 의 x 와 y 값을 변경하여 위치조정을 할 수 있다.

offset 값 

x = 0 , y = 0.65

1개의 오브젝트에 여러 충돌체를 설정할 수 있으니 몸통에도 적용해 보자

충돌체적용 후 플레이

땅을 뚫고 가진 않는다.. 데굴데굴 할뿐

굴러가는 것은 Constrains 에 z 값을 고정시켜주면 해결된다.

적용 후

cf) 초기에 설정을 잘못해서 그런지 프리펩들의 충돌체 설정이 죄다 비뚤어져 있다.

아래와 같은 방법으로 바꿀 수 있다.

앞뒤로 움직이기

드디어 첫 스크립트를 작성하는 시간이 왔다. 

게임 프로그래밍을 하고싶었던 이유도, 내가 짠 스크립트가 실제로 어떻게 적용되는지 보고싶어서 이다. c# 프로그래밍을 해본적이 없어 많은 장벽에 부딪힐 것으로 예상된다. 

스크립트 만들기

Unity 5 에서는 c# 과 자바스크립트를 지원한다. 전 버전에서는 boo 라는 언어도 지원했다는데, 사용자가 극소수여서 그런지 Unity 5 버전으로 넘어오면서 지원하지 않게 되었나보다. 많은 사람들이 c# 을 사용하기 때문에 나도 c# 을 사용한다. (사실 자바스크립트를 지원하는지도 이번에 알았다.)

스크립트를 만드는 방법은 Inspector 창의 Add Component 버튼을 이용하는 방법과 Project 브라우저에서 Create 를 눌러 만드는 방법이 있다. 

Player 를 움직이기 위한 스크립트를 만들기 때문에, Player 오브젝트의 Inspector 에 스크립트를 추가시켜준다. (만약 Project 브라우저에서 만들었다면 스크립트를 Hierarchy 창의 Player 오브젝트로 드래그해준다.)

name : 스크립트의 이름

Language : 사용 언어

더블클릭하여 비주얼 스튜디오로 열어주었다. 

모노디벨롭 유니티 라는 툴도 지원한다.

유니티 공식 사이트 설명

이벤트 함수

Start ( ) :  

스크립트가 실행될 때 가장 먼저 호출된다. 첫번째 프레임 업데이트 전에 호출되며, 게임 플레이 도중 강제로 호출할 수 없다.

Update ( ) :

프레임마다 한번씩 업데이트 된다. 인풋을 통한 버튼을 알아내어 게임에 반영하는 상황에서 잘 쓰인다. 

그 밖의 이벤트 함수

Rigidbody2d

스크립트를 만들어 주었다면 Rigidbody2D 컴포넌트도 추가시켜주자. Rigidbody2D 는 2D 전용 물리계산을 해주는 아주 유용한 컴포넌트이다. 

스크립트 작성

우선은 책에 나온 스크립트 (에러가 났다.)

오류내용

전 버전에서는 되었을지 모르나 unity 5 에서는 먹히지 않았다. 

오류가 나는 이유는 rigidbody2D 컴포넌트를 미리 잡아주지 않아서 그렇다. 

유튜브 강의 스크립트 - (강의링크)

스피드 값과 점프 값을 준다. 

스피드 값은 움직일 때의 속도가 된다.

rb2D 변수는 Rigidbody2D 컴포넌트를 잡아주는 역할을 한다.

Vector2 는 변수의 자료형 중에 하나이다.

이 변수에는 x 정보와 y 정보가 들어간다.

x 와 y 는 각각 float 형태이며 x 에는 가로, y 에는 세로로 이동하는 정보가 들어간다.

x 정보 

Input.GetAxisRaw : 

플레이어가 입력한 값에 대해 -1 부터 1 까지의 값("Horizontal")을 갖는다. 

여기에 Speed 값 을 곱하여 플레이어가 x 축으로 이동하는 속도를 결정한다.

y정보

rb2D.velocity.y :

아직 점프를 구현해주지 않았으므로 자기 자신의 값을 넣어준다.

rb2D.velocity = moveDir

2D 물리계산하는 컴포넌트 Rigidbody2D 에 Vector2 값을 넣어준다.

Player 스크립트 컴포넌트에 Speed 값과 Jump 값이 추가됨을 볼 수 있다. 

실행해보기

A, D 혹은 화살표로 움직여진다!

땅을 뚫고 간다고 당황할 필요 없다. 책에서는 설명을 안해줘서 많이 헤매었지만, 아직 충돌체 설정을 해주지 않아서 그런것 뿐이다. 

레이어

영어 단어로 '층'이라는 뜻을 나타내는 레이어는 배경을 그리는데 있어서 아주 중요하다. 

예를들어, 플레이어 캐릭터보다 풀을 더 앞에 그리거나, 구름이 산을 가리게 하는 기능을 레이어 정렬을 통하여 세팅할 수 있다.

아래 사진은 레이어 정렬을 하기 전 모습이다. 

물 오브젝트가 땅위를 덮고있어 부자연스러운 모습이다.

현재, 물과 땅 오브젝트는 레이어 정렬요소를 가지고 있지 않은 상태이다. 

나는 여기서 물을 먼저그리고, 땅을 나중에 그려 물보다 땅을 더 위에 그리려고 한다. 

1. Tag & Layer 속성 설정

Inspector 창 위 - Layer - Edit Layers... 

2번째 메뉴의 Sorting Layers 왼쪽 화살표를 클릭 - '+' 클릭

레이어를 원하는 만큼 입력해줄 수 있다. 

charactor 오타가 났지만 귀찮으므로 패스한다

입력해준 후에 어떤 레이어가 먼저 그려지는지 순서를 정해준다.

간단하게 드래그로 순서를 옮길 수 있으며 

위에서부터 아래순으로 그려진다. 

Background - Midground - Character - Foreground 순으로 그려진다.

Default 는 아무 설정도 안해준 오브젝트에 할당된다. 

2. Sorting layer 설정 변경

Tags & Layers 에서 레이어 셋팅을 마무리 하고, 실제로 적용해보자. 

Inspector 창의 Stripe Renderer 컴포넌트에서 Sorting Layer 설정에서 변경해주면 된다. 

Default 를 클릭하면, 우리가 설정해준 레이어 중 하나를 선택하여 고를 수 있다.

물을 Background 로 지정하고, 땅을 Midground 로 지정해주었을 때

처음으로 GifCam 이라는 프로그램으로 짤방 형식으로 만들어봤는데, 프레임이 겹치는지 미리보기가 이상하게 나옵니다. PC 로는 클릭해서보면 문제없이 나옵니다... 폰으로 보면 이상하게 나오네요.

해결 - 이미지로 올리지 않고, 파일로 올리니까 되네요

맵 제작

드디어 우리가 플레이할 맵을 만들어보는 시간이다. 

유니티를 사용하여 맵을 제작하는 방법은 너무나 간단하다. 

드래그하고 정렬하면 된다. 

우선 Scene 뷰에 자신이 원하는 오브젝트나 프리팹을 드래그한다. 

스내핑 (정렬)

스냅 옵션을 통하여 게임 오브젝트를 의도한 곳에 정확히 배치할 수 있다. 기준은 스프라이트 피봇(pivot) 

방법은 원하는 오브젝트들을 원하는 장소에 대충 올려놓은 뒤에 상단 메뉴 바에서 edit - snap setting 을 눌러주면 된다. 

간단하게 만들어 보았다.

슬라이싱

p1_spritesheet 처럼 하나의 이미지에 여러 캐릭터들이 있을 때에는 스프라이트 에디터에서 영역 분할을 할 수 있다. 

영역을 통해 여러 개의 이미지처럼 나누면,  애니메이션을 만들거나 각각의 스프라이트를 쓸 수 있게된다. 

에디터 내에서 이미지 영역을 나눌 수 있는 방법은 Automatic . Grid by cell size , Grid by cell count 세 가지가 있다. 주로 Automatic을 사용하여 원하는 결과를 얻을 수 있다. 

Automatic을 사용하면 스프라이트의 투명으로 된 바깥 영역의 경계를 기준으로 분할한다. 

방법

project 브라우저에서 나눌 이미지를 선택

Inspector 창의 Sprite Editor 클릭

type : 분할할 모드를 선택 

pivot : 각 스프라이트의 피봇 위치를 설정하여

스프라이트를 이동시킬 때 기준점이 된다. 

(책에서는 bottom으로 하여 이동이나 회전이 발 아래를 기준으로 일어나느 것처럼 보이게 한다.)

slice 버튼을 누를 뒤 모습. 

Apply 를 눌러 설정을 적용한다. 

이번에 알아볼 것은 스프라이트 빌드 이다. 

스프라이트에 게임 오브젝트를 연결시킬 때 필요하다. 

현재 Hierarchy 의 2d sprite 인 player 는 p1_stand 라는 게임 오브젝트가 연결되어 있을 것이다. 

이것을 스프라이트 렌더러로 p1_spritesheet 라는 게임 오브젝트로 바꿔준다. 

Instpector 의 Sprite Renderer 컴포넌트 창

빨간 사각형안의 작은 원을 눌러준다.

위의 p1_spritesheet 를 더블클릭해준다. 

------------------------------------------------------------------------------------

이미 스프라이트 세팅이 되어있는 환경에서는 아래 이미지처럼 p1_spritesheet가 나뉘어서 나올 것이다.

당황하지 말고 p1_spritesheet_0 를 눌러주면 끝

----------------------------------------------------------------------------------------

뭔가 엄청많은 애들이 나왔다. 

player 스프라이트에 p1_spritesheet 오브젝트를 연결해주었다. 

하지만, 우리가 원하는 결과는 저 많은 캐릭터 중에 하나의 상태만 나타내는 것이다. 

여기서 필요한 것이 스프라이트 임포트 세팅이다. 

우선 project 브라우저에서 p1_spritesheet 를 찾는다. 

Assets - _sprites - Player 에 있을 것이다. 

p1_spritesheet 를 클릭

Inspector 창을 보면 Sprite Mode 가 Single로 되어 있다.

Single 을 Multiple 로 변경후 Apply 를 눌러준다.

변경전

변경후

1. 임포트 (Import)

임포트는 우리가 유니티 프로젝트에서 사용할 도구들을 불러 들여오는것을 말한다. 

IT용어 사전에서의 임포트는 다음과 같이 나와있다. 

 '다른 컴퓨터 시스템으로부터 자기의 시스템 안에 데이터 등을 들여놓는 행위'

유니티 내부에 기본적으로 가지고 있는 애셋도 동일하게 추가 가능하지만, 지금까지 강의나 유튜브 동영상으로는 미리 제작된 애셋을 추가하여 사용했다. 

임포트 과정

애셋을 임포트 하는 과정은 매우 쉽다. 

Project 브라우저에서 asset 우클릭

Import Package - Custom Package

 platformerGraphics_KennyV 라는 파일을 선택 후 창이 나온 모습

임포트 후에 애셋들이 추가된 모습

2. 프리팹 (Prefab)

유니티 공식 사이트 설명

사실 프리팹에 대한 정확한 개념은 잘 이해하지 못했다. 

몇몇 글들을 읽어보고 사용하는 모습을 보고 나는  프리팹을 c 언어의 자료형 같은 개념으로 이해했다. 

내가 이해한 프리팹은 특정 애셋들의 집합이다. 

이 집합은 하나의 자료형으로서 사용이 가능하다. 

위치나 다른 설정들을 변경해줄 필요가 있을 때, 개별적으로 변경할 필요가 없고 프리팹 하나만 건들이면 된다. 

예를 들면 

어떤 반에 '철수' '영희' '명수' 가 있다면, 

'철수' 손들어 보세요

'영희' 손들어 보세요

'명수' 손들어 보세요 

라는 3문장을

'철수' '영희' '명수'를 1분단으로 묶어서

1분단 손들어 보세요

라고 한번에 줄일 수 있게된다. 

여기서  '철수' '영희' '명수' 는 애셋이고 '1분단'은 '철수' '영희' '명수' 이 있는 프리팹 이름이라고 비유할 수 있다. 

--------------------------------------------------------------------------------------------------

프리팹은 게임 오브젝트의 하위 개념으로 존재한다. 

프리팹은 우리가 씬에 나타내준 게임 오브젝트와 결합할 수 있다. 

프리팹을 통해 컴포넌트와 속성을 업데이트 해주면, 해당 오브젝트는 번거롭게 다시 작업할 필요가 없어진다.

프리팹 생성 

프리팹을 만들 폴더를 생성 해준뒤

Project 브라우저 - 폴더 우클릭 - Create - Prefab

새로운 프리팹이 생성

연결은 Hierarchy 에 있는 그래픽 자료를 Project 브라우저의 프리팹에 드래그 해주면 된다.

프리팹이 설정되었는지 확인 

아래 그림에서 Player(우측) 는 프리팹으로 만들어 준 애고, 

p1_stand(좌측) 는 단순하게 드래그로 만들어준 스프라이트이다. 

각각 오브젝트에서 Inspector 를 살펴보면 프리팹인지 아닌지 확인 할 수 있다. 

프리팹이 아닌 경우

프리팹인 경우 Prefab 이라고 표현되어 있다. 

처음 프로젝트를 생성해서 들어가보면 

이렇게 빨간 사각형으로 표시된 3 개의 창이 보일 것이다.

각각을 Hierarchy (계층구조), Inspector, Project 브라우저 라고 한다.

아무설정도 만지지 않았는데 이렇게 나와있는것을 보면, 유니티를 사용하는데 있어 아주 중요한 역할을 담당하는 애들임을 알 수 있다.

유니티 공식 사이트 - 인터페이스에 대한 학습

1. Hierarchy  (유니티 공식 사이트 설명)

계층구조 라고도 불리는 이녀석은 현재 씬에서 사용하는 오브젝트간의 관계를 표현된다.

계층이라는 말을 사용하는 이유는 아마도 부모 자식관계를 설정할 수 있기 때문인거 같다. 

게임오브젝트를 계층구조 창에 드래드 하면 Scene 창에 해당 오브젝트가 나타난다. 

이 오브젝트는 캐릭터나 상자, 코인 등과 같이 게임 플레이어가 볼 수 있게된다. 

또, 부모 자식관계를 설정하면, 오브젝트의 설정을 변경하는데 아주 편리하다.  

예를 들어 '다리(bridge)'  부모 오브젝트에 '밧줄' '나무' '철근'  자식 오브젝트를 설정했다고 하자.

만약 다리를 조금 기울고 싶으면, '다리(bridge)' 오브젝트의 설정만 변경해준다면, 자식인 '밧줄' '나무' '철근' 오브젝트 들의 설정도 같이 변경이 된다. 

오브젝트 추가

아래 이미지들은 오브젝트를 추가하는 방법들이다.

우클릭 - 2D Object - Sprite 

(좌측 상단 메뉴) GameObject - 2D Object - Sprite

2. Inspector 

Inspector는 게임오브젝트와 관련된 설정을 아주 상세하게 나타내주고, 값을 변경할 수 있다. 

예를 들면, 벽에 충돌체를 설정하여 플레이어가 벽을 뚫고가지 못하게 한다거나, 위치를 변경하는 등 오브젝트 하나하나의 설정들을 관리할 수 있다. 

컴포넌트 추가

Inspector는 오브젝트별로 필요한 컴포넌트들을 추가해서 사용할 수 있다. 

아래 이미지는 Animator 컴포넌트를 추가하는 과정이다.

Add Component 클릭

추가할 Component의 이름을 검색할 수도 있다.

Animator 컴포넌트가 추가된 모습

3. Project 

이 창은 우리가 가지고 있는 파일을 보여준다. Project 를 통해 우리가 임포트한 모든 애셋을 찾을 수 있다. 

파일들을 잘 분류하고 이름을 잘 지어놓으면, Project 브라우저를 효율적으로 사용할 수 있다. 

지금은 아무것도 없이 Asset 하나만 보일것이다. Asset 을 우클릭 해보면 Create, Import 등 나중에 사용할 필수적인 기능들을 볼 수 있다.

느낀점 

일단은 인터페이스들을 하루라도 빨리 몸에 익히는 것이 중요한것 같다. 아래 한글이나, 비쥬얼 스튜디오같은 프로그램들을 사용할 때에는 핵심적인 기능 몇가지만 알아도 문서를 작성하고, 코드를 짜서 실행해 볼 수 있었는데, 유니티는 핵심적인 기능과 알아야 할 것들이 많다. 

반복해서 몸에 익히는 수밖에 없는거 같다. 아직 스크립트도 짜지 않았는데, 복습을 하지 않고 책만 따라가다 보니까 막히는 부분이 나온다. 

우선 유니티 5 퍼스널 을 다운로드 받자. 

유니티 공식 사이트

이번에 유니티에서 유니티 5엔진의 모든 기능을 사용할 수 있는 퍼스널 버전을 무료화 했다.

단 수익이나 소셜펀딩으로 받은 금액이 1억원 미만이어야 한다는 조건이 있고, 팀 라이센스, 유니티 크라우드, 유니티 Ads, 게임 퍼포먼스 리포팅, 애셋스토어 레벨 11 기능을 사용하지 못하고, 앱을 실행하였을 때 스플래쉬 로고를 출력한다. 

다운받는 법은 따로 설명하지 않겠다. 

1-1 프로젝트 생성

유니티 아이콘을 클릭하여 열어주면 

창이 하나가 뜬다. 

new 버튼을 눌러 프로젝트를 생성

3D 로 작업 2D 로 작업 환경 설정. 2D 플랫포머니까 당연히 2D 로 설정

프로젝트 명은 마음대로

Create Project 버튼을 눌러주면 위와 같은 화면이 나온다.

이것저것 복잡해보인다.  보기에는비쥬얼 스튜디오랑 흡사한 구조를 가지고있다. 

느낀점 :

 아직 아무것도 모르겠지만, 가운데 짙은 회색이 실제 게임을 플레이 할 때 보이는 화면을 나타내는 것이고 상단 중앙에 동영상 재생 표시처럼 나와있는게 미리보기같은 거 같다. 상당히 복잡해 보이지만, 실제 자주 사용하는건 따로 있을것 같은 느낌