취미로 시작하는 코딩 - 프로세싱

스케치북을 넘겨보자

 

이제 우리는 우리의 프로세싱 그림이 움직이게 하려고 합니다.

움직인다는것은 무엇일까요?

움직인다는것은 현상태에서 무엇인가 변화하고 그 변화된 상태가 계속 갱신되어 보여진다는 특징을 갖습니다.

혹시 애니메이션을 만드는 방법을 아시나요?

학창시절 교과서 귀퉁이에 그렸던 움직이는 낙서를 생각해 보세요.

책장 귀퉁이를 연속해서 넘기면 마치 살아움직이는 것처럼 움직였던 그림들이 기억 나시나요?

우리도 우리의 코드를 움직이게 하기 위해서 비슷한것을 해보려고 합니다.

그러기위해서는 교과서 귀퉁이를 넘기듯 우리의 프로세싱 스케치북을 넘겨줄 새로운 코드가 필요한데요,

그것이 바로 프로세싱에서 가장 중심이 되는 함수

setup과 draw함수 입니다. (*완벽하게 일치하지는 않지만 함수=명령어라고 일단 생각해주세요.)

이전 수업에서 지금까지 사용했던 코드들을 프로세싱으로 실행하면 그 과정은 

위에서 아래로 한번 쭉 읽어내려가면서 코드를 실행하고 더이상은 변화가 일어나지 않습니다.

여기에 우리가 setup과 draw함수를 추가하게 되면 실행과정에 근본적인 변화가 일어나게 되는데요,

그것은 바로 프로세싱이 우리의 코드를 한번만 읽고 끝내는것이 아니라

매 순간 코드를 반복적으로 읽고 실행을 하게된다는 것입니다.

마치 스케치북을 다음장 다음장 넘겨서 새로 그리듯이 말이죠,

이 때 setup 함수 안에들어간것은 한번만, draw함수 안에 들어간 코드들은 반복적으로 실행되게 되는데,

이부분을 잘 생각하여 한번만 실행이 필요한 부분은 setup에,

여러번 실행이 필요한 부분은draw 안에 그 코드를 넣어주면 됩니다.

양치질을 예로 들면 치약을 칫솔에 짜는 행동은 한번만, 칫솔을 좌우로 양치질을 하는 행동은

여러번 반복적으로 해야하기때문에, 치약을 짜는 행동은 setup에

양치질을 하는 행동은  draw에 넣어야 한다라고 말할 수 있겠죠.

자 그럼 이제 setup과 draw함수를 이전에 만들었던 코드에 적용을 시켜볼까요?

이전 코드에 setup과 draw를 추가하고 실행하면 놀랍게도..

 

변화가 없습니다...

 

하지만 프로세싱 내부적으로는 놀라운 변화가 일어났는데요,

이전코드에서는 여러분의 그림을 한번만 그리고 끝냈다면,

지금 코드에서는 매 순간 여러분의 그림을 새롭게 프로세싱이 그리고있을 것입니다.

물론 같은 그림을 계속 똑같이 그리기때문에 겉으로 봤을때는 달라진 부분이 없습니다.

하지만 여러분의 코드는 비로소 이제 움직일 준비가 되었습니다.

다음 수업을 통해서 이제 정말로 코드가 화면속에서 움직이게 하기위해서는 무엇이 필요한지 알아보겠습니다.

 

 

 

댓글

댓글 본문
  1. 망원경
    잘보고 갑니다~!
버전 관리
입문왕
현재 버전
선택 버전
graphittie 자세히 보기