lesson6
DESCRIPTION
TRANSCRIPT
![Page 1: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/1.jpg)
เรอง รจกกบ Layer ซน และ เฟรม
การท างานเปนเลเยอร (Layer) เปนการท างานโดยการแยกสวนตางๆ ของภาพออกจากกนเปนล าดบขน ซงในการสราง Flash Movie นน การใช Layer จะชวยท าใหเกดการเคลอนทอยางสมจรงสมจง ฉะนนอาจเรยกไดวาการใช Layer ในการสรางภาพเปนเรองทส าคญมากในการสราง Flash Movie
ความหมายของ Layer ลกษณะการท างานแบบ Layer เปนการวางแผนใสซอนทบกนเปนล าดบขนขนมาเรอยๆ โดยแตละแผนใสเปรยบเหมอนเปนแตละ Layer บรเวณ Layer ทไมมรปจะเหนทะลถง Layer ทอยขางลาง โดยกระบวนการเชนนจะท าใหเกดเปนรป Flash Movie ทสมบรณ นอกจากนแลว ในแตละ Layer จะแยกการท างานอยางชดเจน มคณสมบตตางๆ เปนของตวเอง และแกไขทเกดขนในแตละ Layer นนจะไมสงผลตอ Layer อนๆ รปแสดงการวาง Layer เขาดวยกนจนเกดเปนภาพใหม
รปภาพแสดงเมอสมบรณ
![Page 2: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/2.jpg)
108
การใชงาน Layer ในการสราง Flash Movie ขนมานน แมจะประกอบ
ไปดวย Layer หลาย Layer แตสามารถท างานไดเพยงทละ Layer เทานน Layer ทก าลงท างานอยเรยกวา Action Layer สงเกตไดจะปรากฏเปนแถบสด าท Layer นน และสามารถ ก าหนดสถานะตาง ๆ ของ Layer นนได เชน ก าหนดให แสดงหรอซอน Layer, ก าหนดให Layer นนสามารถปรบ แตงไดหรอไมได ,ก าหนดให Layer นนแสดงเฉพาะเสน โครงราง เปนตน
การแสดงหรอซอนเลเยอร
คลกในคอลมน Eye ทางขวาของชอเลเยอรหากเลเยอรใดแสดงเครองหมาย แสดงวาถกซอนอย ใหคลกซ าเพอแสดง เราสามารถคลกแลวลากในคอลมน Eye นไดเพอแสดงหรอซอนทละหลายๆ เลเยอร หากตองการแสดง / ซอนเลเยอรทงหมด ใหคลกทไอคอน ทแถบสวนหวของเลเยอรหรอ กดป ม Alt คางไว แลว คลกในคอลมน Eye
การแสดงโครงรางของออบเจกตในเลเยอร คลกในคอลมน Outline ทอยทางขวาของชอเลเยอรเพอแสดงหรอไมแสดงโครงรางเนอหาในเลเยอรนน เราสามารถคลกแลวลากในคอลมน Outline นไดเพอแสดงหรอไมแสดงทละหลายๆ เลเยอร หากตองแสดง / ซอนเลเยอรทงหมด ใหคลกทไอคอน ทแถบสวนหวของเลเยอร หรอ กดป ม Alt คางไว แลวคลกในคอลมน Outline
แสดงสถานะการท างานของ Layer
แถบสวนหว คอลมน Eye
![Page 3: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/3.jpg)
109
การเปลยนสของโครงราง 1. ใหเปด Properties ขนมาซงสามารถทจะเปดหนาตาง Properties ขนมาไดนนมวธการ
เปดดวยกน 3 วธ ดงน * ดบเบลคลกทไอคอนของเลเยอรทอยดานซายของชอเลเยอร * คลกขวาทชอเลเยอร แลวคลกเลอกค าสง Properties * คลกทเลเยอรนน แลวเลอกค าสง Modify เลอกไปท Timeline แลวเลอกท Layer
2. เลอกสทตองการ 3. เลอก OK
คอลมน Outline
แสดงโครงรางของเนอหาในเลเยอรทเลอก
เลอกส
![Page 4: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/4.jpg)
110
การปรบความสงของเลเยอร ดบเบลคลกทไอคอน ทอยดานซายของชอเลเยอร แลวเลอกขนาดในสวนของ Layer Height และเลอก OK
การแกไขเลเยอร การเลอกเลเยอร
คลกทชอเลเยอร หรอ คลกทเฟรมใดๆ ของเลเยอรนน หรอ เลอกออบเจกตบนสเตจทอยในเลเยอรนน หากตองการเลอกหลายเลเยอรทอยตดกน ใหกดป ม Shift คางไว แลวคลกเลอกหากตองการเลอกหลายเลเยอรทอยไมตดกน ใหกดป ม Ctrl คางไว แลวคลกเลอก
การสราง Layer ใหม 1. สรางโดยเลอกเมน ค าสง Insert เลอกค าสง Timeline แลวเลอกท Layer ดงรป
- คลกทป ม Insert Layer ทอยดานลางพาเนล - คลกขวาทชอเลเยอร แลวเลอกค าสง Insert Layer
![Page 5: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/5.jpg)
111
2. Layer ใหมจะถกสรางขนมาเหนอ Layer ทก าลงท างานอย โดยมการก าหนดชอ Layer โดยอตโนมต
การเปลยนชอเลเยอร
ดบเบลคลกทชอเลเยอร แลวพมพชอใหม คลกขวาทชอเลเยอร แลวเลอกค าสง Properties เลอกเลเยอรนน แลวเลอกเมนค าสง Modify เลอกค าสง Timeline แลวเลอก Layer
การคดลอกเลเยอร 1. เลอกเลเยอรทจะคดลอก 2. เลอกมเมนค าสง Edit เลอกค าสง Copy Frames
3. คลกทป ม Insert Layer เพอสรางเลเยอรใหม 4. เลอกเลเยอรใหมนน แลวเลอกเมนค าสง Edit เลอกค าสง Paste Frames การจดล าดบการจดวางเลเยอร
ลากเลเยอรไปยงต าแหนงใหมทตองการ
พมพชอใหม
ดรากสเมาสลากไปวางยงต าแหนงทตองการ
![Page 6: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/6.jpg)
112
การลอคเลเยอร
คลกในคอลมน Lock ทอยทางขวาของชอเลเยอรเพอลอคหรอไมลอคเลเยอรนนเรา สามารถคลกแลวลากในคอลมน Lock นไดเพอลอคทละหลายๆ เลเยอร หากตองการลอก / ไมลอกเลเยอรทงหมด ใหคลกทไอคอน ทแถบสวนหวของเลเยอร หรอ กดป ม Alt คางไว แลวคลกในคอลมน Lock
การลบเลเยอร 1. เลอกเลเยอรทจะลบ
2. คลกทป ม Delete Layer ดานลางของพาเนล หรอ ลากเลเยอรนนไปทงลงในป ม Delete Layer หรอ คลกขวาทชอเลเยอร แลวคลกค าสง Delete Layer
โฟลเดอรของเลเยอร
โฟลเดอรของเลเยอร (Layer Folder) เปนสวนทชวยในการจดเลเยอรใหเปนระเบยบโดยจดแยกออกเปนกลมๆเชนเดยวกบการจดระบบไฟลในเครองของเราในโฟลเดอรนจะสามารถบรรจเลเยอร หรอโฟลเดอรยอยๆ อกกได
คอลมน Lock
Delete Layer
![Page 7: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/7.jpg)
113
การสรางโฟลเดอรของเลเยอร คลกทเลเยอรใดๆ แลวเลอกเมนค าสง Insert เลอกค าสง Layer Folder หรอ คลกขวาทชอ
เลเยอร แลวเลอกค าสง Insert Folder หรอ คลกป ม Insert Layer Foldr ทดานลางของพาเนลจะปรากฏโฟลเดอรอยเหนอเลเยอรทเราเลอก
การยายเลเยอรเขาไปไวในโฟลเดอร ดรากสเมาสลากเลเยอรนนไปวางทชอโฟลเดอรทตองการ
การเปด-ปดโฟลเดอร คลกทเครองหมายสามเหลยมหนาชอโฟลเดอรหากตองการ เปด-ปดโฟลเดอรทงหมด ใหคลกขวาแลวเลอกค าสง Expand All Folders เพอเปด หรอ Collapse All Folders เพอปด
การคดลอกเนอหาในโฟลเดอรของเลเยอร
1. คลกทเครองหมายสามเหลยมหนาชอโฟลเดอร เพอเปดโฟลเดอร 2. คลกทชอโฟลเดอร เพอเลอกทงโฟลเดอร
Insert Layer Folder
![Page 8: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/8.jpg)
114
3. เลอกเมนค าสง Edit เลอกค าสง Copy Frames 4. เลอกเมนค าสง Insert เลอกค าสง Layer Folder เพอสรางโฟลเดอรเลเยอรใหม 5. คลกทชอโฟลเดอรใหมทได แลวเลอกเมนค าสง Edit เลอกค าสง Paste Frames
การยายหรอคดลอกออบเจกตระหวางเลเยอร ซน หรอไฟล 1. เลอกออบเจกตทตองการจะยายหรอคดลอก 2. เลอกเมนค าสง Edit เลอกค าสง Cut เพอยาย หรอ Edit เลอกค าสง Copy เพอคดลอก 3. เลอกเลเยอร ซน หรอไฟลทตองการจะน าออบเจกตนนไปไว 4. เลอกเมนค าสง Edit เลอกค าสง Paste เพอน าไปใสลงตรงกลางสเตจ หรอ เลอกเมน
ค าสง Edit เลอกค าสง Paste in Place เพอน าไปวางบนสเตจในต าแหนงเดยวกบทออบเจกตนนอย
การจดการซน (Scene) ในการสรางมฟวขนสกไฟลหนงนน เราควรทจะแบงเรองราวออกเปนฉากๆ ทเรยกวา ซน เมอ
ไฟลมฟวทมหลายๆ ซนแสดงผล มนจะแสดงเรยงตามล าดบทเราจดไวให โดยเฟรมในมฟวจะถกใสหมายเลขล าดบเรยงตอเนองกนไป ตวอยางเชน ถามฟวของเราประกอบดวย 2 ซนๆ ละ 10 เฟรม เฟรมในซนท 2 จะเรมทเฟรมท 11-20 เปนตน
พาเนล Scene
พาเนล Scene จะเปนสวนทชวยใหเราจดการกบซนไดอยาง สะดวกไมวาจะเปนการเพมซน การลบซน หรอการเรยงล าดบซน เราสามารถเปดใชพาเนล Scene ได โดยเลอกเมนค าสง
Window เลอกค าสง Design Panels แลวเลอกท Scene
การเพมซนใหม เลอกเมนค าสง Insert เลอกค าสง Scene หรอ คลกทป ม
Add Scene ดานลางของ พาเนล Scene
![Page 9: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/9.jpg)
115
การเปลยนชอซน ในพาเนล Scene ดบเบลคลกทชอซน แลวเพมชอใหม
การท าซนซ า 1. ในพาเนล Scene คลกทซนทจะท าซ า 2. คลกทป ม Duplicate Scene ดานลางของพาเนล Scene
การไปยงซนทตองการ เลอกเมนค าสง View เลอกค าสง Go To
หรอ คลกทป ม Edit Scene ดานบนขวาของหนาตางชนงาน
การจดล าดบซน ในพาเนล Scene ลากซนนนไปยงล าดบทตองการ
การลบซน คลกทป ม Delete Scene ดานลางของพาเนล Scene
![Page 10: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/10.jpg)
116
การจดการเฟรมใน Timeline ในพาเนล Timeline เราสามารถจดการกบเฟรมและคยเฟรมเพอสรางการเคลอนไหวได
ตาม ท เราตองการ ซงอาจเปน
การเลอกเฟรม กอนทจะจดการกบเฟรมตางๆ ไดนน เราจะตองเลอกเฟรมทจะจดการเสยกอน ซงเรา
สามารถ เลอกเฟรมได 2 วธดวยกน ไดแก - การเลอกทละเฟรม
โดยการคลกทเฟรมทตองการ
- การเลอกเปนชวง คลกทเฟรมแรกทจะเลอกกดป ม Shift คางไว แลวคลกทเฟรมสดทายของ
ชวงทตองการ
การคดลอกเฟรม
กดป ม Alt คางไว คลกทเฟรมทจะคดลอก แลวลากไปยงต าแหนงทจะคดลอกไปหรอเลอก เฟรมทจะคดลอก เลอกเมนค าสง Edit เลอกค าสง Copy Frames แลวไปเลอกเฟรมทจะคดลอกไปไว และเลอกเมนค าสง Edit เลอกค าสง Paste Frames
คลกทเฟรมแรก กด Shift คางไวคลกทเฟรมสดทาย
เลอกเฟรม เลอก Edit > Copy Frames
คลกทเฟรมทจะคดลอกไปไว
เลอก Edit > Paste Frames
![Page 11: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/11.jpg)
117
การลบเฟรม 1. เลอกเฟรมหรอคยเฟรมทจะลบ 2. คลกขวาแลวเลอกค าสง Remove Frame
การเปลยนคยเฟรมไปเปนเฟรม
เลอกคยเฟรมนน แลวเลอกเมนค าสง Modify เลอกค าสง Timeline แลวเลอกท Clear Keyframe คยเฟรมนนรวมทงเฟรมกอนหนาจะถกแทนทดวยออบเจกตในเฟรมกอนหนานน
การขยายชวงเฟรม กดป ม Alt คางไว แลวลากคยเฟรมสดทายออกไป
การยายต าแหนงคยเฟรม ลากคยเฟรมนนไปยงต าแหนงใหม
เลอกเฟรมทจะลบ เฟรมทเหลออย
![Page 12: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/12.jpg)
118
การปรบการแสดงเฟรม
คลกป ม ตรงมมบนขวาของสวนแสดงเฟรมในพาเนล Timeline
เลอก Tiny, Small, Normal, Medium, หรอ Large เพอปรบขนาดชองเฟรมจากเลกไปใหญ
Tiny
Small
Normal
Medium
Large
![Page 13: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/13.jpg)
119
การดผลการแสดงมฟว การดผลการแสดงจากเมน Control
เลอก Preview เพอแสดงรปออบเจกตในแตละเฟรมดวย
เลอก Preview in Content เพอแสดงทงสเตจในแตละเฟรม
![Page 14: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/14.jpg)
120
ความหมายค าสงตางๆ ในเมน Control
ค าสง ค าอธบาย Play แสดงผลซนบนสเตจ Rewind ถอยกลบ Go To End ไปยงซนสดทาย Step Forward One Frame เลอนเดนหนาทละเฟรม Step Backward One Frame ถอยหลงทละเฟรม Test Movie แสดงผลมฟวในบราวเซอร Debug Movie แกไขมฟว Test Scene แสดงผลซนในบราวเซอร Loop Playback แสดงผลแบบวนรอบ Play All Scenes แสดงผลทกซน Enable Simple Frame Actions ใหทดลองแอคชนทก าหนดไวในเฟรมได Enable Simple Buttons ใหทดลองกดป มได Mute Sounds ปดเสยงขณะแสดงผล
การดผลการแสดงดวย Controller เปดใชแผงควบคม โดยเลอกเมนค าสง Window เลอกค าสง Toolbars เลอกค าสง Controller เรมแสดงผลใหคลกทป ม Play หยดการแสดงผล ใหคลกทป ม Step Forward เพอเดนหนา หรอคลกทป ม Step Backward เพอถอยหลง หรอกดป ม < และ > บนแปนพมพ
Stop
Go to first frame
Step back one frame
Play Step Forward one Frame
Go to last frame
![Page 15: Lesson6](https://reader033.vdocuments.site/reader033/viewer/2022052617/547d7ccc5906b5ab718b457b/html5/thumbnails/15.jpg)
121
การดผลการแสดงดวยค าสง Test Movie
ถงแมวาเราจะสามารถดผลการแสดงของมฟวทเราสรางขนไดทนทภายในไฟลชนงานทเราก าลงสรางอยนนกตาม แตจะมการเคลอนไหวบางอยางรวมทงการเคลอนไหวทตองมการโตตอบจะไมสามารถแสดงผลไดภายในชนงานจนกวาเราจะสรางใหเปนไฟล Flash movie เสยกอน ดงนนในการแสดงผลการเคลอนไหวเหลาน เราจะตองใชค าสง Test Movie ซงจะท าหนาทในการสรางไฟล Flash movie จากไฟลชนงานขณะนนและแสดงผลใหทนท เลอกเมนค าสง Control เลอกค าสง Test Movie เพอแสดงผลทงมฟว หรอ เลอกเมนค าสง Control เลอกค าสง Test Scene เพอแสดงผลเฉพาะซนขณะนน ไฟล .swf ทไดจะอยในโฟลเดอรเดยวกบไฟล .fla
การขอดผลงานการแสดงในเวบบราวเซอร
เราสามารถขอดผลการแสดงของไฟลชนงานขณะนนในเวบบราวเซอรไดทนท โดยเลอกเมนค าสง File เลอกค าสง Publish Preview เลอกค าสง HTML โปรแกรมจะท าการสรางไฟล Flash movie (.swf) และแสดงผลในเวบบราวเซอรทมอยในระบบเครองมอของเราดวยโปรแกรม Flash Player ไฟล .swf ทไดจะอยในโฟลเดอรเดยวกบไฟล .fla