엔트리 프로그래밍 - 걷는 애니메이션 만들기

캐릭터를 이동시키는데 예를 들어 오른쪽으로 움직일 때 

중간에 걷는 동작이 있으면 매우 자연스럽습니다.

이번에는 그런 애니메이션을 만들어 보겠습니다.

엔트리봇이 걷는 애니메이션 프로그래밍을 해보겠습니다.

엔트리봇 걷는 애니메이션

미션

1. 방향키를 누르면 그 쪽 방향을 바로본다.

2. 방향키를 누르면 걷는 동작을 한다.

3. 방향키 방향으로 캐릭터가 이동을 한다.

모양추가하기

▲ 걷는 애니메이션을 만들려면 먼저 왼쪽 오른쪽 이미지가 있어야 하는데 왼쪽 이미지가 없습니다. 

그래서 먼저 왼쪽 방향의 이미지를 만들어 보겠습니다.

1번 모양을 클릭하여 모양을 추가해 줍니다. 2번 [모양 추가]를 클릭하세요

▲ 걷는 모습 1과 2를 가져옵니다.

▲ 3번과 4번에 걷는 모습이 추가 되었는데요

이것을 반대 이미지로 만들어 보겠습니다.

▲ 3번 이미지를 선택한 다음 아래쪽에 있는 2번 아이콘을 클릭합니다.

▲ 이미지가 반대 방향으로 만들어 졌는데요 이것을 저장을 해야 적용이 됩니다.

3번 처럼 [파일-저장하기]를 클릭합니다.

▲ 3번 이미지가 변경된 것을 확인할 수 있습니다.

▲ 4번 이미지도 한번 만들어 3번 이미지 처럼 만들어 주세요

▲ 1번과 2번 이미지는 오른쪽 방향, 3번과 4번은 왼쪽 방향을 바라보는 이미지가 완성되었습니다.

블록코딩하기

▲ 방향키를 눌렀을 때 적용을 하면 되니 [시작]에서 [q키를 눌렀을때]블록을 가져옵니다.

그리고 오른쪽 방향키를 눌러줍니다.

▲ [오른쪽 화살표 키를 눌렀을 때] 블록이 완성 되었습니다.

▲ [생김새]블록에서 [~ 모양으로 바꾸기]블록을 가져옵니다.

▲ [흐름]에서 [~ 초기다리기] 블록을 가져와 시간을 변경해 줍니다.

 

▲ [~모양으로 바꾸기] 블록을 가져 옵니다.

▲ 이미지를 [엔트리봇_걷기2]로 변경해 줍니다.

시작하기를 클릭했을 때 처음 이미지가 오른쪽 방향에 있는 1번 이미지 이기 때문에

클릭했을 때 2번 모양으로 변경해 주는 것입니다.

▲ 0.2초동안 기다렸다가 걷기 1번 모양으로 다시 변경을 하면 걷는 이미지가 되겠지요

▲ 마지막에 [이동방향으로 ~ 만큼움직이기]블록을 넣으면 캐릭터도 이동을 하게 됩니다.

중간 실행 동영상

▲ 코드를 복사해서 붙여넣기를 선택합니다.

▲ 키보드 방향을 왼쪽으로 변경해줍니다.

▲ 걷는 모양도 아까 만들었던 걷기4로 변경합니다.

▲ 마지막 이미지도 변경합니다.

▲ 이동방향을 -10 주면 왼쪽 방향으로 캐릭터가 이동을 하게 됩니다.

▲ 완성된 코드입니다. 이동방향은 중간에 넣어도 큰 상관이 없습니다.

오늘도 즐거운 코등하시기 바랍니다.