drawing with flash
DESCRIPTION
วาดภาพการ์ตูนด้วย FlashTRANSCRIPT
![Page 1: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/1.jpg)
หดวาดภาพดวย Flash MX
ศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชาต
![Page 2: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/2.jpg)
หดวาดภาพดวย Flash MX สงวนลขสทธตาม พ.ร.บ.ลขสทธ พ.ศ. ๒๕๓๗ โดย บญเลศ อรณพบลย ศนยเทคโนโลยอเลกทรอนกสและคอมพวเตอรแหงชาต กระทรวงวทยาศาสตรและเทคโนโลย http://elearning.nectec.or.th [email protected] ไมอนญาตใหคดลอกสวนใดสวนหนงของหนงสอเลมน นอกจากจะไดรบอนญาตเปนลายลกษณอกษรจากเจาของลขสทธเทานน
![Page 3: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/3.jpg)
สารบญ
หดวาดภาพดวย Flash MX ............................................................................................1
การเรยกใชโปรแกรม Flash.....................................................................................2 จอภาพการทางานของ Flash .............................................................................2
Panel ........................................................................................................................5 คาสงควบคม Panel............................................................................................7
ทางานกบไฟล Flash................................................................................................7 สรางไฟลใหม....................................................................................................8 บนทกไฟล.........................................................................................................8 การจดเกบเปนไฟลภาพ.....................................................................................9 การบนทกในฟอรแมต GIF...............................................................................9 การบนทกในฟอรแมต JPEG ..........................................................................11 เปดไฟล ...........................................................................................................11 ปดไฟล ............................................................................................................11 การคนสสภาพเดม (Revert) ............................................................................12
Stage ......................................................................................................................12 ขนาดของ Stage...............................................................................................12 Ruler, Grid, Guides .........................................................................................13
เครองมอวาดภาพ.........................................................................................................16 Tools Modifier ......................................................................................................16 จดการกบ Stage.....................................................................................................17 ส (Color) ...............................................................................................................18
เพมส................................................................................................................19 แผงควบคมส (Color Panel) ............................................................................19
![Page 4: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/4.jpg)
ชดสแบบไลโทน............................................................................................. 21
วงกลม, วงร ........................................................................................................... 22 ลบวตถดวย Eraser Tool........................................................................................ 23 วาดสเหลยมดวย Rectangle Tool .......................................................................... 24 วาดรปหลายเหลยมดวย Poly Star Tool................................................................ 25 วาดเสนดวย Line Tool.......................................................................................... 26 วาดรปอสระดวย Pencil Tool ............................................................................... 26 วาดรปดวย Brush Tool ......................................................................................... 27 วาดภาพอสระดวย Pen Tool ................................................................................. 28
การเลอกวตถ (Selection) ............................................................................................ 30 การเลอกวตถ หรอกลมวตถดวย Arrow Tool ....................................................... 31
ยกเลกการเลอกวตถ ........................................................................................ 32 ซอนการเลอกวตถ ........................................................................................... 32 เลอกวตถดวย Lasso Tool ............................................................................... 32
ปรบแตง แกไขวตถ ............................................................................................... 33 เปลยนรปทรง.................................................................................................. 33 ตวอยางการวาดจรวดแบบงาย ........................................................................ 34 การยายวตถ (วธท 1) ....................................................................................... 35 การยายวตถ (วธท 2 - กรณยายขาม Scene, ขามเฟรม หรอขามไฟล)............. 35 การคดลอกวตถ (วธท 1) ................................................................................. 36 การคดลอกวตถ (วธท 2 - สาเนาวตถ: Duplicate)........................................... 36 การคดลอกวตถ (วธท 3 - กรณขาม Scene, ขามเฟรม, ขามไฟล)................... 36 การยกเลกคาสง (Undo) .................................................................................. 36 การยอ/ขยาย และปรบรปทรงของวตถ ........................................................... 37 การจดเรยงวตถ (Alignment) .......................................................................... 38
![Page 5: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/5.jpg)
ตวอยางการจดวตถกงกลางจอภาพ .................................................................39 การปรบเปลยนลกษณะเสนขอบวตถ..............................................................39 การปรบเปลยน Fill ของวตถ ..........................................................................39 การคดลอกลกษณะเสนขอบวตถ ....................................................................40 การคดลอกลกษณะพนของวตถ ......................................................................40 การปรบเปลยนสแบบ Gradient ......................................................................41
กลมวตถ (Group)...................................................................................................42 การแยกชนสวนของวตถ .................................................................................42 การจดเรยงลาดบวตถทเปน Group..................................................................43 การปรบแตงแกไขวตถทเปน Group ...............................................................43
ฝกหดวาดภาพ..............................................................................................................45 วาดแผนท ..............................................................................................................45 หนาคนจากวงกลมและเสนตรง ............................................................................47 หนาคนจากหลายๆ วตถ ........................................................................................48 เดกชายสวมหมวก .................................................................................................48 เดกหญง .................................................................................................................48 คนสงอาย ...............................................................................................................49 ดวงอาทตย .............................................................................................................49 รองเทาสเกต ..........................................................................................................49 ถงเทาเดก ...............................................................................................................50 หมวก .....................................................................................................................50 ใบไม......................................................................................................................51 ตนครสมาตส .........................................................................................................51 ตนไม .....................................................................................................................52 ตนไม .....................................................................................................................52
![Page 6: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/6.jpg)
ดอกไม................................................................................................................... 52 ดนสอ .................................................................................................................... 53 ตกตาหม ................................................................................................................ 53 ฮปโป..................................................................................................................... 54 ผลไมการตน.......................................................................................................... 54 สตอรเบอรร .......................................................................................................... 54 ภาพลกษณะอนๆ................................................................................................... 55
![Page 7: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/7.jpg)
หดวาดภาพดวย Flash MX
การสรางสอการเรยนร สอนาเสนอ หรองานออกแบบตางๆ ยอมจะหนไมพน
การออกแบบสรางสรรคงานกราฟก หากสามารถสรางงาน ออกแบบงานกราฟกดวยตนเอง คงจะสรางความภมใจไดมาก แตปญหาใหญของการสรางสรรคงานกราฟกของหลายๆ ทานกคอ “วาดภาพไมเปน” หรอ “วาดยากจงเลย”
รบรองไดครบหากเลอกใชโปรแกรม Macromedia Flash MX 2004 เปนเครองมอชวยสรางสรรคงานกราฟก พรอมๆ กบแนวทางการวาดภาพจากคมอฉบบน จะลมคาวา “วาดยาก” ไปเลย เนองจากโปรแกรม Flash เปนซอฟตแวรสรางสรรคงานกราฟกในระดบพกเซลล (Pixel) ทาใหการปรบแตง แกไข หรอออกแบบภาพ ทาไดงายดวยเทคนค “ตด เชอม ปรบเปลยนรปราง”
Macormedia Flash MX 2004 เปนผลตภณฑลาสดจากคาย Macromedia ทพฒนามาเพอสนบสนนการสรางงานกราฟกทงภาพนง และภาพเคลอนไหว สาหรบการนาเสนอผานเครอขายอนเทอรเนต Flash มฟงกชนชวยอานวยความสะดวก ในการสรางผลงานหลากหลายรปแบบ ตลอดจนชดคาสงโปรแกรมมงทเรยกวา Flash Action Script ทเพมประสทธภาพใน การทางาน และสามารถคอมไพล (Compile) เปนโปรแกรมใชงาน (Application Program) เชน การทาเปน E-Card เพอแนบไปพรอมกบ e-mail ในโอกาสตางๆ
อยางไรกตามเนอหาในเอกสารชดน จะนาเสนอเฉพาะสวนการฝกหดวาดภาพเปนหลก เพอเปนพนฐานในการสรางสรรคงานกราฟกระดบสงตอไป
![Page 8: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/8.jpg)
2
การเรยกใชโปรแกรม Flash
• คลกปม • เลอกรายการ Program, Macromedia, Macromedia Flash MX 2004 รอสกครจะ
ปรากฏหนาตางการทางาน
• จากจอภาพดงกลาว มโหมดการทางานใหเลอกไดหลายลกษณะเชน การเปดไฟล
จากคาสง Open a Recent Item หรอการสรางงานจากรายการ Create New หรอ Create from Template
จอภาพการทางานของ Flash
• แถบเครองมอหลก (Main Toolbar) แถบเครองมอควบคมการทางานหลกของโปรแกรม เชน การสรางไฟลใหม, การเปดไฟล, การคดลอกขอมลเปนตน โดยสามารถควบคมใหแสดง หรอไมตองแสดงโดยคลกเลอกคาสง Window, Toolbars, Main
![Page 9: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/9.jpg)
3
• แถบเครองมอ (Toolbox) กลมเครองมอสรางงานและจดการวตถของโปรแกรม Flash ประกอบดวยปมเครองมอยอยตางๆ สามารถเปด/ปดดวยคาสง Window, Tools
• Document Tab สวนควบคมเอกสาร สามารถคลกเพอสลบเปลยนจอภาพเอกสาร
![Page 10: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/10.jpg)
4
• Timeline Timeline เปนสวนสาคญของโปรแกรม Flash ททาหนาตางควบคมการนาเสนอผลงาน สามารถเปด/ปดดวยคาสง Window, Timeline
• Layer สวนควบคมการสรางชนงาน เพอใหชนงานแตละชนมอสระ และสะดวกตอ การแกไข ปรบแตง
• Stage & Workspace Stage และ Workspace เปนพนทสวนใหญของหนาตางโปรแกรม มลกษณะ การทางานคลายๆ กบเวทการแสดง
• Panel หนาตางเลกๆ ททาหนาทแสดงคาสงควบคมยอยตางๆ ของโปรแกรม โดยจะปรากฏรายการคาสงในเมน Window
![Page 11: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/11.jpg)
5
Panel Panel เปนจอภาพเลกๆ ทแสดงฟงกชนการทางานเฉพาะอยาง เชน การทางานเกยวกบส
จะควบคมดวย Color Mixer หรอ Color Swatches การจดตาแหนงวตถตางๆ ควบคมดวย Align Panel เปนตน การเรยกใชหรอเปด/ปด Panel จะใชคาสง Window แลวตามดวยชอ Panel นนๆ
Panel ประกอบดวยสวนสาคญ ดงน
Panel ควบคมงานมาตรฐาน
Panel สงงานลกษณะตางๆ
Collapse Arrow Move Control Button Option Menu Control
ตวเลอกตางๆ ของ Panel
![Page 12: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/12.jpg)
6
• Move Control Button ปมทใชเคลอนยายตาแหนงของ Panel เมอเมาสอย ณ ตาแหนงน จะปรากฏเปนลกศรสทศ และใชหลก Drag & Drop ในการยายตาแหนง Panel ทงนหากเลอน Panel ไปชดขอบจอ จะถกเปลยนสภาพเปนแบบฝงโดยอตโนมต
• Collapse Arrow ปมควบคมการยอขนาดของ Panel ในกรณทไมได ใชงาน สามารถยบใหมขนาดเลกเปนแถบ เพอประหยดพนทบนจอภาพ
• Option Menu Control ปมเมน
ควบคม Panel รายการในเมนน จะปรบเปลยนไปตาม Panel
Penel แบบฝงตว
Move Control และ Panel แบบลอยตว
![Page 13: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/13.jpg)
7
คาสงควบคม Panel
• การซอน Panel กดปม $ • การปด Panel คลกขวาทแถบชอ Panel แลวเลอกคาสง Close Panel • การคนสภาพ Panel เลอกคาสง Window, Panel Sets, Default Layouts • การแสดงผลพาเนลแบบลอยตวเทานน ใหเลอกจากคาสง Edit, Preferences…
เลอกบตรรายการ General คลกยกเลกรายการ Disable panel docking
ทางานกบไฟล Flash ไฟลของ Flash เรยกวา Movie มสองฟอรแมตหลก คอไฟลตนฉบบ ซงมสวนขยาย
เปน .fla และไฟลทพรอมนาไปใชงาน ซงมสวนขยายเปน .swf การสราง เปดแกไขจะทางานกบไฟลตนฉบบ ซงมสวนขยายเปน .fla นอกจากนยงมไฟลใชงานฟอรแมตอนๆ อกตามความตองการของผใช เชน Execute File (.exe) สาหรบนาเสนออยางรวดเรว โดยไมตองอาศย Flash Player หรอ Browser
เนองจากเนอหาในเอกสารเนนการฝกวาดภาพ และการตนลกษณะตางๆ ในลกษณะภาพนง การบนทกผลงานจะใช 2 ลกษณะคอภาพตนฉบบ .fla และภาพใชงาน .gif หรอ .jpg
ปมซอน Penel
![Page 14: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/14.jpg)
8
สรางไฟลใหม การสรางไฟลใหมของ Flash มวธการเรยกใชงานหลายลกษณะ เชน จากจอภาพ Start
Page สามารถเลอกการสรางไฟลใหมได 2 ลกษณะคอ • Create New กรณทตองการสราง Movie โดยการเรมตนดวยตนเอง
ทงหมด • Create from Template กรณทตองการสราง Movie จากแมแบบท Flash
เตรยมไวให นอกจากนยงสามารถเลอกคาสงไดจากเมนคาสง File, New... หรอใชคยลด Cn หรอ
คลกปมเครองมอ New จาก Main Toolbar
บนทกไฟล
ภาพทวาดทสรางเสรจแลว หรอปรบแตงแกไขแลว ควรบนทกไฟลเกบไวทกครง โดยไฟลตนฉบบจะไดสวนขยายเปน .fla การบนทกไฟลสามารถใชคาสง File, Save… หรอกดปม Cs หรอคลกปม Save จาก Main Toolbar ซงจะปรากฏจอภาพการบนทกไฟล ดงน
![Page 15: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/15.jpg)
9
จดสงเกตวาไฟลไดผานการบนทกแลวหรอไม กดไดจากชอไฟลใน Title Bar หากมเครองหมาย * แสดงวายงไมผานการบนทก
การจดเกบเปนไฟลภาพ
เนองจากไฟล .fla เปนไฟลตนฉบบ ไมสามารถนาไปใชงานได การใชงานจงตองเกบเปนไฟลภาพกอน โดยสามารถเลอกไดวาจะเปนฟอรแมต GIF หรอ JPEG แลวแตลกษณะของภาพ โดยมหลกพจารณางายๆ ดงน
• ภาพโครงราง หรอภาพทมการใชสแบบ Solid ใหเลอกเปน GIF Format • ภาพทมการใชสแบบไลโทน หรอมการใชสจานวนมาก ใหเลอกเปน JPEG
Format
การบนทกในฟอรแมต GIF การบนทกภาพวาดในฟอรแมต GIF ทาไดโดยเลอกคาสง File, Export, Export Image
เมอเลอกไดรฟ/โฟลเดอร และตงชอไฟลภาพแลว ใหเลอกรายการ Save as Type เปน GIF Image (*.GIF) แลวคลกปม Save จะปรากฏรายการเลอกคาควบคม ดงน
เลอกไดรฟ และโฟลเดอร
ตงชอไฟล แลวคลกปม Save
![Page 16: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/16.jpg)
10
รายการเลอกของ GIF Format ไดแก
• Dimension กาหนดขนาดของไฟล • Resolution กาหนดความละเอยด กรณทตองการใชกบเวบให
กาหนดเปน 72 dpi แตถาตองการสรางเพอนาไปใชกบงานสงพมพใหกาหนดเปน 150 – 300 dpi
• Include กาหนดขนาดของไฟล คลายกบ Dimensions • Colors เลอกโหมดสทเหมาะสมกบภาพ • Interlace เลอกเมอภาพทวาดมขนาดโตกวา 200 pixel เพอ
กาหนดใหภาพแสดงผลแบบโครงรางกอน แลวคอยๆ ชดขนเมอเวลาผานไป
• Transparent เลอกเพอกาหนดใหภาพมลกษณะของพนแบบ
โปรงใส • Smooth เลอกใหภาพมลกษณะขอบกระดาง หรอขอบมน • Dither solid colors เลอกลกษณะการเกลยสทมลกษณะใกลเคยงกน
• เมอเลอกคาไดตามตองการแลวใหคลกปม OK
![Page 17: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/17.jpg)
11
การบนทกในฟอรแมต JPEG การบนทกภาพวาดในฟอรแมต JPEG ทาไดโดยเลอกคาสง File, Export, Export Image
เมอเลอกไดรฟ/โฟลเดอร และตงชอไฟลภาพแลว ใหเลอกรายการ Save as Type เปน JPEG Image (*.GIF) แลวคลกปม Save จะปรากฏรายการเลอกคาควบคม ดงน
รายการเลอกของ JPEG Format จะคลายกบ GIF โดยมรายการทแตกตางไปคอ
• Quality คณภาพของภาพ กรณทนาไปใชกบเอกสารเวบ ควรกาหนดไวท 60 – 90
• Progressive เลอกเมอภาพทวาดมขนาดโตกวา 200 pixel เพอกาหนดใหภาพแสดงผลแบบโครงรางกอน แลวคอยๆ ชดขนเมอเวลาผานไป คลายๆ กบคณสมบต Interlace ของ GIF
• เมอเลอกคาทตองการแลว ใหคลกปม Ok
เปดไฟล
การเปดไฟลภาพใชคาสง File, Open... หรอคลกปม Open จาก Main Toolbar หรอใชคยลด Co นอกจากนยงสามารถเลอกไฟลทเคยเปดไดจากเมนคาสง File, Open Recent
ปดไฟล ไฟลทสราง หรอเปดอย หากตองการปดไฟล สามารถใชคาสง File, Close หรอ File,
Close All หรอกดปม Cw ทงนไฟลทยงไมไดผานการบนทก โปรแกรมจะแสดงกรอบเตอน ถาตองการบนทกไฟลกอนปด กคลกปม Yes เพอเขาสโหมดการบนทกไฟล แตถาตองการปดไฟลโดยไมบนทกกคลกปม No หรอคลกปม Cancel เพอยกเลกการปดไฟล กลบสจอภาพสรางงานตามปกต
![Page 18: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/18.jpg)
12
การคนสสภาพเดม (Revert) ไฟลทกาลงแกไข ถาตองการคนกลบสสภาพกอนการแกไข ใชคาสง File, Revert
Stage Stage พนทสาคญการวาดภาพ หรอสราง Movie มลกษณะเปนพนทสเหลยมสขาวลอม
ดวยกรอบสเทา ภาพกราฟก หรอวตถใดๆ สามารถวางไดบนพนทสขาว และสเทา แตเมอสงนาเสนอผลงาน เฉพาะภาพกราฟก หรอวตถทวางบนพนทสขาวเทานน ทจะแสดงผล
ขนาดของ Stage ขนาดของ Stage จะหมายถงพนทการแสดงผลของ Movie นนเอง ดงนนกอนสรางงาน
ควรกาหนดขนาดของ Stage ใหเหมาะสมและตรงกบการใชงานจรง การกาหนดขนาดของ Stage กระทาไดโดย
• เลอกคาสง File, New… เพอเขาสโหมดการสราง Movie • คลกเลอกคาสง Modify, Document…
• กาหนดคาความกวาง ความสงของ Stage (หนวยปกตจะเปน pixel) จากรายการ
Dimensions: o กรณทมขอมลบน Stage สามารถคลกปม Match: Printer หรอ Contents
เพอให Flash ปรบขนาดใหเหมาะสมกบขอมลโดยอตโนมต
![Page 19: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/19.jpg)
13
• คลกเลอกสพนของ Stage จากตวเลอก Background color: • รายการ Frame rate: เปนหนวยวดการสรางภาพเคลอนไหว หมายถงในเวลา 1
วนาทจะตองมภาพกเฟรม จงจะทาใหภาพเคลอนไหวมความสมจรง ถากาหนดนอยเกนไปกจะทาใหมอาการกระตก และหากเรวเกนไปกจะทาใหสญเสยรายละเอยดบางอยาง ขณะแสดงผล สาหรบการนาเสนอบนเวบ คา 12 เฟรมตอวนาท เปนคาทเหมาะสมทสด แตสาหรบการสรางภาพยนตรเชน QuickTime หรอ AVI จะตองกาหนดไวท 24 เฟรมตอวนาท เนองจาก Flash Movie เนนการนาเสนอบนเวบ จงกาหนดคาไวท 12 fps
• Ruler units: หนวยวดของไมบรรทด และหนวยวดการสรางวตถตางๆ แนะนาใหใชหนวยเปน pixels
• คลกปม OK เพอยนยนการกาหนดขนาดและคณสมบตของ Stage การกาหนดขนาดและคณสมบตอนๆ ของ Stage ยงสามารถเลอกไดจาก Properties Panel
โดยเมอคลกเมาสบนพนทวางๆ ของ Stage จะปรากฏรายการเลอกใน Properties Panel ดงน
Ruler, Grid, Guides
Ruler, Grid, Guidesเครองมอชวยกาหนดขอบเขต และวางตาแหนงการสรางกราฟกบน Stage โดย
• Ruler หรอแถบไมบรรทดจะปรากฏทขอบดานซาย และดานบนของ Stage สามารถเปด/ปดไดจากคาสง View, Rulers
• Grid มลกษณะเปนตารางตาหมากรก ทแบงเปนชองเลก ชวยในการกาหนดตาแหนงในการสราง ยอ/ขยาย หรอเคลอนยายวตถบน Stage สามารถเปด/ปดไดจากคาสง View, Grids, Show Grids
![Page 20: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/20.jpg)
14
โดยปกตขนาดของชองตารางจะมคาเทากบ 18 × 18 pixels ซงปรบแตงไดจากคาสง
View, Grids, Edit Grid…
Guide มลกษณะเปนเสนตรงทผใชสามารถกาหนดตาแหนง เพอชวยในการกะระยะตางๆ
ชวยในการวาดภาพ เคลอนยายตาแหนงลกษณะเดยวกบกรด แตมความอสระมากกวา โดย การทางานจะตองอยในสภาวะการเปดใชงาน Ruler กอนเสมอ จากนนนาเมาสไปชใน แถบไมบรรทด (ดานใดกได) กดปมเมาสคางไว เมอลากเมาสจะปรากฏเสนตรงสเขยววาง ณ ตาแหนงทปลอยเมาส การปรบยายตาแหนงเสนไกด กระทาไดโดยคลกเลอกเครองมอ Move
แลวนาเมาสไปชทเสนไกด เพอปรบยายตาแหนง
![Page 21: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/21.jpg)
15
คาสงทเกยวของกบแถบไมบรรทด, Grids และไกด กคอคาสง Snap to… ซงมหลายคาสง เชน
• Snap to Grids ชวยใหการวาด/สรางวตถ, การยอขยาย หรอยายตาแหนง องเสนกรดทกาหนดไว
• Snap to Guides ชวยใหการวาด/สรางวตถ, การยอขยาย หรอยายตาแหนง องเสนไกดทกาหนดไว
• Snap to Objects ชวยใหการวาด/สรางวตถ, การยอขยาย หรอยายตาแหนง องจดกงกลาง (Center Point) ของวตถ
![Page 22: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/22.jpg)
16
เครองมอวาดภาพ
การสรางภาพกราฟกตางๆ สามารถใชเครองมอกราฟกจากชดเครองมอ Toolbox โดยม
เครองมอหลายกลม และเปด/ปด Toolbox ไดจากเมนคาสง Window, Tools
Tools Modifier Tools Modifier เปนสวนขยายคาสงของเครองมอปกต โดยรายการในสวนนจะ
ปรบเปลยนไปตามเครองมอทเลอก ดงนนการเลอกเครองมอใดๆ ควรตรวจสอบคาสงยอยของเครองมอนนๆ จากสวนควบคมนดวยเสมอ
เครองมอกลมเลอกวตถ (Selection)
เครองมอกลมวาดภาพ (Draw)
เครองมอกลมจดการปรบแตงแกไข (Edit)
เครองมอกลมแสดงผล (View)
เครองมอกลมจดการส (Color)
เครองมอกลมคาสงเสรม (Tools Modifier)
![Page 23: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/23.jpg)
17
Tool modifier ของเครองมอ Tool modifier ของเครองมอ
จดการกบ Stage Stage เปนพนทหลกของการสรางงาน ดงนนเครองมอชดแรกทควรทราบ กคอเครองมอ
ในกลม View ซงจะใชในการควบคม Stage เปนหลก เชน การยอ/ขยาย Stage การเลอน Stage เปนตน
• Hand tool เปนเครองมอทใชเลอนและปรบขนาดของ Stage
o Drag & Drop เพอเลอน Stage
o ดบเบลคลกท กาหนดขนาดของ Stage ใหมขนาดพอดกบความกวางของจอภาพ (Fit on screen)
• Zoom tool เปนเครองมอปรบขนาดของ Stage
o คลกท จะปรากฏรายการเลอกยอยท Modifier คลกเลอกรปแบบการยอ หรอขยาย จากนนนาเมาสมาคลกบน Stage
o ดบเบลคลกท เพอกาหนดให Stage มขนาดเปน 100% อยางรวดเรว หมายเหต
การควบคม Stage ยงสามารถใชปม Zoom ทปรากฏอยมมบนขวาของ Stage หรอเลอกจากเมนคาสง View, Zoom in/Zoom out/Magnifier ไดเชนเดยวกน
![Page 24: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/24.jpg)
18
ส (Color) วตถใน Flash จะประกอบดวยสวนประกอบอยางนอยๆ 2 สวน ไดแก พนของวตถ
(Background หรอ Fill) และเสนขอบวตถ (Stroke) แตละสวนสามารถแสดงผลดวยสทแตกตางกนได เชน รปสเหลยมทมเสนขอบสนาเงน และพนขางในเปนสแดง ดงนนการทางานเกยวกบส จงเปนการทางานทจะตองเกยวของตลอดเวลา โดยอาศยชดเครองมอเลอกส จาก Toolbox
เมอคลกเลอกสใดๆ กจะแสดงรายการสเพอใหเลอกดงน
รายการสของ Fill และ Stroke ตางกนท Stroke ไมมสแบบโทน (Gradient)
Stroke Color Fill Color
Stroke Color สเสน
Fill Color สพนของวตถ, สตวอกษร Swap Color การสลบส Default Color
คนคาสสคาเดม คอดา, ขาว
No color การกาหนดไมใช Stroke / Fill Color
![Page 25: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/25.jpg)
19
เพมส การเพมรายการส สามารถทาไดโดยคลกทเครองมอเลอกส (จะเปนFill หรอ Stroke) กได
แลวคลกทปม Color Picker ซงปรากฏทมมบนขวาของจอภาพแสดงคาส
คลกทปม Color Picker ปรากฏจอภาพผสมสใหม
คลกในชอง Custom colors เลอกสทตองการ คลกปม Add to
การเลอกสใหกบกราฟกตางๆ ทวาดดวยเครองมอของ Flash นอกจากจะใชสวนควบคมสทกลาวไปแลว กจะมรายการเลอกสใน Properties Panel ของเครองมอนนๆ
ตวอยางการเลอกสตวอกษรจาก Text Property
ตวอยางการเลอกสพน และสเสนขอบจาก Rectangle Property
แผงควบคมส (Color Panel) Color Panel เปนการเพมประสทธภาพของการทางานเกยวกบส โดยเฉพาะในสวนทเปน
การไลโทนส (Gradient) Flash เตรยม Panel เกยวกบสไว 2 ชดคอ
![Page 26: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/26.jpg)
20
• Color Swatches ซงมการทางาน/ใชงานลกษณะเดยวกบ Toolbox
• Color Mixer มสวนเพมเตมการใชสมากกวาปกต เชน การทาสแบบไลโทน
ลกษณะตางๆ, การใชภาพกราฟกมาเปนพนของกราฟก (Texture) รวมทงการปรบคาความโปรงใสของส (Alpha)
การเลอกรายการจาก Color Mixer มรายการทนาสนใจ คอ Fill Type ซงจะชวยใหผใชสามารถเลอกรปแบบของสไดหลากหลายลกษณะ เชน สพน (Solid Color), สไลโทนแบบเสนตรง (Linear Gradient), สไลโทนแบบรศม (Radial Gradient) และการนาภาพจากภายนอกมาเปนพนของวตถ (Bitmap Background)
Color Value คาสในโหมด RGB
Alpha Value คาความโปรงใสของส
รหสสฐาน 16
![Page 27: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/27.jpg)
21
ตวอยางการกาหนดคาโปรงใสของส
รปวงกลมไมไดกาหนดคาความโปรงใส กจะซอนทบสเหลยมแบบไมเหนภาพดานหลง แตถากาหนดวงกลมใหมคาโปรงใส กจะทาใหสของวงกลมมลกษณะจาง และมองทะลไปเหน รปดานหลงได
ชดสแบบไลโทน จาก Color Mixer Panel ผใชยงสามารถเพมชดสแบบไลโทน (Gradient) ได ดงน • คลกเลอกรายการ Fill Type เปน Linear (ไลโทนในแนวระนาบ) หรอ Radial
(ไลโทนในแนวรศม)
• นาเมาสไปคลกใต Gradient definition bar จะปรากฏ Gradient Pointer กาหนด
จานวน Gradient Pointer ตามตองการ
• ถาตองการลบ Gradient Pointer ใหนาเมาสไปช ณ Gradient Pointer ทตองการลบ
แลวลากออกจาก Gradient definition bar
Linear
Radial
![Page 28: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/28.jpg)
22
• กาหนดสใหกบ Gradient Pointer โดยคลกท Gradient Pointer ชนทตองการ จากนนคลกเลอกสจาก Current Color ทาซากบ Gradient Pointer ตาแหนงอน
• สามารถเลอนปรบตาแหนงของ Gradient Pointer โดยใชหลก Drag & Drop • คลกปม Color Mixer Option Menu แลวเลอกคาสง Add Swatch เพอเพมสท
กาหนดใหกบโปรแกรม
วงกลม, วงร
• คลกเลอกเครองมอ Oval • กาหนดสพน, สเสนขอบ และลกษณะของเสนขอบจาก Oval Properties
o ถาตองการรปทไมเตมสพน หรอสเสนขอบ เลอกรายการสเปน None
![Page 29: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/29.jpg)
23
o กาหนดลกษณะของเสนขอบวงร วงกลมไดโดยคลกปม แลวปรบแตงลกษณะของเสนขอบไดจาก Stroke Style Dialog Box ดงภาพ
• นาเมาสมาคลก ณ ตาแหนงทตองการวาดรป กดปมเมาสคางไว แลวลากเมาส เมอ
ไดขนาดและรปทรงทตองการ จงปลอยนวจากเมาส • ถาตองการวงกลมทสมบรณ ควรกดปม S คางไว ขณะลากเมาส
ลบวตถดวย Eraser Tool วตถตางๆ ทวาดไวแลว สามารถลบได 3 วธ คอ • ลบวตถทงหมดโดยดบเบลคลกท Eraser Tool • ลบเฉพาะ Fill หรอ Stroke ของวตถ โดย
o คลกเลอก Eraser Tool o คลกทปม Faucet o นาเมาสไปคลก ณ ตาแหนงทตองการ
ถาคลก ณ ตาแหนง Stroke โปรแกรมจะลบเสนขอบของวตถออกทงหมด
ถาคลกในพนวตถ โปรแกรมกจะลบพนวตถออกอยางรวดเรว
• ลบวตถชนทตองการ โดย
o คลกเลอก Eraser Tool
![Page 30: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/30.jpg)
24
o เลอกโหมดการลบโดยคลกท
Erase Normal ลบในสภาวะปกต คอ ลบทง Stroke และ Fill
Erase Fills ลบเฉพาะสวนทเปน Fill Erase Lines ลบเฉพาะเสนขอบ Stroke Erase Selected Fills ลบเฉพาะสวนทเลอกไว Erase Inside ลบเฉพาะสวนทเปน Fill แตถาม
การลากผานตาแหนงทเปน Fill วางๆ จะไมลบให o เลอกลกษณะหรอขนาดของ Eraser โดยคลกท o นาเมาสมาคลก หรอลากผาน ณ ตาแหนงทตองการลบ
Erase Normal Fill Stroke Selection Inside
วาดสเหลยมดวย Rectangle Tool
• คลกเลอกเครองมอ Rectangle Tool • กาหนดสพน, สเสนขอบ และลกษณะของเสนขอบจาก Rectangle Properties
o ถาตองการรปทไมเตมสพน หรอสเสนขอบ เลอกรายการสเปน None o กาหนดลกษณะของเสนขอบไดโดยคลกปม
• เลอกลกษณะมมของสเหลยม วาตองการใหโคงมนหรอไม จากตวเลอก
![Page 31: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/31.jpg)
25
• นาเมาสมาคลก ณ ตาแหนงทตองการวาดรป กดปมเมาสคางไว แลวลากเมาส เมอไดขนาดและรปทรงทตองการ จงปลอยนวจากเมาส
• ถาตองการสเหลยมจตรสทสมบรณ ควรกดปม S คางไว ขณะลากเมาส
วาดรปหลายเหลยมดวย Poly Star Tool
• คลกเลอกเครองมอ Rectangle Tool คางไวสกคร จากนนคลกเลอกเครองมอ PolyStar Tool
• กาหนดสพน, สเสนขอบ และลกษณะของเสนขอบจาก Rectangle Properties
o ถาตองการรปทไมเตมสพน หรอสเสนขอบ เลอกรายการสเปน None o กาหนดลกษณะของเสนขอบไดโดยคลกปม o กาหนดจานวนเหลยมของรป โดยคลกปม ซงมรายการเลอก ดงน
• นาเมาสมาคลก ณ ตาแหนงทตองการวาดรป กดปมเมาสคางไว แลวลากเมาส เมอ
ไดขนาดและรปทรงทตองการ จงปลอยนวจากเมาส • ถาตองการรปทสดสวนสมบรณ ควรกดปม S คางไว ขณะลากเมาส
![Page 32: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/32.jpg)
26
วาดเสนดวย Line Tool
• คลกเลอกเครองมอ Line Tool • กาหนดสเสนขอบ และลกษณะของเสนขอบจาก Line Properties
o กาหนดลกษณะของเสนขอบไดโดยคลกปม
• นาเมาสมาคลก ณ ตาแหนงทตองการวาดรป กดปมเมาสคางไว แลวลากเมาส เมอไดขนาดและทศทางทตองการ จงปลอยนวจากเมาส
• ถาตองการเสนตรงเรยบ หรอเสนททามม 45 องศา ควรกดปม S คางไว ขณะลากเมาส
วาดรปอสระดวย Pencil Tool
• คลกเลอกเครองมอ Pencil Tool • เลอกส และลกษณะของเสนจาก Pencil Properties
o กาหนดลกษณะของเสนขอบไดโดยคลกปม
• เลอกโหมดการวาดจาก
![Page 33: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/33.jpg)
27
• นาเมาสไปคลก ณ ตาแหนงทตองการวาด แลวลากเมาสเพอใหไดรปทรงทตองการจงปลอยนวจากเมาส
โหมดการวาดแบบ Straighten
โหมดการวาดแบบ Smooth
วาดรปดวย Brush Tool
• คลกเลอกเครองมอ Brush Tool • เลอกสของภาพจาก Brush Properties
o เลอกคาความโคงมนของเสนไดจากรายการ Smoothing
• เลอกฟงกชนการวาดโดยคลกเลอกจาก Brush Options
• กรณทวาดภาพทบวตถทมอยเดม ควรเลอกโหมดการวาดโดยคลกท
![Page 34: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/34.jpg)
28
o Paint Normal วาดทบวตถทมอยเดม o Paint Fills วาดทบเฉพาะสวนทเปน Fill ของวตถเดม o Paint Behind วาดตาแหนงทเปน Stage โดยไมกระทบตอวตถทมอย o Paint Selection วาดทบเฉพาะสวนทเลอกไว o Paint Inside วาดเฉพาะขางในวตถ โดยไมกระทบตอเสนขอบ
Normal Fills Behind Selection
• เลอกลกษณะและขนาดของ Brush
• นาเมาสมาวาง ณ ตาแหนงเรมตน แลวลากเมาสเพอวาดภาพทตองการ
วาดภาพอสระดวย Pen Tool
• คลกเลอกเครองมอ Pen Tool • เลอกสและลกษณะเสนขอบ จาก Pen Properties
o ถาตองการรปทไมเตมสพน หรอสเสนขอบ เลอกรายการสเปน None o กาหนดลกษณะของเสนขอบไดโดยคลกปม
• นาเมาสมาคลก ณ ตาแหนงเรมตนทตองการวาดภาพ จากนนคลกไปยงตาแหนงใหม ตามทตองการ จะปรากฏเสน ถาตองการดดใหเกดความโคง ใหกดปมเมาสคางไวแลวหมนเมาสเพอใหไดความโคงทตองการ จากนนจงนาเมาสไปคลก ณ ตาแหนงใหม
![Page 35: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/35.jpg)
29
• เมอตองการจบการวาดสามารถเลอกปฏบตไดดงน
o ดบเบลคลก ณ ตาแหนงทตองการจบการวาด o นาเมาสไปคลก ณ ตาแหนงเรมตน o คลกเลอกเครองมออนๆ
![Page 36: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/36.jpg)
30
การเลอกวตถ (Selection)
วตถในความหมายน กคอ รปทรง รปภาพ ภาพกราฟกทวาด หรอนาเขามาใชงานใน
Flash นนเอง การเลอกวตถ เปนขนตอนสาคญในการปรบเปลยน แกไข แปลงวตถ โดยโปรแกรมเตรยมเครองมอเลอกวตถดงน
Arrow Tool สาหรบเลอกวตถในสภาวะปกต
Subselection Tool สาหรบการเลอกวตถในโหมดจดเชอม
Lasso Tool สาหรบการเลอกวตถทมรปทรงอสระ หรอกาหนดขอบเขตการเลอกอสระรวมทงการเลอกโดยใชคาสทมคาเดยวกนหรอใกลเคยงกน
สงสาคญทสดในการเลอกวตถใน Flash กคอ อยาลมวาวตถทกชนเกดจาก “จด” หลายๆ จดมาประกอบรวมกน และแตละวตถจะประกอบดวยโครงสรางอยางนอย 2 สวนคอ สวนทเปน “Fill” และสวนทเปน “Stroke” ดงน
![Page 37: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/37.jpg)
31
Stroke Fill Shape
รปแสดง “จด” อนเกดจากการเลอกบางสวนของวงกลม
การเลอกวตถ หรอกลมวตถดวย Arrow Tool
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ โดยยดหลกดงน
o เลอกเสนขอบของวตถ นาเมาสไปชทเสนขอบวตถ แลวคลกหรอ ดบเบลคลก
o เลอกพนวตถ นาเมาสไปชทพนวตถ แลวคลกหรอ ดบเบลคลก
เลอกเสนขอบ เลอกพนวตถ
o เลอกวตถทงชน นาเมาสไปชทวตถ แลวดบเบลคลก
o เลอกวตถทงชน นาเมาสไปช ณ ตาแหนงมมของวตถ แลวลากกรอบสเหลยมคลมวตถ
![Page 38: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/38.jpg)
32
o เลอกวตถหลายๆ ชน นาเมาสไปช ณ ตาแหนงมมของวตถ แลวลากกรอบสเหลยมคลมวตถ
การเลอกวตถโดยการลากคลมพนท
o เลอกวตถหลายๆ ชน คลกวตถชนท 1 กดปม S คางไว แลวคลกวตถชนถดไปเรอยๆ
o เลอกวตถทกชนบน Workspace และ Stage กดปม Ca
ยกเลกการเลอกวตถ
• นาเมาสไปคลกบนตาแหนงวางๆ ของ Stage หรอ • เลอกเมนคาสง Edit, Deselect All
ซอนการเลอกวตถ บางครงผใชอาจจะตองการซอนการเลอก (Selection) ไวชวคราว เพอทางานหรอ
ตรวจสอบผลใหถกตองกอนการใชงานจรง ซงกระทาไดโดยเลอกเมนคาสง View, Hide Edges หรอกดปม Ch
เลอกวตถดวย Lasso Tool การเลอกวตถดวย Lasso Tool เปนการเลอกโดยกาหนดพนทอสระ ไมเหมอนกบ Arrow
ทกาหนดพนทการเลอกเปนสเหลยม หรอเลอกชนวตถทงชน • คลกเลอกเครองมอ Lasso Tool • นาเมาสไปช ณ ตาแหนงเรมตนของการเลอก
![Page 39: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/39.jpg)
33
• กดปมเมาสคางไวแลวลากใหไดรปทรง และขนาดทตองการ
การเลอกวตถดวย Lasso ยงสามารถกาหนดพนทการเลอกเปนพนทหลายเหลยมไดดงน • คลกเลอกเครองมอ Lasso Tool • คลกโหมดเปน Polygon จากรายการ Lasso Options • นาเมาสไปช ณ ตาแหนงเรมตนของการเลอก • คลกเมาส เพอกาหนดจดเรมตน แลวนาเมาสไปคลก ณ ตาแหนงอนๆ เพอใหได
รปทรง และขนาดทตองการ แลวดบเบลคลก ณ ตาแหนงสดทาย
ปรบแตง แกไขวตถ จดเดนของการสรางวตถดวย Flash กคอวตถ หรอกราฟกทสรางไวแลว สามารถปรบแตง
แกไข ปรบเปลยนรปทรง ขนาด และลกษณะไดงาย รวดเรว
เปลยนรปทรง กราฟกจาก Flash เกดจากการรวมกนของ “จด” ทาใหการปรบแตง เปลยนรปทรงกระทา
ไดงาย และสะดวก เพยงแตใชหลกการ Drag & Drop กทาใหรปทรงพนฐาน เชน วงกลม, วงร, สเหลยม เปนสภาพเปนรปทรงอสระอนๆ ไดตามตองการ เชน
![Page 40: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/40.jpg)
34
การเปลยนรปทรงของวตถ มหลกการดงน
• วาดรปทรงพนฐานทตองการ จากตวอยางคอรปสเหลยม
• นาเมาสไปชบรเวณเสนขอบของรป สงเกตเมาสจะมรปรางเปน กดปมเมาสคางไว เมอลากเมาสรปทรงจะถกยดหรอขยาย หรอหดตวตามทศทางการลากเมาส
• นาเมาสไปชบรเวณมมเหลยมของรป สงเกตเมาสจะมรปรางเปน กดปมเมาสคางไว เมอลากเมาสรปทรงจะถกยดหรอขยาย หรอบดตวตามทศทางการลากเมาส
ตวอยางการวาดจรวดแบบงาย
วาดสเหลยมผนผา เลอกเครองมอ Move เลอนไปชทมมบนขวา
ของสเหลยม ดงเขามาตาแหนงกงกลางของดานขวา ถาดงแลวสดสวนบดเบยวใหคลก เพอตรงกาหนดการบดภาพ จากนน ทาซากบมมลางขวา
![Page 41: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/41.jpg)
35
เลอนไปชทขอบซาย แลวดงเขามาดานใน
ใหไดเปนรปจรวดดงตวอยาง
การยายวตถ (วธท 1)
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ แลวลากเมาสเพอยายวตถไปยงตาแหนงใหม • เลอนวตถเปนแนวเฉยง 45 องศา ใหกด S ดวย • เลอนวตถเปนระยะทางสนๆ ครงละ 1 pixel ใหใชปมลกศร • เลอนวตถเปนระยะทางสนๆ ครงละ 10 pixel ใหใชปมลกศร พรอมกบการกด
S • เลอนวตถไปยงตาแหนงตางๆ โดยระบพกด ใหระบพกด x, y จาก Shape
Properties ตาแหนงมมบนซายของ Stage จะมพกดเปน 0, 0
การยายวตถ (วธท 2 - กรณยายขาม Scene, ขามเฟรม หรอขามไฟล)
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ • เลอกคาสง Edit, Cut • เปลยน Scene, ตาแหนงเฟรม หรอเปลยนไฟล • เลอกคาสง
o Edit, Paste เพอวางวตถตรงกลาง Stage o Edit, Paste in Place เพอวางวตถ ณ ตาแหนงเดม
![Page 42: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/42.jpg)
36
การคดลอกวตถ (วธท 1)
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ แลวลากเมาสวตถไปยงตาแหนงใหม พรอมๆ กบการกดปม C หรอ
A
การคดลอกวตถ (วธท 2 - สาเนาวตถ: Duplicate)
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ แลวกดปม Cd
การคดลอกวตถ (วธท 3 - กรณขาม Scene, ขามเฟรม, ขามไฟล)
• คลกเลอกเครองมอ Arrow Tool • เลอกวตถ • เลอกคาสง Edit, Copy • เปลยน Scene, ตาแหนงเฟรม หรอเปลยนไฟล • เลอกคาสง
o Edit, Paste เพอวางวตถตรงกลาง Stage o Edit, Paste in Place เพอวางวตถ ณ ตาแหนงเดม
การยกเลกคาสง (Undo) เมอสงงานใดๆ ผดพลาด สามารถยอนกลบ หรอยกเลกคาสงนนๆ ไดโดยคลกปม Cz หรอ Edit, Undo… ซงสามารถยกเลกคาสงยอนหลงไดมากกวา 1 ครง
![Page 43: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/43.jpg)
37
การยอ/ขยาย และปรบรปทรงของวตถ
• เลอกวตถ • คลกปมเครองมอ Free Transform Tool
วตถสภาวะปกต วตถในสภาวะ Free Transform
• นาเมาสไปชทมม หรอขอบวตถ แลว Drag & Drop เพอปรบขนาด หรอรปทรงตามตองการ
• นอกจากนการยอ/ขยายขนาดของวตถ ยงสามารถเลอกหรอกาหนดคาจาก Info
Panel (เปดใชงานดวยคาสง Window, Design Panels, Info)
• รวมทงกาหนดคาจาก Property Panel
![Page 44: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/44.jpg)
38
• คลกเลอกจากเมนคาสง Modify, Transform,… ซงมคาสงใหเลอกทงคาสงหมนวตถ, คาสงกลบดานของวตถ เปนตน
ภาพตนฉบบ Distort
Envelop Skew
การจดเรยงวตถ (Alignment) บางครงวตถทตองใชงานจะมมากกวา 1 ชน ซงจาเปนตองจดเรยงตาแหนงใหอยในแนว
ระดบเดยวกน หากใชเมาสลากแลวปลอยโอกาสทจะตรงกน หรอในแนวเดยวกนกทาไดยาก Flash ไดเตรยมคาสง Align เพอชวยจดเรยงวตถไดสะดวก รวดเรว
• เปด Align Panel โดยคลกทคาสง Window, Design Panels, Align
• เลอกวตถ (มากกวา 1 ชน)
![Page 45: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/45.jpg)
39
• คลกเลอกรายการทตองการ o Align เพอจดตาแหนงในแนวเดยวกน o Distribute เพอจดระยะชองวางระหวางวตถใหเทาๆ กน o Match size: เพอกาหนดขนาดของวตถ ใหมขนาดเดยวกน o Space เพอจดระยะชองวางระหวางวตถใหเทาๆ กน o To stage: ใหคาสงทเลอกมผลกบวตถทสมพนธกบ Stage
• เชนตองการจดวตถใหอยกงกลาง Stage กใหคลก To stage แลวคลก Align ในโหมด Align Horizontal กบ Align Vertical เปนตน
ตวอยางการจดวตถกงกลางจอภาพ
วาดวตถใหอยนอก Stage เปด Align Panel (Window, Design Panels, Align) เลอกวตถดวยเครองมอ Move คลก ตอดวย และ
การปรบเปลยนลกษณะเสนขอบวตถ
• เลอกเสนขอบวตถ แลวคลกเลอกลกษณะ, สไดจากรายการใน Property
การปรบเปลยน Fill ของวตถ
• เลอก Fill ของวตถวตถ แลวคลกเลอกลกษณะ, สไดจากรายการใน Property
![Page 46: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/46.jpg)
40
การคดลอกลกษณะเสนขอบวตถ การคดลอกลกษณะเสนขอบวตถ จะชวยใหการปรบแตงแกไขวตถมากกวา 1 ชนทาไดสะดวกกวาการปรบเปลยนทละชน ตวอยางมวตถบน Stage 3 ชนลกษณะตางๆ กน ดงภาพ
ตองการใหวงกลม และสเหลยมเสนขอบดา มเสนขอบเดยวกบสเหลยมชนทสอง ทมเสนขอบเปนจดสแดง หากตองเลอกแลวปรบเปลยนทละชน กจะเสยเวลามาก วธการทสะดวก คอ
• คลกเลอกเครองมอ Eyedropper • นาเมาสซงมรปรางเปน Eyedropper ไปชทเสนขอบของสเหลยมชนตนฉบบ
(สเหลยมดานขวาสด) สงเกตไดวาเมาสจะมรปรางเปน แสดงวาไดเลอกเสนขอบวตถไดถกตอง เมอคลกเมาส 1 ครงเมาสจะเปลยนรปรางเปน แสดงวาขณะน Flash อยในโหมด Ink Bottle ซงเปนโหมดในการคดลอกลกษณะเสนขอบนนเอง
• นาเมาสทเปนรปราง ไปคลกบนวตถชนอนๆ ทตองการปรบเปลยนลกษณะเสนขอบ
การคดลอกลกษณะพนของวตถ นอกจากการคดลอกลกษณะเสนขอบวตถ ยงสามารถใชหลกการเดยวกนคดลอกลกษณะพนของวตถไดดวย โดย
• คลกเลอกเครองมอ Eyedropper
![Page 47: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/47.jpg)
41
• นาเมาสซงมรปรางเปน Eyedropper ไปชทพนของสเหลยมชนตนฉบบ (สเหลยม
ดานขวาสด) สงเกตไดวาเมาสจะมรปรางเปน แสดงวาไดเลอกพนวตถได
ถกตอง เมอคลกเมาส 1 ครงเมาสจะเปลยนรปรางเปน แสดงวาขณะน Flash
อยในโหมด Paint Bucket ซงเปนโหมดในการคดลอกลกษณะพนนนเอง
• นาเมาสทเปนรปราง ไปคลกบนวตถชนอนๆ ทตองการปรบเปลยนลกษณะพนวตถ
การปรบเปลยนสแบบ Gradient วตถทมการลงสพนแบบ Gradient สามารถปรบเปลยนลกษณะการแสดงผลของสไดโดย
• คลกเลอกเครองมอ Fill Transform Tool • นาเมาสไปคลกวตถชนทตองการปรบเปลยน
• ปรากฏ Fill Handle 4 จด สามารถเลอนปรบเปลยนได
![Page 48: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/48.jpg)
42
กลมวตถ (Group) ภาพกราฟกหลายๆ ภาพ ไดจากภาพ หรอรปทรงยอยหลายๆ ชนมารวมกน เพอให
การปรบแตงแกไข เคลอนยายกระทาไดสะดวก มกจะรวมภาพกราฟก หรอรปทรงทกชนทเกยวของ ใหเปนกลมเดยวกนโดยเลอกวตถทกชน แลวเลอกเมนคาสง Modify, Group และเมอตองการแยกกลบสสภาพเดมกเลอกคาสง Modify, Ungroup
รปการตนทเกดจาก Shape หลายชนประกอบรวมกน
ปญหาจากการยาย Shape รปทยงไมไดรวมกลม
รปทผานการรวมกลมแลวจะมเสนขอบสฟาลอมรอบ
การแยกชนสวนของวตถ วตถบางชนทเปน Group หรอ Instance เมอจะตองนามาทาเปน Movie แบบ Shape
Tweening จาเปนตองแยกชนสวนของวตถใหอยในสภาวะ “จด” กอนเสมอ ซงทาไดโดยเลอกวตถกอน จากนนจงใชเมนคาสง Modify, Break Apart หรอกดปม Cb
![Page 49: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/49.jpg)
43
รปภาพในสภาวะกลม
รปภาพทผานการ Break Apart แลว
การจดเรยงลาดบวตถทเปน Group วตถทอยในสภาวะ Group และมการซอนทบกน สามารถจดเรยงลาดบของวตถไดใหม
โดยเลอกวตถดวย Arrow Tool เลอกเมนคาสง Modify, Arrange… หรอ เลอกคาสงยอย
o Bring to front นาวตถไปอยบนสด o Bring forward นาวตถขนไป 1 ชน o Send to back สงวตถไปอยลางสด o Send backward สงวตถลง 1 ชน o Lock ตรงวตถไมใหเคลอนยายตาแหนง o Unlock All ยกเลกการตรงวตถ
การปรบแตงแกไขวตถทเปน Group วตถทอยในสภาวะ Group สามารถยอ/ขยาย หมนไดอสระ แตจะไมสามารถปรบแตง
แกไขเกยวกบสได หากตองการปรบเปลยนสของวตถทเปน Group จะตองเขาไปแกไขในโหมดจอภาพเฉพาะเกยวกบ Group ซงกระทาไดโดยการดบเบลคลกทวตถนนๆ จอภาพจะเขาสโหมด
การแกไข Group ซงสงเกตไดจาก
![Page 50: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/50.jpg)
44
• Scene 1 หมายถงจอภาพในโหมดหลก • Group หมายถงจอภาพในโหมดแกไข Group จะสงเกตไดวาวตถชนอน
จะมสทจางไป
จอภาพโหมดปกต (Scene1) โหมดแกไข Group จะพบวาภาพคลน ทะเลจะจางกวาปกต
เมอปรบแตงแกไขวตถเรยบรอยแลว ใหคลกท Scene 1 เพอกลบสโหมดการทางานปกตดวยทกครง
![Page 51: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/51.jpg)
45
ฝกหดวาดภาพ
เมอรจกโปรแกรมและเครองมอตางๆ ของ Flash แลว กจะเขาสบทเรยนฝกหดวาดภาพ
ซงมหลกทไมยากอยางทคด ขอใหนกถงหลก “เชอม ตด ปรบเปลยน” เทานนกพอ
วาดแผนท แบบฝกหดแรก คอการวาดแผนทแสดงเสนทาง โดยอาศยหลกการเชอมและตด
• สรางไฟล Flash กาหนดขนาดของ Stage ตามตองการ • เลอกเครองมอวาดกรอบสเหลยม คลกปมควบคมการทาขอบมนใน Tool
Modifier กาหนดความมนของขอบประมาณ 40 – 50 หนวย
• เลอกสเสนขอบ สพน และขนาดของเสนขอบจาก Properties Panel
![Page 52: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/52.jpg)
46
• วาดเสน ใหมลกษณะ ดงน
สามารถปรบประยกตใหไดลกษณะอนๆ ตามตองการ
• จากภาพจะพบวาเปนการนากรอบสเหลยมหลายขนาดมาวางซอนกนทบ ลกษณะนคอการใชเทคนค “เชอม” การทจะทาใหมลกษณะเปนเสนทางแผนท จะตองตดสวนบางสวนของกรอบสเหลยมออกไป ดงน
• การตดสวนดงกลาวทง เรมจากการเลอกเครองมอ Selection • นาเมาสไปคลก ณ สวนทตองการตด จะพบวาสวนทเลอกมลกษณะเปน “จดเลกๆ
หลายจด” ดงตวอยาง
สวนทตองตดทง
สวนทตองการคลกเพอลบทง
![Page 53: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/53.jpg)
47
• จากนนกดปม = เพอลบสวนทเลอก จะปรากฏผลดงน
• ทาซากบสวนอน ทตองการลบ โดยการใชเครองมอ Selection เลอกกอนแลวกดปม
= เพอลบทง
หนาคนจากวงกลมและเสนตรง
วาดวงกลม วาดเสนตรงผาน
สวนบนของวงกลมในลกษณะเฉยงดงภาพ
เลอกเครองมอ Selection เลอนเมาสไปชทเสนตรง ใหเมาสมรปรางเปน
กดปมเมาสคางไว แลวดงใหเสนมลกษณะโคง
คลกเลอกเสนทอยนอกวงกลม กดปม = เพอลบทง
เลอกสผม แลวเตมส วาดตา จมก และปากดวยเครองมอวาดเสน หรอ ดนสอ แลวปรบใหมความโคงตามตองการ
![Page 54: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/54.jpg)
48
หนาคนจากหลายๆ วตถ
เดกชายสวมหมวก
เดกหญง
![Page 55: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/55.jpg)
49
คนสงอาย
ดวงอาทตย
รองเทาสเกต
![Page 56: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/56.jpg)
50
ถงเทาเดก
หมวก
![Page 57: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/57.jpg)
51
ใบไม
ตนครสมาตส
![Page 58: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/58.jpg)
52
ตนไม
ตนไม
ดอกไม
![Page 59: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/59.jpg)
53
ดนสอ
ตกตาหม
![Page 60: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/60.jpg)
54
ฮปโป
ผลไมการตน
สตอรเบอรร
![Page 61: Drawing with Flash](https://reader033.vdocuments.mx/reader033/viewer/2022042813/54b2e6724a7959db5e8b4597/html5/thumbnails/61.jpg)
55
ภาพลกษณะอนๆ