App Inventor Story: 제 7 장 잠자리 회전 및 전진 애니메이션 3 (블록에디터창 작업)

6. 구성요소에 활력 불어넣기

1. 블록에디터를 오픈하고 사용자블록(My Blocks)탭을 선택하면 상기 디자이너 창에서 작업한4개의 클록, 캔버스, 드래곤피그(잠자리), 통보자 및 스크린 등에 각각 대응하는 복수의 드로워(Drawer)가 나타난다. 이외에도, 나중에 설명하는 바와 같이 변수블록 등을 정의할 때에 자동생성되는 블록을 저장하는 사용자정의(My Definitions)드로워가 나타난다.

2. 스크린의 초기화이벤트핸들러에 대해 설명한다.

2-1. 앱이 시작할 때 스크린을 초기화하는 이벤트가 발생하여 스크린의 초기화 이벤트핸들러(Screen.Initialize)를 트리거한다. 이 이벤트핸들러를 사용하기 위해, 사용자블록(My Blocks)탭의 스크린(Screen1)드로워를 열고, 스크린의 초기화 블록(Screen1.Initialize)을 선택하여 작업영역으로 드래그한다.

2-2. 잠자리가 수평좌측방향으로 향하게 하기 위해 잠자리의 헤딩설정블록(set dragonFig.Heading to)각도를 0으로 한다.

사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 헤딩향설정블록(set dragonFig.Heading to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 0으로 정정한다. 진행방향블록과 숫자블록을 다음의 스크린샷과 같이 플러그인한다.

2-3. 디자인창의 디자인시에 업로드한 잠자리 그림(dragongfig1.png)을 스프라이트(잠자리)의 모습으로 결정한다.

사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 그림설정블록(set dragonFig.Picture to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 텍스트(Text)드로워를 열고 텍스트블록(text text)을 선택하여 작업영역으로 드래그하고 텍스트블록의 문자(text)를 더블클릭하여 dragonfig1.png로 정정한다. 잠자리의 그림설정블록(set dragonFig.Picture to)의 소켓(to)에 텍스트블록(text dragonfig.png)을 플러그인한다.

2-4. 잠자리의 초기속도(단위는 픽셀임)를 0으로 한다.

사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 속도설정블록(set dragonFig.Speed to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자(number 123)를 선택하여 작업영역으로 드래그하고 숫자블록(number 123)의 숫자(123)를 더블클릭하여 0으로 정정한다. 잠자리의 속도설정블록(set dragonFig.Speed to)의 소켓(to)에 숫자블록(number 0)을 플러그인한다.

2-5. 잠자리의 초기위치는 캔버스내의 중앙에 놓이도록 X, Y좌표(단위는 픽셀임)를 각각 100, 75로 설정한다.

사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 X, Y좌표설정블록(set dragonFig.X to, set dragonFig.Y to)을 순차적으로 각각 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 2회 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 100과 75로 각각 정정한다. 좌표블록과 숫자블록을 다음의 스크린샷과 같이 플러그인한다.

2-6. 사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 열고 캔버스의 페인트색설정블록(set Canvas1.PaintColor to)을 선택하여 작업영역으로 드래그하고, 내장블록(Built-In)탭의 컬러(Color)드로워를 열고 초록색블록(color Green)을 선택하여 작업영역으로 드래그한다. 캔버스의 페인트색설정블록(set Canvas1.PaintColor to)의 소켓(to)에 초록색블록(color Green)을 플러그인한다. 즉, 초록색을 캔버스의 페인트색으로 설정한다.

2-7. 사용자블록(My Blocks)탭의 통보자(Notifier1)드로워를 열고 통보자의 경고알림호출블록(call Notifier1.ShowAlert notice)을 선택하여 작업영역으로 드래그하고, 내장블록(Built-In)탭의 텍스트(Text)드로워를 열고 텍스트블록(text text)을 선택하여 작업영역으로 드래그한다. 텍스블록(text text)의 문자(text)를 더블클릭하여 다음과 같은 알림문구, “잠자리를 날게 하려면 잠자리를 터치하세요.”를 복사하여 붙여 넣기를 한다.

다음에, 경고알림호출블록(call Notifier1.ShowAlert notice)의 소켓(notice)에 상기 텍스트블록(text)을 플러그인한다.

2-8. 상기한 바와 같은 복수의 블록을 형성하여 조합하면, 다음의 스크린샷과 같이 된다.

3. 이번에는 캔버스를 터치할 때의 이벤트발생에 의해 트리거되는 이벤트핸들러에 대해 설명한다.

3-1. 사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 열고 캔버스의 터치블록(Canvas1.Touched)을 선택하여 작업영역으로 드래그한다.

참고사항: 캔버스터치블록을 작업영역으로 드래그할 때에, 캔버스에서 터치한 좌표 및 캔버스의 터치시에 프로그램적으로 연동하여 터치되는 이미지스프라이트(잠자리)에 관한 인수블록(name x1, name y1, touchedSprite)이 자동생성됨과 동시에, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워에도 이들 인수블록에 대응하는 변수값의 블록(value x1, value y1, value touchedSprite)도 자동생성된다.

3-2. 캔버스의 터치부분에 점이 생성되는 기능블록에 대해 설명한다.

즉, 사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 다시 열고 캔버스의 점그림호출블록(call Canvas1.DrawPoint x y)을 선택하여 작업영역으로 드래그한다. 또한, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워를 열고 변수값의 블록(value x1, value y1)을 각각 순차적으로 선택하여 작업영역으로 드래그한다. 캔버스의 점그림호출블록에 변수값 블록을 플러그인한다.

3-3. 캔버스를 터치하면 캔버스의 터치위치(x1, y1)에서 40, 50 픽셀만큼 마이너스한 위치로 잠자리가 이동하는 기능블록에 대해 설명한다.

사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 클릭하여 열고, 잠자리의 이동호출블록(call dragonFig.MoveTo x y)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 클릭하여 열고 숫자블록(number 123)을 2회 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 40과 50으로 정정한다. 수학(Math)드로워를 열고 마이너스블록(-)을 2회 선택하여 작업영역으로 드래그하고, 또한 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워를 열고 변수값의 블록(value x1, value y1)을 각각 순차적으로 선택하여 작업영역으로 드래그한다. 마이너스블록을 사용하여 x1, y1에 대한 변수값(value x1, value y1)에서 숫자블록의 값(number 40, number 50)을 각각 감산하는 조합블록을 만들고, 이 조합블록을 잠자리의 이동호출블록(call dragonFig.Mover to x y)의 소켓(x y)에 각각 플러그인한다.

3-4. 상기한 바와 같은 복수의 블록을 형성하여 조합하면, 캔버스를 터치할 때마다, 터치한 지점에 점을 그림과 동시에, 캔버스의 터치위치(x1, y1)에서 40, 50 픽셀만큼 감산한 위치로 잠자리가 이동한다. 이들 복수의 블록조합의 스크린샷은 다음과 같다.

4. 캔버스위를 드래그할 때의 이벤트발생에 의해 트리거되는 이벤트핸들러에 대해 설명한다.

4-1. 사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 열고 캔버스의 드래그블록(Canvas1.Dragged)을 선택하여 작업영역으로 드래그한다.

참고사항: 캔버스드래그블록을 작업영역으로 드래그할 때에, 캔버스의 최초 좌표, 직전의 좌표, 현재 좌표 및 캔버스의 드래그시에 프로그램적으로 연동하여 드래그되는 이미지스프라이트(잠자리)에 관한 인수블록(name startX2, name startY2, name prevX2, name prevY2, name currentX2, name currentY2, name draggedSprite)이 자동생성됨과 동시에, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워에도 이들 인수블록에 대응하는 변수값의 블록(value startX2, value startY2, value prevX2, value prevY2, value currentX2, value currentY2, value draggedSprite)도 자동생성된다.

4-2. 다음에, 사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 다시 클릭하여 열고 원그림호출블록(call Canvas1.DrawCircle x y r)을 선택하여 작업영역으로 드래그한다. 또한, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워를 열고 변수값의 블록(value prevX2, value prevY2)을 각각 순차적으로 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 10으로 기재 변경하고, 원그림호출블록의 소켓(x, y, r)에 각가 변수값 블록을 플러그인한다. 즉, 캔버스의 이전좌표(prevX2, prevY2)를 중심점으로 하고 반지름을 10픽셀로하는 원이 생성된다.

4-3. 상기에서 설명한 바와 같이 마찬가지로, 캔버스위를 드래그하면 캔버스의 드래그되는 현재위치(currentX2, currentY2)에서 좌표위치(40픽셀, 50픽셀)만큼 마이너스한 위치로 잠자리가 이동한다. 이에 대한 상세한 설명은 중복되므로, 생략한다.

4-5. 상기한 바와 같은 복수의 블록을 형성하여 조합하면, 캔버스를 드래그할 때마다, 드래한 이전의 위치를 중심으로 하고 10픽셀은 반경으로 하는 원을 그림과 동시에, 캔버스의 드래그의 현재 위치(currentX2, currentY2)에서 40, 50 픽셀만큼 마이너스한 위치로 잠자리가 이동한다. 이들 블록조합의 스크린샷은 다음과 같다.

5. 잠자리가 가장자리에 도달할 때의 이벤트에 의해 트리거되는 이벤트핸들러의 동작에 대해 설명한다.

5-1. 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고 잠자리의 캔버스 가장자리 도달블록(dragonFig.EdgeReached)을 선택하여 작업영역으로 드래그한다.

참고사항: 잠자리의 캔버스 가장자리 도달블록을 작업영역으로 드래그할 때에, 도달되는 가장자리에 관한 인수블록(name edge)이 자동생성됨과 동시에, 사용자블록(My Blocks)컬럼의 사용자정의(My Definitions)드로워에도 이 인수블록에 대응하는 변수값의 블록(value edge)도 자동생성된다. 여기서, 가장자리의 인수에 대해서는 북동, 동, 남동, 남, 남서, 서, 북서는 각각2, 3, 4, -1, -2, -3, -4로 나타낸다.

5-2. 잠자리가 가장자리에 도달하면, 캔버스의 좌표위치(0픽셀, 75픽셀)로 잠자리가 이동한다.

즉, 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 이동호출블록(call dragonFig.MoveTo x y)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 2회 선택하여 작업영역으로 드래그하고 숫자블록의 123을 각각 더블클릭하여 0과 75로 정정한다. 이동호출블록에 두개의 숫자블록을 플러그인한다.

5-3. 잠자리가 가장자리에 도달하여 캔버스의 좌표위치(0픽셀, 75픽셀)로 잠자리가 이동하면,회전하여 원래의 진행방향(수평좌측방향)으로 이동한다.

구체적으로는, 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 회전설정블록(set dragonFig.Rotates to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 논리(Logic)드로워를 클릭하여 열고 불 논리(Boolean logic)의 참블록(true)을 선택하여 작업영역으로 드래그한다. 불 논리의 참블록(true)을 잠자리 회전설정블록에 플러그인한다.

5-4. 잠자리가 가장자리에 도달하여 캔버스의 좌표위치(0픽셀, 75픽셀)로 잠자리가 이동하면,클록1의 타이머가 동작하도록 불 논리의 참블록(true)을 클록1의 타이머 구동 블록에 플러그인한다.

구체적으로는, 사용자블록(My Blocks)탭의 클록1(Clock1)드로워를 열고, 클록1의 타이머 구동설정블록(set Clock1.TimerEnabled to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 논리(Logic)드로워를 클릭하여 열고 불 논리의 참블록(true)을 선택하여 작업영역으로 드래그한다. 클록1의 타이머구동설정블록(set Clock1.TimerEnabled to)의 소켓(to)에 참블록(true)을 플러그인한다.

5-5. 잠자리가 가장자리에 도달하여 캔버스의 위치(0픽셀, 75픽셀)로 잠자리가 이동하면, 잠자리의 헤딩(dragonFig.Heading)각도를 0으로 설정하여 잠자리가 수평좌측방향으로 향한다.

구체적으로는, 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 진행방향설정블록(set dragonFig.Heading to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 0으로 기재하여 변경한다. 진행방향설정블록(set dragonFig.Heading to)의 소켓(to)에 숫자블록을 다음의 스크린샷과 같이 플러그인한다.

5-6. 잠자리가 가장자리에 도달하여 캔버스의 위치(0픽셀, 75픽셀)로 잠자리가 이동하면, 디자인창의 디자인시에 업로드한 잠자리의 그림(dragongfig2.png)를 이미지스프라이트(잠자리)의 모습으로 변경한다.

구체적으로는, 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고, 잠자리의 그림설정블록(set dragonFig.Picture to)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 텍스트(Text)드로워를 열고 텍스트블록(text text)을 선택하여 작업영역으로 드래그하고 텍스트블록의 text를 더블클릭하여 dragonfig2.png로 정정한다. 그림설정블록에 텍스트블록을 다음의 스크린샷과 같이 플러그인한다.

5-7. 잠자리가 캔버스의 가장자리에 도달하여, 캔버스의 위치(0픽셀, 75픽셀)로 잠자리가 이동하면, 디바이스가 100ms동안 진동하도록 진동설정블록에 숫자블록을 다음의 스크린샷과 같이 플러그인한다.

구체적으로는, 사용자블록(My Blocks)탭의 사운드(Sound1)드로워를 열고 사운드의 진동호출블록(call Sound1.Vibrate milisec)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 100으로 기재 변경한다.

5-8. 상기한 바와 같은 복수의 블록을 형성하여 조합하면, 잠자리가 캔버스의 가장자리에 도달할 때마다, 잠자리의 이동, 진행방향으로 회전, 클록1의 타이머 구동개시, 잠자리의 진행방향,잠자리의 그림변경, 디바이스의 진동 등에 대한 기능을 실행한다. 이들 복수의 블록조합의 스크린샷은 다음과 같다.

6. 잠자리를 드래그할 때의 이벤트에 의해 트리거되는 이벤트핸들러의 동작에 대해 설명한다.

6-1. 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고 잠자리의 드래그블록(dragonFig.Dragged)을 선택하여 작업영역으로 드래그한다.

참고사항: 잠자리드래그블록을 작업영역으로 드래그할 때에, 잠자리의 최초 좌표, 직전의 좌표 및 현재 좌표에 관한 인수블록(name startX, name startY, name prevX, name prevY, name currentX, name currentY)이 자동생성됨과 동시에, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)드로워에도 이들 인수블록에 대응하는 변수값의 블록(value startX, value startY, value prevX, value prevY, value currentX, value currentY)도 자동생성된다.

6-2. 상기에서 설명한 바와 같이 마찬가지로, 잠자리를 드래그하면 캔버스위에서 잠자리의 현재위치(currentX, currentY)로 드래그된다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

6-3. 잠자리를 드래그하면, 잠자리의 진행방향과 일치하도록 잠자리가 회전한다. 이 때에 잠자리가 회전하기 때문에, 일시적으로 잠자리를 드래그하여도 캔버스위를 드래그하게 되어 원형의 초록색이 캔버스위에 페인트된다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

6-4. 잠자리를 드래그하면, 클록1의 타이머가 동작한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

6-5. 잠자리를 드래그하면, 디자이너창의 디자인시에 업로드한 잠자리의 그림(dragongfig2.png)를 이미지스프라이트(잠자리)의 모습으로 설정한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

6-6. 잠자리를 드래그하면, 디바이스가 100ms동안 진동한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

6-7. 상기한 바와 같은 복수의 블록을 형성하여 조합하면, 잠자리를 드래그할 때마다, 잠자리의 이동, 진행방향으로 회전, 클록1의 타이머 구동개시, 잠자리의 그림변경, 디바이스의 진동 등에 대한 기능을 실행한다. 이들 복수의 블록조합의 스크린샷은 다음과 같다.

7. 이번에는 잠자리를 터치할 때의 이벤트발생에 의해 트리거되는 이벤트핸들러에 대해 설명한다.

7-1. 사용자블록(My Blocks)탭의 캔버스(dragonFig)드로워를 열고 잠자리의 터치블록(dragonFig.Touched)을 선택하여 작업영역으로 드래그한다.

참고사항: 잠자리터치블록을 작업영역으로 드래그할 때에, 잠자리의 터치한 점에 대한 좌표의 인수블록(name x, name y)이 자동생성됨과 동시에, 사용자블록(My Blocks)컬럼의 사용자정의(My Definitions)드로워에도 이들 인수블록에 대응하는 변수값의 블록(value x, value y)도 자동생성된다.

7-2. 잠자리를 터지하기 직전의 상태에서 잠자리가 나는 경우와 날지 않는 경우를 구분하기 위해 조건블록(ifelse)을 사용한다. 다시 말하면, 잠자리의 속도가 0보다 큰지의 여부를 구분하기 위해 조건블록(ifelse)을 사용한다.

구체적으로는, 내장블록(Built-In)탭의 제어(Control)드로워를 열고 조건블록(ifelse)을 선택하여 작업영역으로 드래그한다. 또한, 내장블록(Built-In)탭의 수학(Math)드로워를 열고 숫자블록(number 123)을 선택하여 작업영역으로 드래그하고 숫자블록의 123을 더블클릭하여 0으로 정정한다. 수학(Math)드로워를 다시 열고 부등호블록(>)을 선택하여 작업영역으로 드래그한다. 또한, 사용자블록(My Blocks)탭의 잠자리(dragonFig)드로워를 열고 잠자리의 속도블록(dragonFig.Speed)을 선택하여 작업영역으로 드래그한다. 부등호블록을 사용하여 잠자리의 속도가 0 보다 큰 조건을 나타내는 조합블록을 만들고, 이 조합블록을 조건블록(ifelse)의 소켓(test)에 플러그인한다.

7-3. 우선, 잠자리의 속도가 0보다 큰 경우에 대해서 설명한다.

7-3-1. 잠자리의 속도(단위는 픽셀임)를 0으로 한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-3-2. 잠자리를 터지하면, 잠자리의 진행방향과 일치하도록 잠자리가 회전한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-3-3. 잠자리를 터치하면, 클록1의 타이머가 구동한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-3-4. 잠자리를 터치하면, 디자이너창의 디자인시에 업로드한 잠자리의 그림(dragongfig2.png)를 이미지스프라이트(잠자리)의 모습으로 결정한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-3-5. 텍스블록(text)에 다음과 같은 알림호출문구로서, “잠자리를 날게 하려면 잠자리를 터치하세요.”를 직접 타이핑하거나 복사하여 붙여 넣기를 한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4. 다음에는, 잠자리가 멈춰있는 경우에 대해서 설명한다.

7-4-1. 잠자리의 속도(단위는 픽셀임)를 50으로 한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-2. 잠자리를 터치하면, 잠자리의 진행방향과 일치하도록 잠자리가 회전한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-3. 잠자리를 터치하면, 클록1의 타이머가 동작한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-4. 잠자리를 터치하면, 디자인창의 디자인시에 업로드한 잠자리의 그림(dragongfig2.png)를 이미지스프라이트(잠자리)의 모습으로 결정한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-5. 잠자리를 터치하면, 디바이스가 100ms동안 진동한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-6. 텍스블록(text)에 다음과 같은 알림호출문구로서 “잠자리를 잡으려면 잠자리를 터치하세요.”를 직접 타이핑하거나 복사하여 붙여 넣기를 한다. 블록조합에 대한 상세설명은 중복되므로 생략한다.

7-4-7. 캔버스에 페인트한 그림을 모두 지운다.

사용자블록(My Blocks)탭의 캔버스(Canvas1)드로워를 열고 캔버스의 그림제거호출블록(call Canvas1.Clear)을 선택하여 작업영역으로 드래그한다.

7-5. 상기 조합블록을 조건블록(ifelse)에 조합한 스크린샷은 다음과 같다.

7-6. 상기의 조건블록을 잠자리터치이벤트블록핸들러에 조합한 스크린샷은 다음과 같다.

8. 클록타이머에 대해서 설명한다.

8-1. 클록타이머는 잠자리의 터치, 드래그, 가장자리도달 등의 이벤트핸들러에서 이벤트의 발생에 의해 클록1의 타이머가 구동한다. 이에 의해, 디자이너창에서 이미 설정한 클록1의 타임인터벌(25ms)동안, 클록1의 타이머가 구동한 다음 멈추고, 클록1에 의해 클록2의 타이머가 25ms동안 구동한 다음 멈추고, 클록2에 의해 클록3의 타이머가 25ms 동안 구동한 다음 멈추고, 클록3에 의해 클록4의 타이머가 25ms 동안 구동한 다음 멈춘다. 즉, 클록1, 2, 3, 4의 타이머는 각각 순차적으로 25ms 동안 연속동작한 다음, 클록의 동작이 모두 정지된다.

8-2. 클록1, 2, 3, 4의 이벤트핸들러는 다음과 같다. 사용자블록(My Blocks)탭의 클록1, 2, 3, 4 (Clock1, Clock2, Clock3, Clock4)드로워를 각각 순차적으로 열고 클록의 타이머블록(Clock1.Timer, Clock2.Timer, Clock3.Timer, Clock4.Timer)을 각각 선택하여 작업영역으로 드래그한다.