4-05. 신호등 놀이 - (액션) stop / play

제4장 예제를 이용한 애니메이션 만들기

4-05. 신호등 놀이 - (액션) stop / play

[안내]

아주 간단한 액션 스크립트 활용 예제입니다.

이 예제에는 단지 두 개의 액션 즉, stop과 play 만으로 상호작용을 만들어 봅니다.

[예제 파일]를 클릭하여 적당한 폴더에 저장하십시오.(파일명 : stop_play01_ex.fla)

stop_play01_ex.fla

예제 파일을 플래시에서 열어보면 다음 그림과 같이 길이 그려져 있고, 그 위에 차와 신호등, 그리고 차가 따라갈 안내선이 있습니다.



타임라인을 보면 모두 5개의 레이어가 있으며, 각 레이어의 스테이지에 있는 객체에 따라 레이어 이름을 붙여두었습니다.

이번 차시에서 익힐 내용은 ‘버튼’ 레이어에 있는 두 개의 버튼에 액션을 넣어주면 됩니다. 따라서 버튼 레이어만 활성화시켜두고 나머지는 자물통으로 채워두었습니다.



가운데 있는 사각형과 삼각형 버튼에 액션을 주어 사각형을 누르면 차가 멈추고, 삼각형을 누르면 차가 달리도록 하는 무비를 만들어 봅니다.

2. 완성된 작품

완성된 작품에서는 달리던 차가 사각형을 누르면 멈추고(신호등에 따라 멈추도록 어린 아이들과 게임하면 재미있을 것같아 만들어보았습니다), 파란등으로 바뀌면 삼각형 버튼을 눌러 달리도록 되어 있습니다.

물론 멈춤 버튼을 누르지 않으면 신호등을 무시하고 계속 달릴 것입니다.

3. 만들어보기

가. 버튼에 액션 스크립트 만들기

(1) 예제 파일을 열어서 ‘버튼’ 레이어를 선택하거나, 스테이지에서 사각형 버튼을 클릭합니다.(선택을 하면 객체 주변으로 하늘색의 테두리가 보이게 됩니다)

(2) 스테이지 아래쪽에 있는 [액션-버튼] 창 제목을 클릭하여 액션 스크립트 창을 활성화합니다.


액션 창이 사라진 경우 F9키를 누르거나 메뉴의 [윈도우 > 액션]을 클릭하면 나타나게 됩니다.




(3) 액션 창에서 [ActionScript 1.0 & 2.0]을 선택하고, [전역함수 > 타임라인 컨트롤]에서 [stop]을 더블클릭하거나 드래그하여 오른쪽의 스크립트 창에 가져다 놓습니다.

다음 그림과 같이 스크립트 창에 액션 스크립트가 자동으로 입력되어 나타납니다.






(4) 마찬가지 방법으로 스테이지에서 세모 버튼을 선택하고, [전역함수 > 타임라인 컨트롤]에서 [play]를 더블클릭하거나 드래그해서 스크립트 창에 가져다 놓습니다.



※ 왼쪽에 있는 액션 목록이 보이지 않을 경우 경계선 부분의 창 확장 단추를 누르십시오(다음 그림 참조).






나. 저장 및 테스트

Ctrl + S 키를 눌러 FLA 파일을 저장하고, Ctrl + Enter키를 눌러 무비를 만듭니다.

버튼을 눌러서 적용한 액션이 작동하는지 확인해 보십시오.