무아선생님의 <Button방식으로 play하기>

<Button방식으로 play하기>

Movie 설정..... 720X540.

 

<이미지 열기>

1. 이미지 5장을 Content창을 통해서 열기하여 등록시켜놓는다.

2. 등록시켜놓은 5장중 1장만 불러온다.(Content창에서 1장만 선택하고 하단의 Add link to stage를 클릭하면 됨).

3. Properties창에서 W=720 H=540, Transform창에서 O=X 센터 X=360 Y=270으로 한다.

 

<이미지에 효과주기>

4.이미지를 클릭하고 우클릭하여 Break, Break into pieces를 클릭하여 창이 뜨면,Break:Regular grid, Coloms:10, Rows:4, Allow...체크, Inflate...0.2pixels체크, Cascade order: 맨위줄 좌에서 1째 체크 하고 ok 클릭.

5. 이미지라인의 1F에 우클릭하여 Appear into position, Alternate shrink in을 클릭하고, 효과가 선택된 상태에서 Effects창을 열고 프레임수 20을 30으로, Scale 700을 100으로 수정한다. (play movie해본다.....효과를 확인)

6. 다시 이미지라인의 41F에 우클릭 Core Effects, Squeeze클릭. 프레임수 30으로 확장.

7. 다시 81F에 우클릭 Return to start, jump up out and twist클릭.

8.110F에 Place, 120F에 더블클릭하고 메뉴의 Window, Tint클릭하여 창을 열고, Color,Advanced선택하고 R:300 G:200으로 수정하고,

9. 130F에 더블클릭하여 R:100 G:100으로 수정하여 원위치시킨다. 150F:Place준다.

10. Play movie 해본다. 이상으로 이미지에 효과주기를 한 것임.

 

<이미지를 play시키기 위한 준비 작업>

11. 아웃라인의 이미지를 선택, 무비클립으로 묶어준다. 이름:img1.

12. img1을 복사하여 붙여넣기 4번해서 총5개를 만들고 이름:img1 ~ img5로 한다.

13. (이미지 교체 작업하기)

14. img2를 열고,이미지를 열고, 모두 선택하고, Properties창에서 Fill color를 클릭하고 Image를 클릭해서 2번째이미지를 선택한다.(이미지가 교체됨).

15. img3를 열고,이미지를 열고.........img2의 방법과 동일하게 하여 이미지를 교체한다.

img4, img5도 동일한 방식으로 이미지를 교체한다.

16.현재상태에서 저장한다. 파일이름:이미지. (현상태에서 이미지 펼치기로 할수도 있다)

17. img1 ~img5 모두 선택하여 무비클립으로 묶고 이름:main.

18. 현상태에서 auto방식으로 할수 있다. 이번에는 button방식으로 할 것임.

19. main 열고,main라인의 1F,3F,5F,7F,9F,11F에 Stop을 준다.

20. img1라인의 2F에 Place, 4F에 Remove를 주고, 두 개의 효과를 복사해서,img2라인의 4F, img3라인의 6F, img4라인의 8F에 붙여넣기하고, img5라인의 10F에 Place준다.

21. 이상의 작업은 img1,2,3,4,5가 지정된 프레임에 나타나서 play하다(place)가 끝나면, 멈추고, 사라지고(remove)를 하게 하기 위한 작업이었음.

 

<다음은 버튼을 5개 만들어서 버튼에 명령을 줄 것임>

22. main닫고, scene-1을 클릭하고, 사각형툴을 선택하고, 라인:실선,굵기:2,색:빨강, Fill color:solid, 색:노랑을 선택한 후,작업창에 적당히 드래그하여 그린다.

23. Properties창에서 W:70 H:40, Transform창에서 O=X 센터 X=150 Y=480으로 한다.

24. Scene-1클릭, T클릭, 작업창 적당한 곳에 클릭하고,글씨체:Arial 크기:28 색:파랑색 B 클릭,Edit클릭하여 창에다가 img1이라고 입력하고 Apply클릭한다. 또 Transform에서 O=X 센터 X=150 Y=480으로 하고 엔터치면 img1글자가 노란색의 사각형위에 생긴다.

25. 아웃라인에서 img1과 Shape를 함께 선택, Group as button을 클릭하고, selection툴을 클릭하고 over에 체크하고, 아웃라인에서 Button열고 over state의 Shape선택하고 색상을 흰색, img1글자를 검정색으로 수정한다. Button을 닫는다.이름:bt1으로 한다.

26. bt1을 복사하여 총5개로 하고, 이름:bt1 ~ bt5로 한다.

27. bt5를 선택하고 Transform에서 X=600으로 하고, 얼라인 정렬한다.

(얼라인 정렬방법:bt1~bt5 모두 선택하고 우클릭 align, space evenly, both를 클릭한다)

28. bt2를 열고 up과 over의 img1을 img2로 수정한다(수정방법:img1을 선택하고 Edit클릭하고 Enter Text창에서 img1을 img2로 수정한다).

bt3,4,5,도 동일한 방식으로 img3,4,5로 수정한다.

29. bt1~bt5모두 선택, 무비클립으로 묶고 이름:btn으로 한다.

 

(마지막으로 버튼에 Script(즉 명령어)를 작성할 것임)

30. btn 열고, bt1선택, Script, Add script, Events, Button, on(release)클릭,

다시 Add script, Movie control, Goto and play, gotoAndPlay(Frame)클릭,

Target에서 _parent.main을 클릭하고, 프레임수를 2로 한다.

31. 작성된 스크립트 소스를 모두 선택,복사해서, bt2를 클릭하고,스크립트창에 붙여넣기하고,프레임수를 4로 수정, bt3,bt4,bt5 도 동일방법으로하여 프레임수를 6,8,10 으로 수정한다.

32. 스트립트창을 빠져나오고, btn을 닫는다.

33. main열고 img2와 img4를 각각 선택하고, Properties창에서 stop체크한다.

34. Play movie해본다.

 

35. main열고,main라인의 1F의 Stop을 삭제하고 Play movie해본다.

 

36. main열고 타임라인의 place,remove,stop 형태를 삭제하고 auto방식으로 바꾸고,

btn열고 bt1~bt5의 Script내용의 프레임수를 적정하게 수정해본다.

 

37. main열고 img1~img5의 place,remove,stop을 버튼방식으로 설정하고,

auto방식, button방식으로 해본다.

10-5.-.swi

auto방식의 아웃라인.jpg

auto방식의 타임라인.jpg

Button방식으로 play하기.hwp

버튼방식의 아웃라인.jpg

버튼방식의 타임라인-1..jpg

버튼방식의 타임라인-2..jpg