Thaigraph

 

   

ค้นหา
Thaigraph หน้าฟอรั่ม Flash การซ้อนอนิเมชั่น
Maple Avatar ห้องแต่งตัวใหม่วิธีการเขียน Blog ส่วนตัววิธีโพสคลิปจาก Youtubeตารางข้อมูล เครดิต + Moneyวิธีการโพสกระทู้แบบรวดเร็ว
ดู: 3296|ตอบ: 2
go

การซ้อนอนิเมชั่น

Rank: 7Rank: 7Rank: 7

โพสต์เมื่อ 14-9-2012 21:00 |แสดงโพสต์ทั้งหมด


การซ้อนอนิเมชั่น

เป็นการกำหนดอนิเมชั่นภายในซับย่อย ให้กับ Symbol แต่ละตัว โดยอนิเมชั่นที่สร้างจะไม่แสดงให้เห็นในหน้าสเตจปกติ แต่เราจะสามารถแก้ไข และมองเห็นโดยการดับเบิ้ลคลิกเข้าไปในภายในซับของ Symbol ตัวนั้นๆเท่านั้น

การซ้อนอนิเมชั่นนี้จะช่วยลดขั้นตอนการทำงานที่ยุ่งยากให้ลดลงได้ และยังช่วยลดจำนวนเลเยอร์ที่หน้าสเตจได้น้อยลงได้ด้วยค่ะ


ไฟล์แนบ: คุณจำเป็นต้องเข้าสู่ระบบก่อนจึงจะสามารถดูและดาวน์โหลดไฟล์แนบได้ หากยังไม่มีแอคเคานต์หรือยังไม่ได้เป็นสมาชิก กรุณาสมัครสมาชิก
บางบทความคุณจำเป็นต้องสมัครสมาชิกแบบ VIP และ SUPERVIP ถึงจะเข้าอ่านบทความได้

Rank: 7Rank: 7Rank: 7

โพสต์เมื่อ 14-9-2012 21:01 |แสดงโพสต์ทั้งหมด
ขั้นตอนที่ 1
ในเลเยอร์แรก ให้สร้างพื้นหลังของฉากขึ้นมาก่อน ในเลเยอร์นี้เราจะกำหนดไม่ให้มีการเคลื่อนไหวใดๆทั้งสิ้น



ขั้นตอนที่ 2
ให้สร้างวัตถุขึ้นมา 1 ชิ้น ในเลเยอร์บน  (จะเป็นภาพบิทแมทหรือ นำเข้ามาจากโปรแกรมอื่นก็ได้) จากนั้นกำหนดให้เป็น Symbol แบบ Movie Clip (คลิกเลือกที่วัตถุแล้วไปที่คำสั่ง Modify > convert to Symbol.. หรือกดปุ่ม F8)  อย่าลืมตั้งชื่อให้กับ Symbol ด้วยนะค่ะ

(ส่วนของลำต้น ตั้งชื่อว่า "tree" )


ขั้นตอนที่ 3
ภายในเลเยอร์เดียวกัน ให้สร้างวัตถุขึ้นมาอีกชิ้น  (จะเป็นภาพบิทแมทหรือ นำเข้ามาจากโปรแกรมอื่นก็ได้) จากนั้นกำหนดให้เป็น Symbol แบบ Movie Clip (คลิกเลือกที่วัตถุแล้วไปที่คำสั่ง Modify > convert to Symbol.. หรือกดปุ่ม F8)  อย่าลืมตั้งชื่อให้กับ Symbol ด้วยนะค่ะ

(ส่วนของใบไม้ตั้งชื่อว่า "Leaves" )


ขั้นตอนที่ 4
ให้ดับเบิ้ลคลิกที่ Symbol ใบไม้ "Leaves" เพื่อเข้าไปที่โหมดย่อยภายใน  แล้วสร้างทิศทางการเคลื่อนไหวแบบ Motion Tween (หรือแบบใดก็ได้ที่เราชอบ)


ขั้นตอนที่ 5
- เสร็จแล้วให้ดับเบิ้ลคลิกบนพื้นที่ว่าง เพื่อให้โปรแกรมกลับไปที่หน้าสเตจปกติ แล้วให้ไปที่คำสั่ง Window > Library หรือกดปุ่ม Ctrl+L เพื่อเปิดหน้า "Library" ที่ใช้เก็บ Symbol ขึ้นมา

- ให้คลิกลาก Symbol ที่ชื่อ "Leaves"  ซึ่งเรากำหนดทิศทางการเคลื่อนไหวแล้ว ในหน้า "Library" ออกมาวางบนหน้าเสตจ และให้ปรับขนาด และหมุนจัดวางให้สวยงาม

(เนื่องจากตัว Symbol ตัวต้นฉบับที่ชื่อ "Leaves" ถูกเรากำหนดให้มีการเคลื่อนไหวแบบ tween  ไปแล้ว มันจึงกลายเป็นตัว "Instance" ไป --- แต่ในโปรแกรม Flash "Instance" ทุกตัวจำเป็นต้องมี  Symbol ตัวต้นฉบับไว้อ้างอิง  --- เมื่อ Symbol ต้นฉบับถูกทำให้กลายเป็น "Instance" ไปแล้ว --- โปรแกรมจึงต้องสร้าง Symbol "Leaves" ตัวต้นฉบับขึ้นมาให้ใหม่อัตโนมัติ แล้วตั้งชื่อว่า "Symbol 1" มาให้ --- ศึกษาความสัมพันธ์ระหว่าง Symbol และ Instance เพิ่มเติมได้จากบทความนี้นะค่ะ
วิธีการสร้าง Symbol ใน Flash ไว้ใช้งาน)



ขั้นตอนที่ 6
ให้เพิ่มจำนวนเฟรมของแต่ละเลเยอร์ให้มากขึ้น เพราะเราจะสร้างการเคลื่อนไหวให้กับ Symbol ทุกชิ้นพร้อมกัน ที่หน้าสเตจขั้นนอกด้วย



ขั้นตอนที่ 7
คลิกเลือก Symbol ทุกชิ้นบนหน้าสเตจ แล้วสร้างทิศทางการเคลื่อนไหวแบบ Motion Tween ที่เลเยอร์ชั้นนอก


ให้ลองกดปุ่ม Ctrl+Enter เพื่อดูการเคลื่อไหวโดยรวม จะเห็นว่าใบไม้ทุกใบ เคลื่อนที่ไปพร้อมกับลำต้นของต้นไม้ ในขณะเดียวกันใบไม้ทุกใบก็มีการเคลื่อนไหวไปมาในตัวของมันเอง


เมื่อได้ทิศทางการเคลื่อนไหวที่ต้องการแล้ว ก็ปรับความเร็วในการแสดงผลของ Timeline ให้เหมาะสม



หากเทียบของบทความก่อนหน้า "
การทำภาพเคลื่อนไหวแบบ Motion Tween" เราจะพบว่าการเคลื่อนไหวของใบไม้จะดูนุ่มนวลต่อเนื่องกว่า ไม่มีการสะดุดเหมือนในบทความก่อนหน้า เพราะในบทความก่อนนั้นข้าพเจ้าใช้วิธีสร้างแบบปกติ คือ Symbol 1 ชิ้น ต่อการเคลื่อนไหว  1 เลเยอร์ ซึ่งเป็นการกำหนดทิศทางการเคลื่อนไหวที่เลเยอร์ชั้นนอกทีละตัว จึงทำให้ควบคุมทิศทางการเคลื่อนที่ของ Symbol ทุกตัวพร้อมกันได้ยากกว่า

แม้การสร้างอนเมชั่นด้วยวิธีนี้ จะมีความซับซ้อนมากขึ้น แต่ประโยชน์ของมันก็คือ นอกจากจะช่วยลดจำนวนเลเยอร์ปกติให้น้อยลงไปมากแล้ว ก็ยังช่วยให้เราสามารถควบคุมทิศทางการเคลื่อนที่ของ Symbol ทุกตัวพร้อมกันได้ง่ายขึ้นค่ะ

ขอให้สนุกกับทุกชิ้นงานนะค่ะ


บทความโดย NOOKFUFU2
(ขอสงวนสิทธิ์ให้เผยแพร่เฉพาะในเว็บไทยกราฟเท่านั้น!!!)

ไฟล์แนบ: คุณจำเป็นต้องเข้าสู่ระบบก่อนจึงจะสามารถดูและดาวน์โหลดไฟล์แนบได้ หากยังไม่มีแอคเคานต์หรือยังไม่ได้เป็นสมาชิก กรุณาสมัครสมาชิก
บางบทความคุณจำเป็นต้องสมัครสมาชิกแบบ VIP และ SUPERVIP ถึงจะเข้าอ่านบทความได้

Rank: 10Rank: 10Rank: 10

โพสต์เมื่อ 26-9-2012 08:13 |แสดงโพสต์ทั้งหมด
ขอบคุณมากครับ อ.nookfufu 2

Thaigraph

GMT+7, 18-3-2019 23:22 , Processed in 0.042535 second(s), 21 queries .

Powered by Discuz! X1.5

© 2001-2010 Comsenz Inc. Thai Language by DiscuzThai! Team.

Top 10 Best Sellers in Clothing for 2017 Top 10 Best Sellers in Clothing Best Sellers in Clothing
Top 10 Best Sellers in Books reviewer 2017 Top 10 Best Sellers in Books Best Sellers in Books