[Unity3D] 헥사게임 만들기 두 번째- 블럭보드 만들기2

※ 소스 출처 : 네이버 카페 - 유니티 허브 - 햐얀바람님.



0. 리소스 준비하기.


1). 배경 이미지.

2). 블럭보드의 배경 이미지.

3). UI테두리 이미지.

4). 블럭 이미지.



1. 캔버스 크기 설정하기.

- 게임뷰어 및 캔버스 크기 설정.



2.  블럭보드 만들기.

1). 블럭 프리팹 만들기.

2). 배경 이미지 깔기.
3). 블럭배경 이미지 깔기.
4). 스크립트로 블럭 만들기.


3.  블럭 처리.
1). 가로 및 세로 체크 함수 만들기.
2). 매치된 블럭이 있는지 없는지 체크하는 함수 만들기.
3). 블럭 삭제 함수 만들기.
4). 떨어지는 블럭 함수 만들기.


4.  마우스 처리.
1). 마우스 클릭처리 함수 만들기.
2). 마우스 방향에 따른 블럭 가져오는 함수 만들기.
3). 선택된 블럭을 마우스가 이동한 방향에 있는 블럭과 교환(이동)시키는 함수 만들기.
4). 선택된 블럭과 이동 방향에 존재하는 블럭의 위치 교환 및 타입교환하는 함수 만들기.
5). 블럭 교환 후 매치된 블럭이 없을 때 다시 교환 시켜주는 함수 만들기.


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

2.  블럭보드 만들기.

아무래도 배경이 없는건 심심하니

기본적인 배경부터 넣고 블럭보드를 스크립트를 통해 만들어 봅시다.



(7).



하이러키 창에 빈 오브젝트를 하나 만들어 주고,

빈 오브젝트의 이름을 Map으로 하고 Transform컴포넌트를 Reset해 기본값으로 셋팅합니다.


이 오브젝트에는 배경 이미지 및 블럭보드의 배경 이미지 등이 자식으로 들어갈 겁니다.



(8).



프로젝트창 > 마테리얼 폴더 > 마테리얼을 하나 만들어 줍니다.

이름은 'BackGround'가 좋겠군요.



(9).



마테리얼의 셰이더를 Unlit > Texture로 바꿔 줍니다.



(10).



BackGround 이미지를 마테리얼에 드래그 하여 넣습니다.



(11.)




만들어 놓은 마테리얼을 클릭 한 뒤 Ctrl + D를 눌러 복사한 후.

복사된 마테리얼의 이름을 BlcokBoad_Bg로 바꾸고

ui_BackGround 이미지를 드래그하여 넣습니다.



(12).



마테리얼 작업이 완료되면 하이러키창에 Quad객체를 만듭니다.

이 객체안에 열심히 작업한 마테리얼을 넣어 배경을 만듭시다.

그리고 배경의 크기는 적당히 조절해 줍시다.



(13).



테두리는 월드상에 있는 오브젝트들이 이동해도 영향을 받지않게 캔버스(UI)에 작업해줍시다.



(14).



이제 위와같이 블럭이 만들어지도록 스크립트를 짜봅시다.




동영상을 따라해 봅시다.


동영상에서는 실수로 코드 한 줄을 빼먹었네요.

GameManager스크립트에 CreateBlock()함수에서 밑의 구문을 추가해주세요.


1
BlockBoard[x][y] = iType;
cs




1
2
public int iBlockX, iBlockY;        // 블럭보드의 가로 세로 크기.
public int[][] BlockBoard;          // 블럭보드.
cs




블럭보드는 가로 세로의 크기를 받아 2차원 배열로 만들어 졌습니다.

그림으로 보자면 밑과 같은 그림이 되겠군요.



그렇다면 2차원 배열에는 어떤 정보가 들어갔을까요?

바로 블럭의 종류값이 들어갔습니다. 그림으로 보자면 밑과 같습니다.



이러한 값들이 들어간 이유는 같은 블럭이 3개이상 연속됐을 때 삭제해 주기 위함입니다.




실제 삭제를 위해서는 2차원 배열에 들어있는 값들을 비교하고 연속된 숫자가 나왔을 때

해당 위치에 있는 블럭을 삭제해야 합니다. 그러면 그 위치 값은 어디에 있을까요?


바로 블럭 자신이 가지고 있습니다.

블럭 스크립트의 일부분을 보면


1
2
public int iX, iY;      // 블럭의 위치.
public int iType;       // 블럭의 종류.
cs

위와 같은 정보를 가지고 있습니다.


위치 뿐만 아니라 종류까지도 비교해서 검사하면 됩니다.

이 부분은 후에 '블럭삭제'부분에서 다룰려고 합니다.


블럭의 위치를 그림으로 보자면 밑과 같이 되어있습니다.

이렇게 된 이유는 2중 for문으로 블럭을 생성해줄 때 블럭보드의 가로 및 세로의 크기가

그대로 위치 정보로 들어갔기 때문입니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
for (int y = 0; y < iBlockY; y++)
{
    for (int x = 0; x < iBlockX; x++)
    {
        GameObject block = Instantiate(OriginBlock, new Vector3(x, y, 0), Quaternion.identity);
        block.transform.SetParent(transform);
 
        int iType = Random.Range(0, BlockType.Length);
 
        Block sBlock = block.GetComponent<Block>();
        sBlock.iX = x;
        sBlock.iY = y;
        sBlock.iType = iType;
        sBlock.SetBlockImg(BlockType[iType]);
 
        BlockBoard[x][y] = iType;
    }
}
cs


그림으로 보자면 위의 2중 for문은 밑의 그림과 같은 순서로 생성시킵니다.



즉, 월드상의 블럭의 위치 값도 ( x , y, z )일 때 (0,0,0), (1,0,0), (2,0,0) ... 와 같이 셋팅 됩니다.


위의 정보를 봤을 때 블럭과 블럭의 사이에 거리가 1이 된다는 뜻인데, 블럭 이미지의 크기가 다를 경우에

밑과 같이 딱 나뉘어 떨어지지 않습니다.



그러한 사태를 방지하기 위해 리소스 준비단계에서 블럭의 크기를 100픽셀로 맞춰 만든 것입니다.

100픽셀 == 1 Scale == 1 Position 이라고 생각하면 헷갈림이 조금 덜 할듯 합니다.


다음은 블럭의 가로 세로 체크를 해보도록 하겠습니다.