|
การสร้างชิ้นงานด้วย Symbol
|
|
การสร้างชิ้นงานด้วย Symbol
การนำ Symbol ที่เตรียมไว้มาสร้างชิ้นงาน
1. คลิก 2 ครั้งที่ Layer 1
เปลี่ยนชื่อเป็น
ปุ่ม
2. นำซิมโบล Button จาก Library มาวางที่ stage ดังภาพ
|
|
|
|
3. คลิก Insert Layer
เพื่อเพิ่ม Layer
4. คลิก 2 ครั้งที่ Layer 2
เปลี่ยนชื่อเป็น ถังน้ำ
5. นำ Symbol แก้วน้ำมาวางที่ Stage แล้วดึงภาพให้เป็นลักษณะรูปถังน้ำ
ด้วย Free
Transform
6. คลิก Insert Layer
เพื่อเพิ่ม Layer
7. คลิก 2 ครั้งที่ Layer 3
เปลี่ยนชื่อเป็น ปลา
8. นำ Symbol ปลา มาวางที่ Stage ดังภาพ
|
|
|
|
9. นำเมาส์ไปคลิกค้างไว้เฟรมที่ 25 ของเลเยอร์ ปลา แล้วลากลงมาถึงเฟรมที่
25 ของเลเยอร์ ปุ่ม
|
|
|
|
10. คลิกขวาเลเยอร์ที่ 25 เลือก Insert Keyframe
|
|
|
|
11. คลิกเฟรมที่ 25 ของเลเยอร์ ปลา
12. ย้าย ปลา ไปไว้ทางด้านซ้ายมือของถังน้ำ
|
|
|
|
13. คลิกขวาระหว่างเฟรมที่ 1 25 เฟรมใดก็ได้ เลือก Create Motion Tween
|
|
|
|
14. นำเมาส์ไปคลิกค้างไว้เฟรมที่ 26 ของเลเยอร์ ปลา
แล้วลากลงมาถึงเฟรมที่ 26 ของเลเยอร์ ปุ่ม
15. คลิกขวาเลเยอร์ที่ 26 เลือก Insert Keyframe
|
|
|
|
16. คลิกเฟรมที่ 26 ที่เลเยอร์ ปลา
17. คลิก Free
Transform
|
|
|
|
18. สลับด้านหัวหางของปลา
|
|
|
|
19. นำเมาส์ไปคลิกค้างไว้เฟรมที่ 50 ของเลเยอร์
ปลา แล้วลากลงมาถึงเฟรมที่ 50 ของเลเยอร์ ปุ่ม
|
|
|
|
20. คลิกขวาเฟรมที่ 50 เลือก Insert Keyframe
|
|
|
|
21. คลิกเฟรมที่ 50 ของเลเยอร์ ปลา
22. ย้ายซิมโบล ปลา ไปไว้ด้านขวาของถังน้ำ
|
|
|
|
23. คลิกขวาเฟรมที่ 35 หรือเฟรมใด ๆ ก็ได้ระหว่างเฟรมที่
26 50 เลือก Create Motion Tween
|
|
|
|
|
24. ทดสอบ Movie Clip ด้วยการกดปุ่ม Ctrl + Enter
25. การกำหนด Action Script เพื่อควบคุม Symbol Movie Clip
การกำหนด Action Script ให้กับปุ่ม Play เพื่อสั่งให้ Animation ทำงาน
25.1 คลิกปุ่ม Play
|
|
|
|
25.2 คลิกเมนู Window
25.3 คลิก Actions หรือกดปุ่มคีย์ลัด F9
|
|
|
|
25.4 พิมพ์ Actions Script on (release) { play(); }
|
|
|
|
การกำหนด Action Script ให้กับปุ่ม Pause เพื่อสั่งให้ Animation หยุดทำงาน |
|
25.5 คลิกปุ่ม Pause
|
|
|
|
25.6 คลิก Actions หรือกดปุ่มคีย์ลัด F9
|
|
|
|
25.7 พิมพ์ Actions Script on (release) { stop(); }
|
|
|
|
การกำหนด Action Script ให้กับปุ่ม Stop เพื่อสั่งให้ Animation หยุดทำงาน
และเริ่มเฟรมที่ 1
|
|
25.8 คลิกปุ่ม Stop
|
|
|
|
25.9 คลิก Actions หรือกดปุ่มคีย์ลัด F9
|
|
|
|
25.10 พิมพ์ Actions Script on (release) {
gotoAndStop(1); }
|
|
|
|
25.11 คลิกเฟรมที่
1 ของเลเยอร์ ปุ่ม เพื่อเขียน Actions Script : Stop();
เป็นการสั่งให้ Animation หยุดทำงาน
เพื่อรอคำสั่งจากการกดปุ่ม Play (เมื่อเขียน Script แล้ว ที่เฟรมจะมีตัวอักษรเอ
ปรากฏ)
|
|
|
|
25.9 คลิกเฟรมที่ 50 ของเลเยอร์ ปุ่ม เพื่อเขียน Actions Script : gotoAndPlay(2); เป็นการสั่งให้ Animation เริ่มทำงานเฟรมที่ 2 (ข้ามเฟรมที่ 1 ซึ่งเป็นเฟรมที่มี Script สั่งหยุดการทำงาน)
|
|
|
|
ย่อ Actions ทำการทดสอบด้วยการกดปุ่ม Ctrl+Enter |
|