flash tutorial

การใชงานโปรแกรม Flash MX เบื้องตน1

การสรางงานมัลติมีเดียเบื้องตนดวยโปรแกรม " Macromedia Flash "


สารบัญเนื้อหาเรื่อง หนา

• เครื่องมือ และสวนประกอบตางๆ 5• การวาดภาพ และการปรับแตง 20• การนําไฟลจากภาพนอกมาใชงานในโปรแกรม 24• การทดสอบและการนําเสนอผลงาน 28• การสรางภาพเคลื่อนไหวแบบ Frame by Frame 37• การสรางภาพเคลื่อนไหวแบบ Motion Tween 46• การสรางภาพเคลื่อนไหวแบบ Motion Guide 52• การสรางภาพเคลื่อนไหวแบบ Tween Shape 61• การสรางตนแบบของวัตถเุพื่อนํากลับมาใชใหม 67• การสรางภาพเคลื่อนไหวแบบ Movie Clip 81• การใสเสียงลงไปในชิ้นงาน 83• เพิ่มการโตตอบดวย Interactive 88


ความสามารถของโปรแกรมในการสรางงานมัลติมีเดีย

Macromedia Flash เปนโปรแกรมที่สามารถสรางงานมั ล ติ มี เ ดี ย ไ ด ห ล า ก ห ล า ย รู ป แ บบ เ ช น รู ป แ บบขอ งภาพเคลื่อนไหว เปน Gif Animation , Screen Server , E-Card นอกจากนั้นยังสรางงานนําเสนอบน WebPages เปน Logo , Banner หรือ ทําเปน Web Application รวมไปถึงความสามารถในการนําเสนอผลงานในรูปแบบของ Program หรือ Games ไดอีกดวย


ขั้นตอนการสรางงานมัลติมีเดียดวย Flash1. สรางชิ้นงานภาพในโปรแกรม Flash

2. บันทึกชิน้งานไวในเอกสารที่อยูในรูปของนามสกุล .fla3. Publish ชิ้นงานใหอยูในรูปแบบที่ตองการเอาผลงานไปนําเสนอ


เครือ่งมือ และสวนประกอบตางๆในโปรแกรม• การแสดง/ซอนเครื่องมือตางๆ ทําไดจากเมนู Window


สวนประกอบของหนาจอโปรแกรม

Timeline

Toolbox

Stage

Work Area

Panel Action

PropertyInspector


Toolbox• เครื่องมือ (Tools) มีเครื่องมือเลือก วาดรูป

และ ระบายสี• มุมมอง (View) มีเครื่องมือยอ/ขยาย และ

เลื่อนหนาจอ• กําหนดสี (Colors) มีเครื่องมือเลือกสีสําหรับ

เสน และภาพ• ตัวเลือก (Option) มีสวนที่ใชปรับแตง

รายละเอียด การทํางานของเครื่องมือเพือ่การประยุกตใชในแบบตางๆ


Stage• Stage พื้นที่ดําเนินการ ใชในการจัดวางเนื้อหา การแสดงผล

จะเกดิกับเฉพาะพื้นที่บน Stage เทานั้นเลือกขนาดมุมมอง

Stage

Work Area


Timeline• เครื่องมือที่ใชในการสรางภาพเคลื่อนไหว ประกอบดวยสอง

สวนที่สําคัญคือ Layer และ Frame

Layer Frame


Panel• หนาตางเครื่องมือที่ใชใน

การปรับแตงคุณสมบัติของอ งค ป ร ะกอบต า งๆ ในชิ้นงาน สามารถเรียกใชงานไดจาก เมนู Window


Property Inspector• เครื่องมือปรับแตงคุณสมบัติ โดยคลิกเมาสที่ พื้นที่ดําเนินการ

เฟรม รูปภาพ หรือ ตัวอักษร เครื่องมือจะเปลี่ยนแปลงตามสิ่งที่เลือกWork Area

Frame

Image

Text


Movie Explorer• เครื่องมือที่ใชดําเนินการเกี่ยวกับการจัดการโครงสรางของ

ชิ้นงาน แสดงรายละเอียดของขอมูลทั้งหมดภายในชิ้นงาน ชวยในการแกไข เปลี่ยนแปลง ปรับแตง หรือ คนหา สวนประกอบตางๆของชิ้นงาน

Movie Explorer


Action• เครื่องมือที่ใชในการดําเนินการเกี่ยวกับการใชคําสั่งควบคุม


การกําหนดคุณสมบัติการกําหนดคุณสมบัติควรทําการกําหนดตั้งแตเริ่มตน

สรางชิ้นงานโดยเฉพาะขนาดของชิ้นงาน - กดที่ปุม Size บน Properties Inspector แลวกําหนดคุณสมบัติของชิ้นงานตามความตองการในการสรางชิ้นงาน


รูจักกับภาพกราฟกในโปรแกรม Flash MX• กราฟกในโปรแกรม Flash มี 2 ลักษณะ คือ1. Bitmap 2. Vector

RSU

StokeFill

Text


เครือ่งมือชวยกะระยะเพือ่การจดัวางวัตถุ

เสนกริด (Grid) เสนไกด (Guide)

ไมบรรทัด (Ruler)

คลิกขวาที่ Stage หรือ Work Area เลือก Ruler , Grid , Guide


ไมบรรทัด (Ruler)• เลือกเมนู View , Rulers• ปรับแตง

– คลิกเมาสที่ Work Area– ที่ Properties กดปุม Size


เสนกริด (Grid)• เลือกเมนู View , Grid• ปรับแตง View , Grid , Edit Grid


เสนไกด (Guide)• เลือกเมนู View , Guides• ปรับแตง View , Guides , Edit Guide


การวาดภาพ และการปรับแตง• การวาดรูปทรงพื้นฐานที่เปน เสน วงกลม และ สี่เหลี่ยม

รูปทรงนอกจากนี้ทําไดโดยการปรับแตงดวยเครื่องมือตางๆ

Subselection Tool คลิกเมาสที่รูป แลวขยับจุดที่อยูรอบรูป

Selection Tool คลิกเมาสที่รูป แลวขยับเสนขอบรอบรูป เมาสเปนรูป ใชปรับเสนโคง ใชปรับมุมหรือเสนสรง


การวาดภาพ และการปรับแตง• การ หมุน หรือ บิดภาพ

เลือกใช Free Transform ขยับเมาสไปรอบๆวัตถุ ดูจากลักษณะของเมาสจากนั้น กดเมาสคางไวลากเมาสตามทิศทางตางๆ และดูผลจากรูปทรงที่เปลี่ยนไป

หมุน บิด


การวาดภาพ และการปรับแตง• การแตงสี แยกออกเปน 2 สวน คือ สพีื้น และ สี เสน

- การเลือกพื้นทีเปนเนื้อรูป หรือ เสนที่ตองการเปลี่ยนสี ในกรณีที่ตองการเลือกวัตถุหลายชิ้นใหกด ปุม Shift คางไวแลวคลิกเมาสเลือกวัตถุตางๆ- การเลือกสี ที่ Properties ในสวนของสีพื้น หรือ สีเสนของวัตถุที่ตองการปรับแตง ในสวนของเสนสามารถปรับแตงลักษณะของเสนไดที่ Solid


การสรางตัวอกัษร และการปรับแตง- สรางตัวอักษร Text Tool- กดที่ปุม คลกิเมาสที่ Stage พิมพขอความที่ตองการ- ปรับแตงแบบอักษร สี ขนาด และ อื่นๆ ที่ Properties นอกจากนั้นยังสามารถสราง Link ไปยัง URL ตางๆ ไดอีกดวย

- ตัวอักษรยังสามารถปรับแตงดวยการ หมุน หรือ บิด ไดเชนเดียวกันกับ รูปวาดอื่นๆ


การนําไฟลจากภาพนอกมาใชงานในโปรแกรม

นอกจากการสรางภาพภายในโปรแกรม Flash แลว โปรแกรมยังสนับสนุนการเรียกใชภาพโดยทําการ Import ไฟลตางๆมาใชงานไดอีกดวย ไมวาจะเปนรูปภาพ หรือเสียง

การนําไฟลจากภาพนอกมาใชงานมี 2 วิธี คือ1. Import เขาสู Stage2. Import เขาไปไวใน Library


Import เขาสู Stage1. เลือกเมนู File , Import หรือ กด Ctrl + R2. เลือกไฟลที่ตองการนํามาใชงานในโปรแกรม3. ไฟลจะปรากฏบน Stage ถาไฟลไมแสดงอยูบน Stage ตองทํา

การเรียกใชงานจาก Library เชน ไฟลเสียง- ไฟลที่สามารถ Import ไดใหดูจาก Files of type ในหนาตาง Import


Import เขาไปไวใน Library1. เลือกเมนู File , Import to Library2. เลือกไฟลที่ตองการนํามาใชงานในโปรแกรม 3. ไฟลที่เลือกจะถูกจัดเก็บอยูใน Library


รูปแบบในการสรางภาพเคลื่อนไหว• Frame by Frame

- สรางภาพเคลื่อนไหวโดยนําภาพมาเรียงเปนเฟรมตอกันไป• Motion Guide

- สรางภาพเคลื่อนไหวใหเคลื่อนที่ตามแนวเสนที่กําหนดไว• Motion Tween

- สรางภาพเคลื่อนไหวใหเคลื่อนที่ในลักษณะของการ พลิก หมุน บิด หรือ เปลี่ยนขนาด

• Tween Shape- สรางภาพเคลื่อนไหวในลักษณะของการเปลี่ยนรูปราง

• Movie Clip- สรางภาพเคลื่อนไหวเพื่อใหสามารถนํามาใชงานใหมได


การทดสอบการทํางานทดสอบการทํางานมี 2 วิธี• กดปุม Enter (ไมแสดงผลการทํางานของ Movie Clip)• เลือกเมนู Control , Test Movie

หรือ กด Ctrl + Enter

กลับไปหนาจอหลักใหกด x


การนําเสนอผลงาน (Publish)1. เลือกเมนู File , Public Setting2. เลือกรูปแบบงานนําเสนอที่ตองการ แลว กดปุม

ในกรณีที่ตองการปรับแตงรายละเอียด สามารถเลือกปรับแตงคาตางๆตาม Tab ของรูปแบบงานนําเสนอที่ตองการ


ผลลัพธจากการนําเสนอผลงาน- ผลลัพธที่ไดจะเปนไฟลที่จัดเก็บอยูในตําแหนงเดียวกันกับไฟล .fla


หลักการสรางภาพเคลือ่นไหวในโปรแกรม Flash

การสรางภาพเคลื่อนไหวในโปรแกรม Flash จะเหมือนการสรางภาพยนตการตูน มีการแบงเนื้อเรื่องออกเปนเหตุการณ (Scene) และ มีการแบงยอยออกเปนเฟรมหลายๆ (Frame)


ไทมไลน (Timeline)Timeline เปนเครื่องมือที่ใชในการสรางภาพเคลื่อนไหว ซึ่ง

ประกอบดวยสองสวนหลัก คือ Layer และ Frame

อัตราการแสดงเฟรมชวงเวลาที่ผานไป

หมายเลขเฟรมปจจุบัน


เลเยอร (Layer)• เพิ่ม Layer ใหกด Insert Layer• ลบ Layer ใหเลือด Layer ที่ตองการลบแลวกดปุม Delete Layer• เปลี่ยนชื่อ ดับเบิลคลิกที่ตัวอักษรชื่อ พิมพชื่อใหมแลวกด Enter• เปลี่ยนลําดับ Layer กดเมาสคางที่ไอคอน หรือตัวอักษรชื่อของ

Layer ลากเมาสขึ้นลงเพื่อเลือ่นตําแหนงหมายเหต ุ: การดําเนินการอื่นๆ ใหคลิกขวาที่ไอคอน หรือตัวอักษรชื่อของ Layer แลวเลือกใชคําสั่งที่เหมาะสม

Layer

Insert Layer

Add Motion Guide Insert Layer Folder

Visible StrokeLock

Delete Layer


การจัดกลุมเลเยอร• เมื่อมจีํานวนLayer มากขึ้น สามารถใช Layer Folder ชวยจัดกลุม

Layer ที่เกี่ยวของกันไวรวมกัน สรางไดโดยกดปุม Insert Layer Folder

• แสดงรายละเอียดของ Layer ที่อยูใน Layer Folder นั้นๆ• ซอนรายละเอียดของ Layer ที่อยูใน Layer Folder นั้นๆหมายเหตุ : การดําเนินการอื่นๆ โดยทั่วไปสามารถทําไดดวยวิธีการเดียวกันกับ Layer


เฟรม (Frame)เฟรมจะมีลักษณะเหมือนกับฟลมภาพยนต แตละเฟรมจะ

แสดงการเคลื่อนไหวของตัวละคร เมื่อมีการแสดงเฟรมตามลําดับอยางรวดเร็วก็จะดูเหมือนกําลังเคลื่อนไหวจริงๆ

Keyframe คือ เฟรมที่ใชกําหนดการเปลี่ยนแปลงเนื้อหา โดยจะสราง และ ปรับแตงเนื้อหาเฉพาะสวนที่เปน Keyframein-between frame คือ เฟรมระหวางกลาง ที่โปรแกรมสรางใหอัตโนมัติตามลักษณะการเคลื่อนไหวแบบตางๆ


การดําเนินการกบัเฟรม (Frame)• การดําเนินการกับ Frame ใหคลิกขวาที่ Frame ที่ตองการ

แลวเลือกใชคําสั่งตางๆใหเหมาะสม• การยายตําแหนงเฟรม ใหเลือกเฟรมหรือกลุมเฟรมที่

ตองการ กดเมาสคางไว ลากเมาสไปยังตําแหนงที่ตองการซึ่งอายอยูใน Layer เดียวกันหรือตาง Layer ก็ได

• การปรับแตงคุณสมบัติของเฟรมทําไดโดยใช Property Inspector เมื่อ Click เมาสไปที่ Frame ใดๆ บน Timeline


การสรางภาพเคลือ่นไหวแบบเฟรมตอเฟรม (1)1. เลือก Layer ที่ตองการสรางภาพเคลื่อนไหว จากนั้นใหสราง

วัตถุลงบน Stage


การสรางภาพเคลือ่นไหวแบบเฟรมตอเฟรม (2)2. Click ขวาที่ Frame ถัดไป แลว เลือก Insert Keyframe


การสรางภาพเคลือ่นไหวแบบเฟรมตอเฟรม (3)3. ทําการปรับแตงวัตถุ หรือ ลบวัตถุเดิมเพื่อทําการสรางวัตถุขึ้นมา

ใหมในเฟรมปจจุบัน ในการปรับแตง สามารถปรับแตงโดยการเปลี่ยนสี ขนาด ตําแหนง พลิก หรือ บิดรูปทรงตามความตองการ

- ลบวัตถุเดิมเพื่อทาํการสรางวัตถุขึ้นมาใหม- เปลี่ยนสี ขนาด ตําแหนง พลิก หรือ บิดรูปทรง


การสรางภาพเคลือ่นไหวแบบเฟรมตอเฟรม (4)4. ทําซ้ําขั้นตอน 2 และ 3 ถาตองการใหมีเฟรมแสดงผลหลายเฟรมหมายเหต ุ: ระยะหางของเฟรมมีผลตอความเร็วในการเคลื่อนไหว

ของภาพ


1. เลือก Layer ที่ตองการสรางภาพเคลื่อนไหว จากนั้นใหสรางวัตถุที่เปนตัวอักษรลงบน Stage

ตัวอกัษร กับการสรางภาพเคลื่อนไหว (1)


2. เลือกเมนู Modify , Brake Apartหรือ กด Ctrl + B



3. เลือกเมนู Modify , Distribute to Layersหรือ กด Ctrl + Shilf + D



4. จัดตําแหนงตัวอักษรตามตองการ โดยกดเมาสคางที่เฟรม ลาก แลวปลอยเมาสในตําแหนงที่ตองการ


หมายเหตุ : ระยะหางของเฟรมมีผลตอความเร็วในการเคลื่อน ไหวของภาพ


5. เลือกเฟรมสุดทายของทุก Layer โดยกดเมาสคาง ลากเมาส คลิกขวาบริเวณกลุมเฟรมที่เลือกไว แลวเลือก Insert Keyframe(จะทําใหตัวอักษรไมหายไปในการแสดงผลของภาพเคลื่อนไหว)



การสรางภาพเคลือ่นไหวแบบ Motion Tweenเปนการสรางภาพเคลื่อนไหวใหเคลื่อนที่ในลักษณะของ

การ พลิก หมุน บิด เปลี่ยนขนาด หรือ ตําแหนง


ภาพเคลือ่นไหวแบบ Motion Tween (1)1. เลือก Layer ที่ตองการสรางภาพเคลื่อนไหว จากนั้นใหสราง



ภาพเคลือ่นไหวแบบ Motion Tween (2)2. Click ขวาที่ Frame ปจจุบัน แลวเลือก Create Motion Tween


ภาพเคลือ่นไหวแบบ Motion Tween (3)3. Click ขวาที่ Frame ถัดไปแลวเลือก Insert Keyframe


ภาพเคลือ่นไหวแบบ Motion Tween (4)4. ปรับแตงวัตถุในเฟรมปจจุบันในลักษณะของการ พลิก หมุน บิด

เปลี่ยนขนาด หรือ ตําแหนง


ภาพเคลือ่นไหวแบบ Motion Tween (5)5. ทําซ้ําในขั้นตอนที่ 2-4 เมือ่ตองการใหเกิดการเคลื่อนไหวที่มีการ

เปลี่ยนไปในหลายๆลักษณะ6. ทดสอบการทํางาน โดยกดปุม Enter ถาตองการใหแสดง

รายละเอียดของการเคลื่อนที่ใหกดปุม Onion Skin


การสรางภาพเคลือ่นไหวแบบ Motion Guideเปนการสรางภาพเคลื่อนไหวใหเคลื่อนที่ตามแนวเสนที่

กําหนดไว โดยมีพื้นฐานของรูปแบบในการเคลื่อนที่ตามปกติทั่วๆไป แต มีการสราง Guide Layer เพื่อนํามาทําการสรางเสนนําทางใหวัตถเุคลื่อนที่ตาม


ภาพเคลือ่นไหวแบบ Motion Guide (1)1. เลือก Layer ที่ตองการสรางภาพเคลื่อนไหว จากนั้นใหสราง



ภาพเคลือ่นไหวแบบ Motion Guide (2)2. Click ขวาที่ Frame ปจจุบัน แลวเลือก Create Motion Tween


ภาพเคลือ่นไหวแบบ Motion Guide (3)3. Click ขวาที่ Frame ถัดไปแลวเลือก Insert Keyframe


ภาพเคลือ่นไหวแบบ Motion Guide (4)4. กดที่ปุม Add Motion Guide จากนั้นใหคลิกเมาสไปที่เฟรม

แรกของ Guide Layer


ภาพเคลือ่นไหวแบบ Motion Guide (5)5. สรางเสนนําทางโดยใช Pencil Tool

ใช Options ทางดานลางของ Toolboxเลือกรูปแบบของเสนที่ตองการ

เริ่มเขียนเสนนําทางจากจุดกลางของวัตถุ ไปตามทิศทางที่ตองการ


ภาพเคลือ่นไหวแบบ Motion Guide (6)6. คลิกเมาสไปที่ตําแหนงคียเฟรมสุดทายของ Layer ที่อยูดานลาง

ของ Guide Layer ใช Arrow Tool เลื่อนตําแหนงวัตถุไปที่จุดปลายของเสนนําทางอีกดาน


ภาพเคลือ่นไหวแบบ Motion Guide (7)7. ปรับใหวัตถเุคลื่อนที่ตามแนวของเสน

- คลิดเมาสไปที่คียเฟรมแรก แลวไปที่ Properties ใหทําเครื่องหมายถูกที่ Orient to path เลือกปุม Rotate ปรับวัตถุหมุนใหขนานกับแนวเสน - คลิดเมาสไปที่คียเฟรมสุดทาย แลวไปที่ Properties ใหทําเครื่องหมายถูกที่ Orient to path เลือกปุม Rotate ปรับวัตถุหมุนใหขนานกับแนวเสน


ภาพเคลือ่นไหวแบบ Motion Guide (8)8. ซอนเสนนําทาง

คลิกเมาสที่ปุม Hide ของ Guide Layer


การสรางภาพเคลือ่นไหวแบบ Tweening Shape

เปนการสรางภาพเคลื่อนไหวใหมีการเปลี่ยนแปลงของรูปราง หรือ รูปทรง ขนาด หรือ สี ในลักษณะของการเปลี่ยนจากวัตถเุดิมไปเปนอีกวัตถุ เชน จาก วงกลม เปน สี่เหลี่ยม ตัวอักษร หรือ รูปภาพ


ภาพเคลือ่นไหวแบบ Tweening Shape (1)1. เลือก Layer ที่ตองการสรางภาพเคลื่อนไหว สรางวัตถุลงบน Stage

ที่ Properties เลือก Tween ใหเปน Shape


ภาพเคลือ่นไหวแบบ Tweening Shape (2)2. Click ขวาที่ Frame ถัดไปแลวเลือก Insert Blank Keyframe


ภาพเคลือ่นไหวแบบ Tweening Shape (3)3. สรางวัตถุบน Stage ซึ่งจะเปนวัตถุปลายทางที่มีการเปลี่ยนแปลง

มาจากวัตถุใน Frame กอนหนา - ทําซ้ําขั้นตอนที่ 1-3 เมือ่ตองการใหมีลักษณะของการเปลี่ยนแปลง

รูปทรงหลายๆแบบ


ภาพเคลือ่นไหวแบบ Tweening Shape (4)กรณีที่วัตถุเปนตัวอักษร หรือ ภาพ Bitmap จะตองทําการแยก

สวนองคประกอบใหเปนสวนยอยกอน เลือก Tween ใหเปน Shapeโดยมีขั้นตอนดังนี้1. คลิกเลือกตัวอักษร หรือ ภาพ Bitmap2. เลือกเมนู Modify , Break Apart หรือ คลกิเมาสเลือกตัวอักษร หรือ ภาพ Bitmap แลวกด Ctrl + Bหมายเหตุ : ตัวอักษรตองทํา 2 ครั้ง


ภาพเคลือ่นไหวแบบ Tweening Shape (5)การแสดงผลในการเปลีย่นรูปทรงที่ซับซอน ใหใช Shape Hint

โดยมีขั้นตอนดังนี้1. คลิกเลือกคียเฟรมแรกของการเคลือ่นไหว2. เลือกเมน ูModify , Shape , Add Shape Hint จะมีจุด ใหปรับแตงโดยเลือ่น Shape Hint ไปยงัตําแหนงที่ตองการ ในทุกๆคยีเฟรม ทดสอบโดยกด Enter เพือ่ดูผลและ ปรับแตงเพิ่มเติม

หมายเหต ุ: การเพิม่เติม โดยกด Ctrl คางไว แลว ขยับ hintการยกเลิก Modify , Shape , Remove All Hint

a

b


ซิมโบล (Symbol)ซิมโบล คือ การสรางตนแบบของวัตถเุพื่อใหสามารถนํา

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

การสรางซิมโบล มี 2 วิธี คือ การแปลงวัตถุที่เลือกไว ใหเปนซิมโบล และ การสรางซิมโบลเปลาขึ้นมาใหม ซิมโบล มีอยูดวยกัน 3 แบบ คือ

• Graphic เปน รูปภาพที่จะนําไปใชสรางภาพเคลื่อนไหว• Button เปน ปุมที่สรางเพื่อใชตอบสนองการทํางานของเมาส• Movie Clip เปน ภาพเคลื่อนไหวที่นํากลับมาใชใหมได


Button Symbol

Button เปน ปุมที่สรางเพื่อใชตอบสนองการทํางานของเมาส โดยมีลักษณะของ Timeline ที่ใชในการกําหนดรูปแบบในการตอบสนองการทํางานของเมาส Up , Over , Down และ Hit เพื่อใหมีลักษณะของการตอบสนองที่ตางกัน


Movie Clip Symbol

Movie Clip เปน การสรางภาพเคลื่อนไหวที่เปนสวนยอย ของชิ้นงานหลักสวนหนึ่ง โดยสามารถทําการสรางใหเกิดรายละเอียดไดเหมือนการสรางชิ้นงานหลักโดยทั่วไป

แสดง Timeline ของ Symbol ที่กําลังทําการแกไข

แสดง Timeline ของทั้งหมด


- เลือกวัตถุที่ตองการเปลี่ยนใหเปนซิมโบล- เลือกเมนู Insert , Convert to Symbol

- เลือกรูปแบบของซิมโบลที่ตองการ แลวกด Ok

หมายเหตุ : การปรับแตงทําไดโดยการดับเบิลคลิกที่ซิมโบล เสร็จแลวกดปุม เพื่อกลับไปที่หนาจอหลัก

การแปลงวัตถุที่เลือกไวใหเปนซิมโบล


- เลือกเมนู Insert , New Symbol- เลือกรูปแบบของซิมโบลที่ตองการ แลวกด Ok

- สรางวัตถุที่ตองการดวยเครื่องมือตางๆ เสร็จแลวกดปุม เพื่อกลับไปที่หนาจอหลัก

หมายเหตุ : ซิมโบล จะถกูจัดเก็บอยูใน ไลบรารี (Library)

การสรางซิมโบลเปลาขึ้นมาใหม


Library มี 2 กลุม คือ Library ที่ผูใชสรางเอง โดยจะมีรายการของ Symbol ทั้งหมดที่มีอยูในชิ้นงานนั้นๆ- เลือกเมนู Window , Library

Common Librarys ที่มีอยูแลวในโปรแกรม- เลือกเมนู Window , Common Librarys

การใชงานไลบรารี Library

New Symbol สราง Symbol ใหมNew Folder สรางแฟมเพื่อชวยในการจัดกลุม Symbol Delete ใชลบ SymbolProperties ใชปรับคุณสมบัติของ Symbol


1. เลือก เมนู File , Open as Library2. เลือกไฟลที่มีนามสกุล .fla ที่ตองการ แลวกด Open3. จะปรากฏหนาตาง Library ของไฟลนั้น4. ลาก Symbol มาวางที่ Stage ปจจุบัน- Symbol นั้นจะถูกคัดลอกไปที่ Library ของชิ้นงานปจจุบัน โดยอัตโนมัติ

- หรือ เปดหนาตาง Library ดวยเมนู Window , Library แลว ลาก Symbol ที่ตองการจากหนาตาง Library ของๆ ไฟลที่เปด ขึ้นมาไปที่หนา Library ของชิ้นงานปจจุบัน

การใชงานไลบรารี Library ของชิ้นงานอืน่


อินสแตนซ (Instance)Instance คือ Symbol ที่ถูกเรียกใช

1. เลือก Layer และ Frame ที่ตองการ 2. เปด Library ที่ตองการนํา Symbol จาก Library นั้นมาใชงาน3. เลือก Symbol ที่ตองการโดยกดเมาส คางไวแลวลากเมาสไปที่ Stage4. Symbol ที่เลือกจะปรากฏอยูบน


การปรับแตง อินสแตนซ (Instance)การปรับแตง Instance ที่สรางมาจาก Symbol เดียวกันโดยจะไม

สงผลกระทบตอกัน สามารถทําการปรับแตงจาก Properties Inspectiorการปรับสี เลือก Color : - Brightness ความมืด กับ สวาง- Tint เพิ่มสีอื่นเขาไปผสมกับสีเดิม- Alpha ความโปรง กับ ทึบ- Advance ใชปรับแตงสีขั้นสูง โดยการผสมคาของสีแบบ RGBนอกจากนั้นยังสามารถ ปรับขนาด หรือบิดรูปทรง โดยจะไมสงผลกระทบตอ Instance อื่นหมายเหตุ : ถามีการปรับแตง Symbol จะสงผลกระทบกับทุกๆ

Instance ที่สรางจาก Symbol เดียวกัน


Brightness ความมดื กับ ความสวางการปรับแตงความมืด กับ สวาง ทําไดโดยเลือก Color เปน

Brightness แลวทําการปรับคา % ใหมืด หรือ สวาง โดยดูจากผลลัพธที่ไดของภาพที่อยูบน Stage

หมายเหตุ : ภาพ Bitmap ไมสามารถทําการปรับแตงไดดวยวิธีนี้ หรือไมก็ตองทําการ Convert ใหเปน Symbol กอน


Tint เพิ่มสีอื่นเขาไปผสมกับสีเดิมการปรับโดยการเพิ่มสีอื่นเขาไปผสมกับสีเดิม ทําไดโดยเลือก

Color เปน Tint ทําการเลือกสีที่ตองการ และ ปรับ % คาสีที่ตองการผสม นอกจากนั้นยังปรับจากคา GRB ไดอีกดวย แลวดูจากผลลัพธของภาพที่อยูบน Stage



Alpha ความโปรง กับ ความ ทึบการปรับความโปรง กับ ทึบ ทําไดโดยเลือก Color เปน Alpha แลว

ทําการปรับคา % ภาพโปรง หรือ ทึบ สามารถชวยใหมองเห็นภาพที่ซอนทับกันไดอยางรางๆ



Advance ปรับแตงสีขั้นสูง โดยผสมคาสี RGBการปรับโดยผสมคาสี RGB ทําไดโดยเลือก Color เปน Advance

แลวกดปุม Settings ปรับ % คาสีที่ตองการผสม โดยดูผลลัพธของภาพที่อยูบน Stage เสร็จแลวกด ปุม Ok



การสรางภาพเคลือ่นไหวแบบ Movie Clip

เปนการสรางภาพเคลื่อนไหวใหเกิดขึ้นในหนวยยอยของวัตถุ ในกรณีที่ตองการนํารูปแบบของการเคลื่อนไหวที่เกิดขึ้นซ้ําๆแบบคงที่ มาสรางเปน Movie Clip เพื่อใหสามารถนํามาเรียกใชงานไดหลายๆครั้ง เชน การขยับปกของนก หรือ การหมุนของใบพัด

จากนั้นจึงจะนําไปใชประกอบการสรางภาพเคลือ่นไหวแบบตางๆ


ภาพเคลือ่นไหวแบบ Movie Clip (1)

1. เลือกเมนู Insert , New Symbol2. ตั้งชื่อ Symbol ตามที่ตองการ3. เลือกที่ Movie Clip กดปุม OK


ภาพเคลือ่นไหวแบบ Movie Clip (2)4. สรางภาพเคลื่อนไหวรูปแบบตางๆ เชน Frame by Frame, Motion Guide , Motion Tween หรือ Tweening Shape เสร็จแลวกดปุม Back เมื่อสิ้นสุดการสรางภาพเคลื่อนไหวหมายเหตุ : เรียกใชงานจากเมนู Window , Library หรือ กด F11

ปุม Back


การใสเสียงลงไปในชิ้นงาน (1)1. เลือกเมนู File , Import หรือ Import to Library

2. สราง Layer ใหมเพื่อนํามาใชในการใสเสียงดวยปุม Insert Layer


การใสเสียงลงไปในชิ้นงาน (2)3. เลือกไฟลเสียงที่ตองการนํามาใชในชิน้งาน โดยเลอืก Sound ที่

เครือ่งมือ Properties หรอื จากเมนู Window , Library เลือกเสยีงที่ตองการ แลวกดเมาสคาง ลากเมาสไปวางบน Stage ของ Layer ที่ตองการใสเสียง

4. เลือกเฟรมถัดไป คลิกขวา เลือก Insert Keyframe


กําหนดการแสดงผลของเสยีง (3)การแสดงผลของเสยีงสามารถกําหนดไดที ่ Effect และ Sync

ทีอ่ยูบนเครือ่งมือ Properties

หมายเหตุ : การกําหนดรูปแบบในการแสดงผลจะตองทําที่ Keyframe ของ Layer ที่มีการใสเสียงลงไปเทานั้น


กําหนดการแสดงผลของเสยีง (4)Effect ใชกําหนดลูกเลนในการแสดงผลของเสียง เชน Fead In ใหเสียงคอยๆดังขึ้นSync ใชกําหนดการประสานการแสดงผลของเสียงกับชิ้นงาน- Event เสียงจะเลนตามเฟรมที่ใสเสียงไว โดยจะตองดําเนิน

การควบคุมการเลนเสียงดวยการใช Action- Start เหมือนกับ Event แตจะไมเลนเสียงซอนทับเสียงเดิม

ถาหากจะมีการเลนเสียงนี้ใหม - Stop ใชกําหนดจุดสิ้นสุดของเสียง- Stream เมื่อตองการใหเสียงแสดงผลที่สอดคลองกับการ

แสดงผลของชิ้นงานLoop การเลนเสียงซ้ํา โดยกําหนดจํานวนรอบเปนคาตัวเลข


การใสเสียงใน Button (5)1. สรางปุม หรือ เลือกมาจาก Library2. ดับเบิลคลิกที่ปุมใหอยูในสถานะของการแกไข3. เพิ่ม Layer สําหรับใสเสียง4. สราง Keyframe ตรงสถานะของปุมที่ตองการใหมีเสียง เชน

กดปุมแลวเกิดเสียง ก็สรางที่คีย Down 5. ทําการใสเสียง เชนเดียวกับขั้นตอนการใสเสียงในชิ้นงาน ทําซ้ําในขั้นตอนที่ 4 และ 5 ถาตองการใสเสยีงที่สถานะของปุมตางๆ


เพิ่มการโตตอบดวย Interactiveการเพิ่มการโตตอบภาพในชิน้งานสามารถทําไดกับ

1) Frame หรอื Frame ใน Movie Clip 2) Button

โดยการใสคําสั่งเพือ่ควบคุมการ ดําเนินการของเนือ้หาภาพในชิน้งาน ใหเกิดการโตตอบระหวางผูใช ดวยการใชหนาตาง Action ในการใสคําสั่ง

- เมน ูWindow , Action หรอื กด F9


เพิ่มการโตตอบใหกับเฟรม (frame)1. เลือก Keyframe บน Timeline

คลิดขวาแลวเลือก Actions2. จากหนาตาง Actions เลือก

คําสั่งโดยการดับเบิลคลิก3. ใสคาตางๆทีส่ําคญัตอคาํสั่ง

เหลานัน้ จาก Timeline Control

เชน คําสั่ง stop(); โดยความหมายใหหยุดเมื่อผานเฟรมนี้


เพิ่มการโตตอบใหกับปุม (button)1. เลือก ปุม ที่ตองการ จากนัน้คลกิขวาแลวเลือก Actions2. จากหนาตาง Actions เลือกคําสั่งโดยใสคาตางๆจาก Movie Clip Control

เชน on (press) { • gotoAndPlay(20);• }


คําสั่งพื้นฐาน (1)คําสั่ง Goto โดดไปเลน Frame หรือ Scene ที่ระบุ

- gotoAndPlay ไปยังเฟรมที่กําหนดแลวแสดงผล- gotoAndStop ไปยังเฟรมที่กําหนดแลวหยุดแสดงผล

คําสั่ง loadMovie();

คําสั่ง Get URL สั่งให Browser เปดเว็บที่มีการระบุในคําสั่ง- โดยกําหนดคา URL ที่ตองการ

คําสั่ง nextFrame,prevFrame สั่งใหแสดงผล Frame ถัดไป & ยอนกลับ

คําสั่ง nextScene,prevScene สั่งใหแสดงผล Scene ถดัไป & ยอนกลับ


ตัวอยาง คําสั่งพื้นฐาน (2)คําสั่ง Goto

- gotoAndPlay (1);- gotoAndStop (“Scene 1”,1);

คําสั่ง loadMovie(“theflash.swf”,this);

คําสั่ง getURL(“http://waiwit.webs.io”,_blank); หรือgetURL(“javascript:alert( Hello Rangsit);” ); show only

คําสั่ง nextFrame(); และ prevFrame();

คําสั่ง nextScene(); และ prevScene();


คาํสั่งพื้นฐาน (3)คําสั่ง Play ( ) ; สั่งใหแสดงผลตอ จากที่หยุดนิ่งคําสั่ง Stop ( ); สั่งใหหยุดการแสดงผล ณ จุดนัน้

คําสั่ง FSCommand ใชควบคุมเมื่อมีการแสดงผลชิน้งาน- fullscreen แสดงผลเต็มหนาจอ เมื่อ parameter = true- allowscale เนือ้หาปรับตามขนาดหนาจอ เมื่อ parameter = true- showmenu แสดงเมนูเมื่อคลิกขวา เมื่อ parameter = true- exec ใชเรยีกเปดโปรแกรมตางๆ ตองระบบตําแหนงของ

โปรแกรมใน parameter - quit ปดหนาตางแสดงผลเชน on(release) {

fscommand("fullscreen", true);}


คาํสั่งพื้นฐาน (4)คําสั่ง ifFrameLoaded

เปนคําสั่งใชในการตรวจสอบ Frame ที่กําหนดวาโหลดมาหมดหรือยัง กรณี Movie มีขนาดใหญ

ifFrameLoaded (scene,frame) {คําสั่งที่ตองการ

}Ex. ifFrameLoaded (200) {

gotoAndPlay(15);}


การจัดการขอความในโปรแกรม FLASHFLASHMXMX

• ขอความในโปรแกรม Macromedia Flash แบงไดเปน 3 ประเภท

• Static Text – ขอความคงที่ ขอความที่ไมเปลี่ยนแปลงใดๆ

• Dynamic Text– ขอความไดนามิก ขอความที่เปลี่ยนแปลงไดตามการประมวลผล

ของ Server• Input Text

– ขอความอินพุท ฟลดขอความรับมาจากการปอนของผูใชผานฟอรม เชน Username หรือ Password


คาํสั่งพื้นฐานขอความ Dynamic (1)• 1) Create Text File , article_01.txt• Save text file (notepad) in Unicode type (for thaiFont) • พิมพขอความเริ่มตนวา Content_01= นีค้ือขอความของ………


คาํสั่งพื้นฐานขอความ Dynamic (2)• 2) Create text tool ใหกดที่ปุม คลิกเมาสที ่Stage สราง

พืน้ที ่และ ปรบัแตง ขนาด ที ่Properties – Var ให set วา content_01– Text name ให set วา text_01

• 3) Action Script at FRAME : ใหพมิพวา• loadVariables(“article_01.txt”,this);


คาํสั่งพื้นฐานขอความ Dynamic (3)• 4) Action Script at Scroll Button

: ใหพมิพ ที่ปุมบน • on (release)• {

text_01.scroll=text_01.scroll-1; • } • และ ที ่ปุมลาง • on (release)• {

text_01.scroll=text_01.scroll+1; • }


“เหนอืกวาดวยเทคโนโลย ีกาวสูระดบัสากล”

flash tutorial

Documents

flash mx flash

b42 flash mx

guide19 flash mx

x28 flash mx

library71 flash mx

keyframe38 flash mx

keyframe49 flash mx

keyframe55 flash mx