지난 글에서는 타일을 선택하고, 인접한 타일과 위치를 바꾸는 기능을 구현해봤는데요 🙂
아직 드래그 방식은 아니었지만, 클릭 방식으로 두 타일이 정상적으로 스왑되는 것까지 확인했습니다.
이번 글에서는 매치-3 게임의 핵심이라고 할 수 있는 **매칭 판정**을 구현해보려고 합니다.
즉, 스왑이 일어난 뒤 같은 색상의 타일이 가로 또는 세로로 3개 이상 이어져 있는지 확인하는 기능입니다.
아직 타일이 사리지거나, 위에서 내려오거나, 새로운 타일이 생성되는 단계까지는 가지 않습니다.
오늘의 목표는 아래와 같습니다.
**같은 타일이 3개 이상 이어졌는지 찾고, 매칭된 타일을 화면에서 확인할 수 있게 만드는 것**
# 오늘의 목표 정리
이번 작업을 시작하기 전에 AI Codex와 오늘 구현할 범위를 먼저 정리해볼게요
이것 저것 말은 많지만 결론만 정리하자면 이렇습니다.
- 스왑 이후 보드 전체 검사하기
- 가로 방향으로 같은 타일 3개 이상 찾기
- 세로 방향으로 샅은 타일 3개 이상 찾기
- 매칭된 타일을 화면에 표시하기
- Console에 매칭된 타일 수 출력하기
처음부터 타일 제거, 낙하, 새 타일 생성까지 모두 구현하고 싶었지만 이번에도 작업 범위를 나누기로 했습니다.
매치-3 게임은 이전 글에서도 단순하지만 여러 기능이 순서대로 연결되어 있다고 언급했었는데요.
오늘은 그 여러 기능 중 두 번째 단계인 **매칭 판정** 단계 까지만 진행하도록 하겠습니다.
# 수정한 파일과 기능
~ TileView.cs ~
‘TileView.cs’에는 매칭된 타일을 표시하는 기능을 추가했습니다.
기존에는 선택한 타일을 흰색 테두리로 표시하고 있었는데요. 이번에는 검은색 테두리를 추가해서 가로/세로 매칭된 타일을 구분하는 기능을 추가되었죠
- 흰색 테두리 : 현재 선택된 타일
- 검은색 테두리 : 매칭 판정에 걸린 타일
나중에는 타일이 사라지는 애니메이션과 이펙트로 바뀌겠지만, 지금 단계에서는 기능 점검만을 위해서 검은색 테두리로만 표시하겠습니다.
~ BoardView.cs ~
‘BoardView.cs’에는 실제 매칭 판정 로직을 추가했습니다.
이번에 추가한 기능은
- 스왑이 끝난 뒤 매칭 검사 실행
- 가로 방향으로 같은 타일이 3개 이상 이어졌는지 확인
- 세로 방향으로 같은 타일이 3개 이상 이어졌는지 확인
- 매칭된 타일을 중복 없이 모으기
- 매칭된 타일에 검은색 테두리 표시
- Console에 ‘Match count’ 출력
여기서 중요한 점은 매칭된 타일을 중복 없이 처리해야 한다는 점이에요
예를 들어 가로와 세로가 동시에 맞는 십자 형태의 매칭이 생길 수도 있기 때문에 가운데 타일은 가로 매칭과 세로 매칭 모두에 포함되는 문제가 발생하게 되는거죠
즉, 십자 형태의 매칭이 생겼을 때 ‘Match count’로 봤을 때 가운데 타일이 가로/세로 모두 count 되어서 5가 아닌 6으로 처리되는 문제가 발생해요.
그래서 매칭된 타일을 모을 때는 중복이 생기지 않도록 처리가 필요했습니다.
# 첫 번째 테스트에서 발견한 문제
매칭 판정 기능을 넣고 테스트를 진행하던 중 한 가지 문제를 확인하게 되었는데요.
처음 Play를 눌렀을 때 랜덤으로 생성된 보드 안에 이미 같은 색상을 타일이 3개 이상 이어져 있는 경우가 있었습니다.
또한 이 타일들이 처음 매칭된 상태에서는 검은색 테두리로 표시하지 않는데 이건 기능상 매칭으로 처리하지 않고 있다는 것이죠.
이런 현상은 당연하다면 당연한게 보드의 타일 배치는 랜덤으로 진행하고 예외 처리를 하지 않고 있으며, 매칭 검사는 스왑이 일어난 뒤에만 실행되도록 되어 있기 때문입니다.
즉, 처음 보드가 생성될 때 이미 매칭된 타일이 있어도 아무 표시가 없다가, 이후 어떤 타일이든 스왑해서 매칭 검사가 실행되면 기존에 있던 매칭까지 한번에 처리되어서 검은색 테두리로 표시되는 현상을 볼 수 있죠
“스왑 이후 검사하면 되지 않을까?”라고만 생각했던 부분이었는데 실제로 테스트해보니 초기 보드 생성도 따로 신경 써야 한다는 것을 알게 되는 경험이었습니다.
# 초기 보드에 매칭이 생기지 않도록 수정
일반적인 매치-3 게임에서는 어떤지 몰라도 제가 생각하고 있는 게임에서는 처음 보드가 생성될 때 이미 매칭된 타일이 있는 경우를 피해야 하는 편입니다.
처음부터 3개 이상 맞춰진 상태로 시작하면 플레이어가 아무 행동도 하지 않았는데 매칭이 발생하고 내가 공격을 하고 싶지 않은데 공격 타일이 매칭되어서 공격이 나가는 슬픈 상황이 발생할 수 있죠
그래서 보드 생성 방식을 수정했습니다.
기존에는 타일 타입을 완전히 랜덤으로 정했습니다.
하지만 수정 후에는 타일을 하나씩 생성할 때 아래 조건을 확인하도록 했습니다.
- 왼쪽 2칸과 같은 타입이면 제외
- 위쪽 2칸과 같은 타입이면 제외
예를 들어 새로 생성하려는 타일이 빨간색이라고 했을 때, 바로 왼쪽 두 칸이 모두 빨간색이면 그 자리에 빨간색을 넣지 않는 방식입니다.
세로 방향도 마찬가지입니다.
위쪽 두 칸이 같은 색상이라면, 그 색상은 현재 위치에 들어가지 않도록 처리했습니다.
이렇게 하면 초기 보드가 생성될 때부터 가로 또는 세로로 3개 이상 같은 타일이 이어지는 상황을 막을 수 있습니다.
~ 수정 후 테스트 ~
수정 후 Play를 눌러 확인 결과, 처음 보드가 생성되었을 때 가로 또는 세로로 같은 색상이 3개 이상 이어진 부분이 보이지 않았습니다.
그 외에도 수정 후 타일 매칭(검은색 테두리 표시), Match count 표시 등 문제 없는 것을 확인했죠
# 이번 작업에서 확인한 것
이번 작업을 통해 확인한 내용은 아래와 같습니다.
- 초기 보드 생성 시 3개 이상 같은 색상이 이어지지 않음
- 스왑 후 새로 만들어진 매칭만 표시됨
- 가로 3개 이상 매칭 확인 가능
- 세로 3개 이상 매칭 확인 가능
- 4개 이상 매칭도 정상적으로 감지됨
- Console의 ‘Match count’가 실제 매칭된 타일 수와 일치함
아직 타일이 사라지거나 위에서 내려오는 기능은 없지만, 매치-3 게임의 핵심 중 하나인 “같은 타일을 찾는 기능”이 들어갔다는 점에서 의미 있는 단계였습니다.
# 오늘 작업에서 느낀 점
오늘 작업을 하면서 느낀 점은, 매치-3 게임은 겉보기보다 신경 써야 할 부분이 많다는 것입니다.
단순히 같은 색상 3개를 찾으면 된다고 생각했지만, 실제로는 초기 보드 상태부터 고려해야 했죠
처음부터 매칭된 타일이 있어도 되는지, 안 된다면 어떻게 막을지, 스왑 이후에는 어떤 타일만 검사할지 같은 부분을 생각해야 했습니다.
이번에는 보드 전체를 검사하는 방식으로 구현했습니다.
아직 보드 크기가 6×6이기 때문에 전체를 검사해도 큰 부담은 없었지만 나중에 보드 크기가 커지거나 기능이 많아지면, 스왑한 위치 주변만 검사하는 방식도 고민해볼 수 있을 것 같습니다.
하지만 지금 단계에서는 전체 보드를 검사하는 방식이 더 단순하고 이해하기 쉬워서 이 방식으로 진행하겠습니다.
# 다음 목표
다음 단계에서는 매칭된 타일을 실제로 제거하는 기능을 만들어볼 예정입니다.
다음 작업 목표는 아래와 같습니다.
- 매칭된 타일 제거하기
- 제거된 자리를 빈칸으로 처리하기
- 빈칸을 화면에서 확인할 수 있게 만들기
- 이후 낙하 처리와 새 타일 생성으로 이어질 구조 잡기
아직 바로 낙하까지 구현할지는 정하지 않았지만, 우선은 매칭된 타일을 지우고 빈칸이 생기는 것부터 확인해볼 생각입니다.
그러면 게임 개발 일지는 다음 편에서 이어가겠습니다.
답글 남기기