[TIL] 타일맵 구현하기(2)

muchan
muchan
∙∙조회 13
[TIL] 타일맵 구현하기(2)

이전 타일맵 구현하기(1)을 이어서 작성하겠습니다

타일맵 구현하기(1)

미방문 지역 안개 처리하기

우선 autoTile sprite와 마찬가지로 미방문 지역에 해당하는 안개타일 sprite가 존재
-> 4bit로 표현

Tile에서 안개처리하는 코드를 작성하였으니 참고

  • autoFowTileId
  • UpdateAutoFowTileId()

Map.cs의 Init함수 안에 아래 코드를 추가하여 FowTile도 초기화한다

csharp
for (int i = 0; i < tiles.Length; i++)
        {
            tiles[i].UpdateAutoTileId();
            tiles[i].UpdateAutoFowTileId();
        }

Stage.cs에 수정된 함수들

csharp
    public void DecorateTile(int tileId)
    {
        var tile = map.tiles[tileId]; // 데이터
        var tileGo = tileObjs[tileId]; // 게임 오브젝트
        var ren = tileGo.GetComponent<SpriteRenderer>();

        if (tile.isVisited)
        {
            if (tile.autoTileId != (int)TileTypes.Empty)
            {
                ren.sprite = islandSprites[tile.autoTileId];
            }
            else
            {
                ren.sprite = null;
            }
        }
        else
        {
            ren.sprite = isFowSprites[tile.autoFowTileId];
        }

        tile.UpdateAutoFowTileId();
    }

    public void OnTileVisited(int tileId)
    {
        OnTileVisited(map.tiles[tileId]);
    }

    public void OnTileVisited(Tile tile)
    {
        int centerX = tile.id % mapWidth;
        int centerY = tile.id / mapWidth;

        for (int i = -visitRadius; i <= visitRadius; i++)
        {
            for (int j = -visitRadius; j <= visitRadius; j++)
            {
                int x = centerX + j;
                int y = centerY + i;
                if (x < 0 || x >= mapWidth || y < 0 || y >= mapHeight)
                    continue;

                int id = y * mapWidth + x;
                map.tiles[id].isVisited = true;
                DecorateTile(id);

            }
        }

        var radius = visitRadius + 1;

        for (int i = -radius; i <= radius; i++)
        {
            for (int j = -radius; j <= radius; j++)
            {
                if (i == radius || i == -radius || j == radius || j == -radius)
                {
                    int x = centerX + j;
                    int y = centerY + i;
                    if (x < 0 || x >= mapWidth || y < 0 || y >= mapHeight)
                        continue;
                    int id = y * mapWidth + x;


                    // 여기 수정
                    map.tiles[id].UpdateAutoFowTileId();
                    DecorateTile(id);
                }
            }
        }
    }
  • DecorateTile(): 방문된 노드라면 기존 로직과 똑같이 islandSprites에 해당하는 스프라이트를 할당하고 방문하지 않은 노드라면 isFowSprites를 할당하여 안개 처리를 한다. 이후 UpdateAutoFowTileId() 호출
  • OnTileVisited(): 우선 플레이어의 Radius 범위만큼 isVisited를 true로 설정해 islandSprites를 할당한다. 이후 그 주변 (adjacents) 타일들의 autoFowTileId를 업데이트 해준다

PlayerMovement.cs에 아래 코드 추가

csharp
    public void MoveTo(int tileId)
    {
        if (coMove != null)
        {
            StopCoroutine(coMove);
            coMove = null;
        }

        coMove = StartCoroutine(MoveCoroutine(tileId)); // Lerp 이동 시작
    }

    private IEnumerator MoveCoroutine(int tileId)
    {
        isMoving = true;
        animator.speed = 2f;
        Vector3 startPos = transform.position;
        Vector3 endPos = stage.GetTilePos(tileId);
        float elapsed = 0f;
        float duration = 1f / moveSpeed;

        while (elapsed < duration)
        {
            elapsed += Time.deltaTime;
            transform.position = Vector3.Lerp(startPos, endPos, elapsed / duration);
            yield return null;
        }

        transform.position = endPos; // 정확한 위치로 보정
        currentTileId = tileId;
        isMoving = false;
        coMove = null;
        animator.speed = 0f;
        stage.OnTileVisited(tileId);
    }
  • MoveTo(): 해당 타일로 이동하는 함수. 코루틴을 사용하여 움직임을 구현
  • MoveCoroutine(): 타일 한칸을 이동하는 코루틴. Lerp 함수를 통해 자연스럽게 움직이며 OnTileVisited를 호출해 타일들을 업데이트 해준다

결과

플레이어 반경을 2로 설정하여 플레이어 기준 상하좌우 +2칸씩 맵이 보이게 된다

아래로 한칸 움직이면 숨겨졌던 타일들이 나오게 된다