본문 바로가기
개발일지/무작정 게임 만들기

[2D 하향식 게임 프로젝트] 3탄. 캐릭터 이동과 충돌영역(콜라이더), 오브젝트 레이어 정렬

by 개발자 슈니 2022. 9. 26.
728x90
반응형

 

추석 연휴를 보내고 오랜만에 진행중인 프로젝트를 열었다

 

2탄에서 간단하게 첫번째 튜토리얼 맵을 디자인하고 끝냈다

오랜만에 다시 작업하려니 전에 뭐를 작업했는지

기억이 잘 나지 않았는데

블로그에 기록해둔걸 읽어보니 마치 어제 작업한것마냥 기억이 새록새록 떠올랐다

블로그에 기록하는것은 좋은 습관인듯!

오늘은 이 튜토리얼 맵에서 간단한 기능을 구현해보기로 한다

첫번째. 플레이어 캐릭터 입력값 받아서 움직이기

두번째. 캐릭터의 이동에 따라 카메라 움직이기

세번째. 오브젝트와 상호작용하기

튜토리얼 맵에서 필요한 기능들은 총 세가지로 나눌 수 있다

그런데 항상 진행하면서 추가사항이 생기긴 한다 ㅎㅎ..

모바일용 게임을 생각중이기 때문에

플레이어의 이동은 조이스틱으로 입력을 받아야 하지만,

지금은 일단 편의를 위해 키보드로 입력을 받기로 하자

그리고 캐릭터는 움직이는데 카메라가 고정적이면

뭔가 어색해 보일테니 카메라가 자연스럽게 캐릭터를 따라서 이동하도록 하자

그런데 카메라가 내가 그려 놓은 배경 영역을 벗어나게 되면

또 이상할테니 그 벗어나지 못하도록 고정값을 주면서 따라다니도록 해야겠다

마지막으로 플레이어가 상호작용이 가능한 오브젝트 앞에 다가갔을때

버튼 입력으로 오브젝트와 상호작용을 할 수 있도록 한다

과연 난이도는 어떠련지~~

어쨋든 오늘은 첫번째 플레이어 캐릭터 입력값 받아서 움직이기를 구현해보자^^

지금 당장은 캐릭터라 할만한 리소스가 없기 때문에

기존에 만들어둔 캡슐 오브젝트 빨강이를 캐릭터라고 칭하고 해보자^^

Assest 폴더에 Prefabs 폴더를 만들어줬다

왜냐하면 플레이어 캐릭터를 프리팹으로 만들어주기 위함!!

지금 당장은 플레이어 캐릭터가 프리팹이 아니어도 괜찮지만

나중에 맵을 이동하게 된다면 필요하게 될것 같아서 미리 프리팹으로 만들어 줄것이다

프리팹은 하이어라키 창에서 오브젝트를 잡고

드래그 앤 드롭으로 프로젝트 창으로 가지고 오면 된다

프리팹이 된 오브젝트는 하이어라키창에서 파란 글씨에 상자 모양을 확인할 수 있다

프리팹이 된 오브젝트는 하이어라키창에서 삭제하더라두

언제든 다시 드래그앤드롭으로 끌어와 사용할 수 있다!

에셋 폴더안에 스크립트를 관리할 폴더를 만들었다

나같은 경우 분류별로 폴더를 만들어서 관리하는게 편해서 그렇게 하고 있다

스크립트 폴더를 만들었으면

이제 스크립트를 작성해보자

일단은 플레이어 캐릭터가 사용자의 키보드 입력 값에 따라

이동 하도록 명령하는 스크립트를 만들것이다

그리고 나중에 사용할 플레이어 캐릭터의 이동 애니메이션이나 상호작용 등

플레이어의 액션에 필요한 기능을 담을 스크립트이다

 

플레이어 액션을 담당해줄 스크립트에서

이동을 입력받는 코드 작성이 끝났다

리지드바디를 통해 힘의 입력 방향에 따라 속력을 줄 것이기 때문에

이동 속도와 리지드바디를 먼저 선언하고 초기화해줬다

스크립트를 저장하고 다시 유니티 에디터로 돌아온다

저장한 스크립트를 드래그앤드롭으로 Player 오브젝트에 넣어주거나

Add Component 버튼에서 검색을 통해 추가해준다

그리고 Add Component 버튼을 눌러

Rigidbody2D를 검색해서 추가해준다

보통 Rigid 까지만 쳐도 바로 나오는데 여기서 3D인지 2D인지 잘 확인할것!

내 게임은 2D 게임이기 때문에 2D로 추가해줬다

자 이제 테스트 해보자!

테스트 해봤더니

캐릭터가 밑으로 떨어진다

이건 중력에 의한건데

우리 게임은 중력이 필요 없으므로 간단하게

중력을 0으로 주면 해결^^

캐릭터가 상하좌우 잘 이동한다!

근데 어떤 오브젝트에 닿아도 통과를 하는 뛰어난 능력을 갖고 있다

이를 해결하려면 충돌 체크를 해주는 콜라이더를 갖게 해주면 된다

 

플레이어 오브젝트에 써클 콜라이더 2D 컴포넌트를 추가했다

박스나 캡슐 콜라이더를 사용하지 않고

써클콜라이더를 사용한 이유는 각진 모서리 부분에서 걸리지 않고 부드럽게 지나가기 위함이다

콜라이더의 y축 길이를 -0.5를 주어 발 부분이라고 생각드는 곳에 위치해 주었고,

반지름은 0.5를 주어서 캐릭터를 감싸게 해주었다

이 부분은 나중에 캐릭터 리소스를 변경하면서도

다시 만져줘야할것같다

캐릭터에 콜라이더를 주었으면

이제 충돌이 가능하고 통과를 하면 안되는 모든 오브젝트들에게도

콜라이더를 추가해준다

콜라이더를 추가해줘야 할 부분들이 많은데 차근차근 하잣

타일맵에도

콜라이더를 적용해줘야 하는 부분이 있기 때문에

타일맵 오브젝트를 추가해 이름을 Collider로 변경해준다

콜라이더 오브젝트에는

타일맵 콜라이더와 컴포싯 콜라이더를 추가했다

이렇게 하면 어떤 타일들을 놓았을때

그 크기에 맞는 콜라이더가 자동으로 생성되기때문에 편리하다 : )

타일 팔레트를 열어서

콜라이더 영역을 표시해줄 부분을 그려준다

이때 활성화된 타일맵이 좀전에 만든 Collider 타일맵이 맞는지 확인한다

콜라이더로 쓸 타일맵은 이렇게 그려주었다

바깥 라인만 콜라이더를 그려주면 안쪽 영역으로는 들어오지 못한다

Collider Tilemap의 인스펙터를 보면

기존에 있던 TilemapRenderer 컴포넌트를 삭제해주었고

Rigidbody2D의 Body Type을 Static으로 변경해

실행했을때 콜라이더가 밑으로 떨어지는걸 방지해주었다

자, 이제 실행해보면

충돌 체크가 아주 잘 되는것을 확인할 수 있지만

캐릭터의 콜라이더와 타일맵의 콜라이더가 충돌하면서

캐릭터가 빙글 빙글 회전하는 문제가 발생한다!

간단한걸 구현하면서도 이렇게 몇몇의 문제들이 발생한다 ㅋㅋㅋㅋㅋ

하지만 이 문제는 쉽게 해결이 가능하다

플레이어 오브젝트의 인스펙터에서

리지드바디 컴포넌트를 찾아

Z 축의 회전을 얼려버리면 캐릭터가 빙글 빙글 도는 문제는 간단하게 해결된다

타일맵 콜라이더와 충돌 체크를 확인했으면 이제

오브젝트에도 똑같이 콜라이더를 추가해 주면 되는데

타일맵과 다르게 오브젝트는 각각에게 컴포넌트를 추가해주어야 한다

이 맵에서 충돌이 가능해야하는 오브젝트들은

이렇게 있다

귀찮지만 하나씩 콜라이더를 추가해주자

각 오브젝트들에 박스콜라이더2D를 추가해주었다

보이는 초록색 영역이 콜라이더다

캐릭터와 오브젝트간에 충돌이 잘 되는데

캐릭터가 오브젝트 아래에 있으면 캐릭터가 가려진다

캐릭터가 오브젝트의 아래에 있으면 캐릭터가 앞에 있는 것처럼,

뒤에 있으면 캐릭터가 가려져 뒤에 있는 것처럼 표현해보자

새로 만든 LayerSetting 스크립트를

적용해줄 오브젝트들에 추가해주자

그런 다음 플레이어 액션 스크립트에도 코드를 추가한다

오브젝트들의 피봇을 바텀으로 바꿔주면서

배치된 오브젝트들의 포지션값이 변해있다

이 부분을 알맞게 수정하면 된다

이제 테스트 해보면!!

버섯 오브젝트랑 바위 오브젝트는 잘 되는데

 

나무 오브젝트들만 생각대로 잘 되주지 않는다ㅜㅜ

이 문제를 해결해 보려고 했으나,

결국 해결방법을 찾지 못하고 다른 방법을 통해 문제를 해결했다

스크립트를 통한 레이어 변경이 아니고

에디터를 통해서 레이어를 바꿔주는 법이 있었다

에디터 좌측 상단에 Edit을 클릭하고

Project Setting -> Graphics 에서 Camera Settings 모드를 CustomAxis로 변경한뒤

Transparency Sort Axis를 0,1,0 으로 맞춰준다

이러면 레이어가 같은 스프라이트 렌더러는 좌표 y축에 따라 바뀌는 기능을 할 수 있단다

이 방법으로 테스트 하기 위해

오브젝트에 추가한 스크립트를 비활성화 한 뒤 테스트 해보았다

캐릭터도 더이상 빙글빙글 돌지 않고

오브젝트와 충돌이 되며 오브젝트를 통과하지도 않는다

그리고 오브젝트의 뒤로 가면 캐릭터가 뒤로 감쳐지며

내가 원했던 기능이 제대로 동작한다!

아까 만들어둔 LayerSetting 스크립트와

PlayerAaction 스크립트에 추가한 코드는 지워준다..ㅎ

스크립트가 잘못된건 아닌데

아무래도 오브젝트의 좌표(y축)가 겹쳐서

플레이어의 레이어와 오브젝트의 레이어가 부딪혀서 그런것같다^^;

내 게임에서는 후자의 방식이 더 잘 동작하기 때문에

후자의 방식으로 사용하기로 했다

마지막에 좀 애먹긴했지만 그래도

첫번째 진행을 완료했으니 다음번에는

두번째. 캐릭터의 이동에 따라 카메라 움직이기 를 구현해보자

728x90
반응형

댓글