[스크래치] 응용편 - 키보드 방향키에 따라 캐릭터 움직이기

캐릭터의 이동

일반적으로 상하좌우로 움직이는 개념을 2차원(2D)이라고 합니다. 여기에 깊이를 더한 것을 3차원(3D)라고 하죠. 스크래치에서 3차원 게임을 만들기는 어렵고, 2차원 게임을 쉽게 만들 수 있습니다. 키보드의 방향키대로 캐릭터가 움직이는 것을 2차원으로 만드는 것이죠.

개념 이해하기

그런데 '방향키가 눌린① 방향②으로 움직인다③'라는 것을 프로그래밍 차원에서 해석할 줄 알아야 합니다.
① 방향키가 눌린다는 것은 키보드 이벤트를 의미합니다.
② 방향은 가로축 왼쪽, 오른쪽과 세로축 위와 아래 방향을 의미합니다.
③ 움직인다는 것은 캐릭터가 말 그대로 이동한다는 것입니다.

아래 좌표계는 스크래치의 X, Y축 좌표계를 의미합니다. 학창 시절에 배운 수학 개념을 떠올려 보세요.

위 그림에서 '캐릭터가 앞으로 움직인다'라는 것은 X축 + 방향으로 좌표를 0~240까지 이동한다는 것입니다. 반대로 '캐릭터가 뒤로 움직인다'라는 것은 X축 - 방향으로 좌표를 0~240까지 이동한다는 의미겠죠?

위, 아래 방향도 마찬가지입니다. Y축 + 방향 또는 - 방향으로 0~±180으로 이동한다는 것이죠.

먼저 학습하기

1. 키보드 이벤트

아래 포스팅에서 '키보드가 눌렸을 때'를 학습하세요.

[스크래치] 기초편 - 이벤트 종류 별 동작 이해하기

이벤트(Event)는 사건! 프로그래밍에서 이벤트란 어떤 사건이 일어났음을 의미합니다. 표현이 다소 사전적이죠? 쉽게 얘기하면, '키보드가 눌렸다'와 같이 무언가가 발생했다는 것을 의미합니다.

kidscoding.tistory.com

2. 캐릭터 모양

캐릭터의 모양을 추가하기 위해 아래 포스팅을 학습하세요.

[스크래치] 기초편 - 캐릭터와 모양 추가, 삭제하는 방법

캐릭터와 모양 스크래치는 캐릭터와 배경을 꾸밀 수 있습니다. 내가 직접 캐릭터나 배경을 만들 수도 있고, 스크래치에서 제공하는 캐릭터나 배경을 선택할 수 있습니다. 하지만 기본으로 제공

kidscoding.tistory.com

따라 하기 1

코드는 다음과 같이 구성합니다. 키보드 이벤트를 추가하고, 각 방향대로 x좌표 또는 y좌표를 ±10만큼 이동하게 했습니다.

아주 간단하죠? 이렇게 구성하고 깃발 아이콘을 클릭하지 않아도 방향키만 누르면 캐릭터가 움직입니다. 본 포스팅의 맨 위에 있는 애니메이션과 같습니다.

따라 하기 2

뒤(X축 - 방향)로 이동할 때 캐릭터가 뒤돌았으면 좋겠네요. 즉, 왼쪽 방향키를 누르면 캐릭터가 왼쪽을 바라보고 이동하고, 오른쪽 방향키를 누르면 캐릭터가 오른쪽을 바라보고 이동하는 것이죠.

우선 왼쪽을 바라보는 캐릭터 모양을 추가합니다. 기존 모양에서 '좌우 뒤집기'로 쉽게 모양을 생성할 수 있습니다.