스크래치 코딩 ~키보드 방향키를 눌러 캐릭터 움직이기

이제 슬슬 실전으로 가보도록 하겠습니다.

이번글에서는 키보드의 방향키를 이용해서

기본 스프라이트인 고양이를 움직이는 코딩을 해보도록 하겠습니다.

일단 간단하게 스크래치의 작업공간을 둘러보도록 하겠습니다.

코딩을 하기 위해서는 블록영역의 블록을 선택 후

마우스를 드래그 해 스크립트 영역으로 블록을 옮겨놓으면 됩니다.

실행되는 모습은 무대영역을 통해 볼 수 있습니다.

무대영역에 표시된 그림을

스크래치에서는 스프라이트라고 합니다.

그림을 추가하거나 편집하기 위해서는 스프라이트 영역을 이용합니다.

무대영역의 배경을 바꾸고 싶다면

무대선택 영역에서 변경하면 됩니다.

본격적으로 코딩을 하기 전에 한가지를 먼저 해봅시다.

알고리즘을 짜는 것인데요.

모든 프로그램을 만들기 전에는 알고리즘을 짜는 것을

습관화하는게 중요합니다.

알고리즘이란

사전적인 의미로는 문제를 해결하기 위한

방법이나 절차를 공식으로 표현한 것을 말합니다.

간단하게 말하자면

만들기 전에 어떻게 만들지 계획을 세우는 작업이죠.

이렇게 알고리즘을 쌓는 것을 습관화해두면

일상 생활을 할 때에도 어떤 일을 할 때

계획을 짜고 일을 시작하는 습관도 함께 생기게 됩니다.

그럼 이번 프로그램의 알고리즘은 어떻게 될까요?

간단하게 한번 짜보도록 합시다.

프로그램 시작

키보드로 입력을 받는다.

방향키가 위쪽일 경우에는 스프라이트를

위쪽 방향으로 이동시킨다.

방향키가 아래쪽일 경우에는 스프라이트를

아래쪽 방향으로 이동시킨다.

방향키가 왼쪽..

방향키가 오른쪽..

프로그램 끝

아주 심플한 알고리즘이 만들어졌습니다.

그럼 코딩을 시작해볼까요?

시작블록(Hat Block) 이동

알고리즘의 첫번째 항목이였던 키보드를 입력받는 부분을 만들어봅시다.

"스페이스 키를 눌렀을때" 라고 되어있는 시작블록을

스크립트 영역으로 이동시킵니다.

마우스 오른쪽 버튼으로 스크립트 영역의 블록을 클릭하면

복사하기 / 주석 넣기 / 블록 삭제하기가 나옵니다.

키보드의 방향키는 위 / 아래 / 왼쪽 / 오른쪽 네방향이 있으므로

네개를 복사해봅니다.

"스페이스"라고 쓰여진 부분을 클릭하면

키보드의 키를 지정할 수 있습니다.

네개의 시작블록에 각각의 방향을 지정해봅시다.

이제 키보드를 눌렀을 때의 시작로직이 만들어졌습니다.

그럼 다음은 방향키가 ~일때 ~쪽으로 이동시킨다.

라는 알고리즘에 따라서 작업을 해야겠죠?

먼저 좌표에 대해서 한번 짚고 넘어가도록 하겠습니다.

스크래치의 좌표는 위의 그림처럼 이루어져 있습니다.

가운데의 (0,0)을 기준으로 480 x 480의 크기입니다.

이렇게 좌표를 알면 스프라이트를 움직이는건 쉽겠죠?

위쪽 방향키일때는 Y좌표를 증가시켜주고

아래쪽 방향키일때는 Y좌표를 감소시켜줍니다.

오른쪽 방향키일때는 X좌표를 증가시켜주고

왼쪽 방향키일때는 X좌표를 감소시켜주면 되겠죠?

쌓기블록(Stack Block) 이동

좌표를 이동시킬 때 사용하는 쌓기 블록(Stack Block)를

위의 그림처럼 각각 조립해줍니다.

10 이라는 숫자가 들어있는 부분은 클릭해서 조정이 가능합니다.

방향키에 맞게 각각 조정해보도록 합시다.

다 됐으면 키보드의 방향키를 눌러보도록 합시다.

무대영역의 고양이가 상하좌우로 움직이는 것을 볼 수 있습니다.

1차 실행

이런식으로 방향키에 따라서 스프라이트가 움직입니다.

뭔가 좀 허접한 것 같죠?

변화를 한번 줘보도록 하겠습니다.

이번에는 움직임에 맞춰 스프라이트의 발이 움직이도록 해봅시다.

각 방향키 로직 블록에 "다음모양으로 바꾸기" 쌓기 블록을

추가해봅시다. 그럼 어떻게 변할까요?

2차 실행

아주 흥겹게 움직이는 고양이의 모습을 볼 수 있습니다.
문워크도 하는군요.

이번 글에서는 방향키를 이용해서

스프라이트를 움직이는 방법에 대해 알아봤습니다.

아주 기초적인 내용이였지만 잘 이해가 안되거나

궁금한 사항이 있으시면 댓글로 남겨주세요.

힘이 닿는한 성실하게 답변해드리도록 하겠습니다.