การสร้าง Symbol
การสร้าง Symbol ในโปรแกรม Adobe Flash CS6 นั้น สามารถสร้างได้ 2 วิธี คือ
1. สร้างวัตถุใหม่เพื่อให้เป็น Symbol ในรูปแบบต่างๆ ดังนี้
การสร้าง Symbol แบบ Graphic Symbol สามารถทำได้ดังนี้
1. คลิกเลือกเมนู Insert -> New Symbol หรือกดปุ่ม Ctrl+F8 จะปรากฏหน้าจอ Create New Symbol
2. กำหนดชื่อให้กับ Symbol และเลือกชนิดของ Symbol เป็น Graphic ที่ folder กำหนดให้เก็บ Symbol ไว้ที่ Library root จากนั้นคลิก OK
ภาพที่ 5.4 การสร้าง Symbol แบบ Graphic Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
3. เมื่อคลิก OK จะเข้าสู่โหมด Edit Symbol จะปรากฏชื่อ Symbol ที่กำหนดไว้ใน Edit bar
ภาพที่ 5.5 ส่วนประกอบของโหมด Edit Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
4. วาดภาพที่ต้องการลงไป
ภาพที่ 5.6 การวาดภาพที่ต้องการในโหมด Edit Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
5. ออกจากโหมด Edit Symbol โดยการคลิกเมนู Edit -> Edit Document หรือ Ctrl+E หรือคลิกที่ Scene หรือคลิกที่
จะกลับสู่โหมดปกติ
ภาพที่ 5.7 การออกจากโหมด Edit Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
การสร้าง Symbol แบบ Button Symbol สามารถทำได้ดังนี้
1. คลิกเลือกเมนู Insert -> New Symbol หรือกดปุ่ม Ctrl+F8 จะปรากฏหน้าจอ Create New Symbol
2. กำหนดชื่อให้กับ Symbol และเลือกชนิดของ Symbol เป็น Button ที่ folder กำหนดให้เก็บ Symbol ไว้ที่ Library root จากนั้นคลิก OK จะเข้าสู่โหมด Edit Symbol
ภาพที่ 5.8 การสร้าง Symbol แบบ Button Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
ที่พาเนล Timeline ใน Layer 1 จะปรากฏ Frame สถานะเหตุการณ์ 4 สถานะ ดังนี้
Up สถานะเหตุการณ์ปกติ
Over สถานะเหตุการณ์เมื่อนำเมาส์วางบนปุ่ม
Down สถานะเหตุการณ์เมื่อคลิกเมาส์บนปุ่ม
Hit สถานะเหตุการณ์หลังจากเกิดเหตุการณ์ Over และ Down แล้ว
ภาพที่ 5.9 พาเนล Timeline แสดงสถานะเหตุการณ์
ที่มา : สุชาดา ทิพโรจน์, 2560
3. ที่ Frame Up วาดรูปดอกไม้สีเหลือง
ภาพที่ 5.10 การวาดภาพที่ Frame Up
ที่มา : สุชาดา ทิพโรจน์, 2560
4. ที่ Frame Over คลิกเมาส์ขวาเลือก Insert Keyframe หรือ กดปุ่ม F6 แล้วเปลี่ยนสีดอกไม้เป็นสีแดง
ภาพที่ 5.11 การวาดภาพที่ Frame Over
ที่มา : สุชาดา ทิพโรจน์, 2560
5. ที่ Frame Down คลิกเมาส์ขวาเลือก Insert Keyframe หรือ กดปุ่ม F6 แล้วเปลี่ยนสีดอกไม้เป็นสีเขียว
ภาพที่ 5.12 การวาดภาพที่ Frame Down
ที่มา : สุชาดา ทิพโรจน์, 2560
6. ออกจากโหมด Edit Symbol โดยการคลิกเมนู Edit -> Edit Document หรือ Ctrl+E หรือคลิกที่ Scene หรือคลิกที่
จะกลับสู่โหมดปกติ
7. ที่พาเนล Library จะพบ Symbol ที่สร้างไว้ นำเมาส์ไปคลิกที่ชื่อ Symbol ที่ต้องการแล้วลากมาวางที่สเตจ
ภาพที่ 5.13 การนำ Button Symbol มาวางบนสเตจ
ที่มา : สุชาดา ทิพโรจน์, 2560
8. ทดสอบการทำงานของ Symbol แบบ Button Symbol โดยการกดปุ่ม Ctrl+Enter เมื่อทดลองนำเมาส์ไปวางบนภาพดอกไม้
หรือคลิกที่ภาพดอกไม้ จะได้ลักษณะการแสดงผลตามสถานะเหตุการณ์ ดังนี้
ภาพที่ 5.14 ลักษณะการแสดงผลตามสถานะเหตุการณ์
ที่มา : สุชาดา ทิพโรจน์, 2560
การสร้าง Symbol แบบ Movie clip Symbol สามารถทำได้ดังนี้
1. คลิกเลือกเมนู Insert -> New Symbol หรือกดปุ่ม Ctrl+F8 จะปรากฏหน้าจอ Create New Symbol
2. กำหนดชื่อให้กับ Symbol และเลือกชนิดของ Symbol เป็น Movie clip ที่ folder กำหนดให้เก็บ Symbol ไว้ที่ Library root
จากนั้นคลิก OK จะเข้าสู่โหมด Edit Symbol
ภาพที่ 5.15 การสร้าง Symbol แบบ Movie clip Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
4. วาดภาพที่ต้องการลงไป จากนั้นที่พาเนล Timeline คลิกเมาส์ขวา Frame ที่ 1 เลือก Create Motion Tween
ภาพที่ 5.16 การกำหนด Frame Motion tween
ที่มา : สุชาดา ทิพโรจน์, 2560
จากนั้นที่พาเนล Timeline จะปรากฏแถบสีฟ้าจาก Frame ที่ 1 ถึง Frame ที่ 25 เราสามารถเพิ่มจำนวน Frame ที่เป็นแถบสีฟ้าได้โดยการลากเมาส์จาก Frame ที่ 25 ไปจนถึง Frame ที่ต้องการ
ภาพที่ 5.17 การเพิ่ม Frame Motion tween
ที่มา : สุชาดา ทิพโรจน์, 2560
5. กำหนดทิศทางการเคลื่อนไหวของภาพ โดยคลิกเลือกที่ Frame ที่ต้องการ แล้วลากภาพไปยังตำแหน่งที่ต้องการ จนได้
ลักษณะการเคลื่อนไหวที่ต้องการ
ภาพที่ 5.18 การกำหนดทิศทางการเคลื่อนไหวแบบ Motion tween
ที่มา : สุชาดา ทิพโรจน์, 2560
ภาพที่ 5.19 ทิศทางการเคลื่อนไหวแบบ Motion tween
ที่มา : สุชาดา ทิพโรจน์, 2560
6. ออกจากโหมด Edit Symbol โดยการคลิกเมนู Edit -> Edit Document หรือ Ctrl+E หรือคลิกที่ Scene หรือคลิกที่
จะกลับสู่โหมดปกติ
7. ที่พาเนล Library จะพบ Symbol ที่สร้างไว้ นำเมาส์ไปคลิกที่ชื่อ Symbol ที่ต้องการแล้วลากมาวางที่สเตจ
ภาพที่ 5.20 การนำ Movie clip Symbol มาวางบนสเตจ
ที่มา : สุชาดา ทิพโรจน์, 2560
9. ทดสอบการทำงานของ Symbol แบบ Movie clip Symbol โดยการกดปุ่ม Ctrl+Enter จะได้ลักษณะการแสดงผล ดังนี้
ภาพที่ 5.21 การแสดงผลของ Movie clip Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
2. สร้างโดยการแปลงวัตถุที่มีอยู่แล้วให้เป็น Symbol เป็นการแปลงวัตถุที่เราสร้างไว้แล้วบนสเตจมาเป็น Symbol ซึ่งสามารถทำได้ดังนี้
1. เลือกวัตถุด้วยเครื่องมือ Selection Tool คลิกเลือกเมนูคำสั่ง Modify > Convert to Symbol หรือ คลิกขวาที่วัตถุแล้วเลือก Convert to Symbol หรือกดปุ่ม F8 จะปรากฏหน้าต่าง Convert to Symbol
ภาพที่ 5.22 การเลือกวัตถุให้เป็น Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560
2. กำหนดชื่อ Symbol และเลือกชนิดของ Symbol (ดังตัวอย่างเลือก Graphic) จากนั้นคลิกปุ่ม OK ซึ่ง Symbol ที่สร้างนั้นจะถูกเก็บไว้ในพาเนล Library
ภาพที่ 5.23 การกำหนดคุณสมบัติของ Symbol
ที่มา : สุชาดา ทิพโรจน์, 2560