유니티

새로운 프로젝트를 만듭니다. 2D템플릿을 선택하고 프로젝트 이름은 UniTopGame 이라고 합니다.

WorldMap이라는 이름으로 씬을 저장하고 빌드에 추가합니다.

예제의 UniTopGame_chap8>Assets폴더의 Iamges폴더 Map폴더와 Sound폴더를  프로젝트의 Assets폴더로 복사합니다.

8.3 타일맵으로 게임 화면 만들기

타일맵 알아보기

타일맵이란 동일한 크기의 이미지를 여러개 나열해 게임화면을 만드는 방법입니다.

멀티스프라이트 만들기

Map폴더에서 TileMap을 선택합니다. 한장의 그림안에 32x32픽셀규격의 여러 타일맵을 가진 도트이미지 입니다. 

유니티는 한 장의 이미지를 여러개로 잘라 사용할 수 있는 기능이 있습니다.

 TileMap을 선택하고 인스펙터뷰를 봅니다.

Sprite Mode의 Single->Multiple로 변경합니다. 그러면 그림을 분할해서 사용할수 있습니다.

Pixel Per Unit는 기본값 100에서 타일맵사이즈인 32으로 변경합니다.

FilterMode를 Point(no filter)로 변경해 도트이미지의 가장자리가 선명하게 보이도록 합니다.

Apply를 클릭해 변경된 설정을 저장합니다.

Sprite Editor로 편집하기

[Sprite Editor]버튼을 눌러 Sprite Editor창을 엽니다. 한장의 그림을 여러 개로 나누는 편집창입니다.

[Slice] 탭버튼을 클릭해 이미지를 자동으로 분활하기 위한 설정을 합니다.

먼저 기준점을 설정하는 Pivot항목을 살펴봅니다. Multiple모드에서 분할할때 피봇을 설정해야 합니다. 하지만 이번에는 특별히 변경할 것이 없으므로 변경하지 않습니다.

다음은 Type 항목입니다.

Automatic은 이미지의 투명한 부분을 고려해 자동으로 분할 합니다.

Grid By Cell Size는 설정된 X Y 사이즈로 분할합니다.

Grid By Cell Count는 C R로 설정된 개수로 분할 합니다.

예제에 사용된 타일맵은 32x32로 제작되었으므로 Grid By Cell Size를 선택해 x:32 y:32로 설정해줍니다. 하단의 Slice를 클릭하면 이미지가 분할됩니다.

SpriteEditor 위쪽중간의 Apply를 클릭하면 0~29넘버링을 갖는 총 30개의 스프라이트가 프로젝트뷰에 생성됩니다. 

프로젝트뷰에서 TileMap오른쪽 화살표▶를 클릭하면 확인할 수 있습니다.

타일에셋만들기

타일팔레트로 타일에셋을 만듭니다. Window>2D>Tile Palette를 선택하면 Tile Palette창이 열립니다.

Tile Palette창은  타일맵으로 배치할 타일을 선택하는 창입니다. 

왼쪽위에 위치한 Create New Pallet를 클릭합니다. 이름을 StageMap으로 한후 Create버튼을 클릭하고 Map폴더에 저장합니다.

Tile Palette 탭을 잡고 드래그해서 인스펙터뷰 아래쪽에 적당해 놓습니다. 이후 TileMap이미지를 프로젝트부에서 끌어다 놓습니다. 타일 에셋 파일의 저장 경로 를 선택하는 창이 표시되는 Map폴더를 선택합니다.

타일 팔레트에 타일이 표시되고 타일 에셋 파일이 저장됐습니다.

타일맵 만들기

하이라키에서 + > 2DObjec t> Tilemap > Rectangular를 선택합니다. Grid와 자식으로 Tilemap게임 오브젝트가 추가됩니다.

계층뷰에서 Grid나 Tilemap을 선택하면 씬에 눈금이 표시됩니다. 타일맵에 배치될 타일의 위치입니다.

하이라키에서 타일맵을 선택하면 인스펙터뷰에서 Timemap Renderer 컴포넌트에서 Order in Layer가 있습니다. 타일맵이 여러개일때 레이어를 조정해 우선순위를 변경할 수 있습니다.

타일 에셋을 타일맵에 배치하기

타일 팔레트를 사용해 맵에 타일을 배치해보겠습니다. 먼저 월드맵을 만들어 봅니다.

Tile Pallet 창에 나열된 타일의 가장 왼쪽에 있는 바다 타일을 선택하고 툴 바의 왼쪽에서 세번째브러시 툴을 선택합니다. 신뷰에서 마우스를 클릭할 상태에서 드래그하면 선택한 타일이 그리드에 배치됩니다.

Tile Palette 툴바

Tile Palette 창의 상단에는 타일맵에 타일 에셋을 배치하기 위한 툴 바가 있습니다. 이 툴들을 사용해 타일맵을 배치합니다.

타일 회전 배치

키보드의 중괄호 [ , ]  를 누르면 타일을 90도씩 회전시킬수 있습니다. 

맵만들기

타일로 맵을 만들어 봅니다. 씬을 두개 만듭니다.  교재에서는 바다 위에 떠 있는 섬을 월드맵으로 해 던전 맵을 만들었습니다. 현재이름이 WorldMap입니다.

뒤에서 입구로 씬을 이동하는 기능을 추가할 것이니 적당한 위치에 입구를 하나 만듭니다. 이건 dungeon1으로 저장합니다.

타일맵에 충돌 판정 설정하기

캐릭터와 접촉했을때 충돌판정을 만들기 위해 하이라키에서 TileMap을 선택한후 Tilemap collider 2D 컴포넌트를 추가합니다. (첨부파일에는 이미 추가되어져 있습니다.)

타일맵에 충돌 판정이 추가됐습니다. 필요없는 지면 부분에도 충돌 판정이 생기니 다음과 같이 조정합니다.

프로젝트뷰에서 타일에셋을 선택하면 인스펙터뷰에서 Collider Type이라는 풀다운 메뉴를 선택할 수 있습니다.

이 값으로 충돌 타입을 선택할 수 있습니다.

None: 충돌판정이 없습니다.

Sprite: 스프라이트의 모양대로 충돌 판정을 합니다. 투명한 부분에는 충돌 판정이 없습니다.

Grid:타일의 사각형 모양으로 충돌 판정을 합니다.

예제에서 충돌 판정을 없앨 타일은 모래, 풀밭, 짙은 풀밭, 다리, 던전 바닥입니다. 해당 타일의 ColliderType을 None으로 설정합니다.  첨부된 파일에는 이미 설정이 되어져 있습니다.

자유로운 모양의 충돌 판정

Collider Type이 Sprite인 타일을 선택하고 [Sprite Editor]버튼을 누르면 Sprite Editor창이 열립니다. 이번에는 던전 출입구인 TipeMap_9을 선택했습니다.

Sprite Editor창의 왼족 위에 풀다운 메뉴에서 Custom Physics Shape를 선택하면 충돌 판정을 패스로 설절할 수 있어 플레이어가 출입구로 진입하는 방향을 제한할 수 있습니다. 스프라이트를 선택하고 Generate를 선택하면 해당 스프라이트의 주변에 사각형 포인터가 배치되고 흰선으로 테두리가 만들어집니다. 하얀테두리 영역이 충돌판정 범위가 됩니다.

네모서리의 사각형을 마우스로 드래그해 흰 테두리의 모양을 바꿀수 잇고 선을 클릭해 새로운 포인트를 만들고 delete키로 삭제가능합니다. 완료후 Apply로 저장합니다.  

던전 입구 뿐 아니라 다섯 종류의 계단 타일도 충돌 판정을 똑같이 설정합니다. 캐릭터가 계단에 진입할 곳외는 블록킹 처리 해줍니다.