20강타일맵과 레벨 제작

왜 타일맵인가#

스테이지를 Sprite2D 수백 개로 만들면 이렇게 됩니다.

• 씬 파일이 거대해지고 에디터가 느려짐
• 벽 하나하나에 콜라이더를 붙여야 함
• 드로우 콜이 수백 개 (6강)
• 맵을 고치려면 노드를 일일이 옮겨야 함

타일맵은 이 전부를 해결합니다.

1) 타일셋 만들기#

타일셋(TileSet) 은 "쓸 수 있는 타일들의 목록"입니다.

1. TileMapLayer 노드 추가
2. 인스펙터의 Tile Set → New TileSet
3. 하단 TileSet 패널이 열림
4. 좌하단 + 로 아틀라스 추가 → 타일 이미지(.png) 지정
5. 타일 크기 지정 (예: 16×16, 32×32)
6. "타일을 자동으로 만들까요?" → 예

2) 맵 그리기#

TileMapLayer 노드를 선택하면 하단에 TileMap 패널이 나옵니다.

Shift를 누르고 드래그하면 직선, Ctrl을 누르면 지우기로 전환됩니다.

3) 충돌 붙이기#

이게 타일맵의 진짜 힘입니다.

1. TileSet 패널 → 좌측 물리 레이어(Physics Layers) → + 로 레이어 추가
2. 레이어의 Collision Layer를 world(1번)로 설정 (11강)
3. 상단 탭을 선택(Select) 으로 바꾸고 타일 하나를 클릭
4. 좌측 속성에서 Physics → Polygon 항목의 편집기를 열어 타일 위에 다각형을 그림
5. 사각형 타일이면 "사각형 자동 생성" 버튼 한 번이면 끝

4) 터레인(오토타일) — 모서리 자동 처리#

벽을 그릴 때 가장 귀찮은 게 모서리와 가장자리입니다. 왼쪽 끝, 오른쪽 끝, 안쪽 모서리, 바깥 모서리… 종류가 십수 개입니다.

터레인(Terrain) 을 설정하면 주변 타일을 보고 알맞은 모양을 자동 선택합니다.

1. TileSet 패널 → 터레인 세트(Terrain Sets) → +
2. 모드를 Match Corners and Sides 로 설정
3. 터레인 하나 추가하고 이름을 땅으로
4. 선택 탭에서 각 타일을 고르고 Terrains → Terrain 항목에서 그 타일의 어느 부분이 땅인지 페인트로 칠함
5. TileMap 패널의 Terrains 탭에서 그리면 자동으로 모양이 결정됨

여러 레이어로 나누기#

한 화면에 여러 TileMapLayer를 겹칩니다.

World                 (Node2D)  Y Sort Enabled
├─ Background         (TileMapLayer)  z_index -10, 충돌 없음
├─ Ground             (TileMapLayer)  z_index  0,  충돌 있음
├─ Decoration         (TileMapLayer)  z_index  5,  충돌 없음
├─ Player
├─ Enemies
└─ Foreground         (TileMapLayer)  z_index 20, 캐릭터를 가림

코드에서 타일 다루기#

extends TileMapLayer

func _ready() -> void:
	# 타일 좌표 (3, 5)에 아틀라스 (0,0) 타일 놓기
	set_cell(Vector2i(3, 5), 0, Vector2i(0, 0))

	# 지우기
	erase_cell(Vector2i(3, 5))

	# 그 칸에 뭐가 있는지
	var src := get_cell_source_id(Vector2i(3, 5))
	if src == -1:
		print("빈 칸")

# 픽셀 좌표 ↔ 타일 좌표 변환
func world_to_tile(p: Vector2) -> Vector2i:
	return local_to_map(to_local(p))

func tile_to_world(t: Vector2i) -> Vector2:
	return to_global(map_to_local(t))

func speed_multiplier_at(pos: Vector2) -> float:
	var cell := local_to_map(to_local(pos))
	var d := get_cell_tile_data(cell)
	if d == null:
		return 1.0
	return d.get_custom_data("speed_mul")

실습 — 스테이지 한 판#

# 타일맵 크기에서 카메라 리미트를 자동 계산
func fit_camera_to_map(map: TileMapLayer, cam: Camera2D) -> void:
	var used := map.get_used_rect()
	var cell := Vector2(map.tile_set.tile_size)
	var top_left := map.to_global(
		map.map_to_local(used.position) - cell * 0.5)
	var bottom_right := map.to_global(
		map.map_to_local(used.end) - cell * 0.5)
	cam.limit_left = int(top_left.x)
	cam.limit_top = int(top_left.y)
	cam.limit_right = int(bottom_right.x)
	cam.limit_bottom = int(bottom_right.y)

다음 강의 — 스테이지가 생겼습니다. 이제 타이틀 → 게임 → 결과 로 이어지는 게임 전체 흐름과 저장을 만듭니다. P5의 마지막입니다.