สำหรับเวอร์ชั่นเบื้องต้นที่เราจะเริ่มใช้งาน flash ในที่นี้ก็คือเวอร์ชั่น flash cs3 ซึ่งเป็นเวอร์ชั่นที่ผมยังคงใช้งานได้ดีอยู่แม้เวอร์ชั่น flash cs4 จะออกมาแล้วก็ตาม (แนะนำให้หาหนังสือ flash พื้นฐานการใช้งานโปรแกรมอ่านเพิ่มเติมสำหรับคนที่ยังไม่เคยใช้โปรแกรม flash เพราะผมคงไม่สามารถอธิบายทุกเมนูหมดได้ในช่วงเริ่มต้น เพราะจะทำให้เริ่มในส่วนของการเขียน actionscript ได้ช้าครับ)
สิ่งที่จะได้เรียนรู้ในบทเรียนนี้
1. การเริ่มต้นสร้างไฟล์แฟลช
2. รู้จักไฟล์ประเภทต่างๆ
3. รู้จักนามสกุลที่ถูกนำไปใช้
4. วิธีสร้างไฟล์ที่จะนำไปใช้
5. การนำไฟล์ swf ไปใช้งาน
โดยหน้าตาเริ่มต้นเมื่อเปิดโปรแกรม จะเป็นดังต่อไปนี้
โดยเริ่มต้นเราสามารถทำการสร้างไฟล์ flash ได้ 3 วิธีคือ
1. การสร้างผ่านเมนู File แล้วจึงเลือก ผ่านเมนู New
เมื่อทำการกดปุ่ม New จะมีให้เลือกสร้างไฟล์ จาก 2 หมวดดังต่อไปนี้
ทำการสร้างเอกสารประเภทต่างๆ
ทำการสร้างไฟล์จากเทมเพลตที่ได้จัดเตรียมไว้แล้ว
สำหรับอีก 2 วิธีคือ
2. การสร้างโดยกดปุ่ม Shortcuts คือ <Ctrl+N>
3. สร้างผ่านหน้าต่าง ด้านล่าง ซึ่งจะขึ้นเมื่อเปิดโปรแกรม flash
โดยวิธีที่ 3 นี้จะแบ่งออกเป็น 3 ส่วนคือ
Open Recent Item - แสดงไฟล์ล่าสุดที่ได้ทำการแก้ไข
Create New - สร้างเอกสารไฟล์ประเภทต่างๆ
Create from Template - สร้างไฟล์แฟลช จากเทมเพลตที่โปรแกรมได้เตรียมไว้ให้แล้ว
ซึ่งจะเห็นว่า สามารถเลือกสร้างไฟล์ได้เช่นเดียวกับวิธีที่ 1 แต่ถ้าเราติ๊กตรงช่อง Don't show again หน้าต่างนี้ก็จะไม่ถูกแสดงอีกเมื่อเปิดโปรแกรมในครั้งถัดไป
คำอธิบายของเอกสารต่างๆ
Flash File (ActionScript 3.0) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้ actionscript เวอร์ชั่น 3.0
Flash File (AtcionScript 2.0) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้ actionscript เวอร์ชั่น 2.0
Flash File (Mobile) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้งานสำหรับ มือถือ (flash lite)
ActionScript File - ทำการสร้างไฟล์สำหรับเขียน actionscript ทั้ง 2.0 และ 3.0
ActionScript Communication File - ทำการสร้างไฟล์ actionscript สำหรับใช้บนเซิรฟ์เวอร์
Flash JavaScript File - ทำการสร้างไฟล์ JSFL (เหมาะสำหรับการเขียนคำสั่งเพื่อทำงานแบบอัตโนมัติเพื่อใช้งานซ้ำๆในการจัดการต่างๆ)
Flash Project - ทำการสร้างไฟล์โปรเจกต์ ซึ่งรวบรวมรายชื่อไฟล์ทั้งหมดของโปรเจกต์นั้นๆ
ส่วนการสร้างไฟล์แฟลชจาก เทมเพลตนั้น จะเป็นเทมเพลตที่เตรียมมไว้ให้สำหรับการสร้าง แบนเนอร์โฆษณา, แฟลชบนมือถือ, สไลด์โชว์ และแบบสอบถาม ซึ่งสามารถทดลองสร้างดูได้
-----------------------------------
ทดลองสร้างไฟล์ flash
เมื่อเรารู้วิธีสร้างไฟล์แฟลช แล้วให้เราทดลองทำการสร้างไฟล์แฟลชดูจากวิธีใดวิธีหนึ่ง โดยทดลองกด <Ctrl+N> แล้วเลือกเอกสารประเภท Flash File (ActionScript 2.0) จะได้หน้าตาดังตัวอย่าง
ซึ่งเราจะอธิบายองค์ประกอบต่างๆในหัวข้อถัดไป แต่ตอนนี้เราจะลองทำการเซฟไฟล์แฟลช และทำการสร้างไฟล์แฟลชที่ถูกนำไปใช้จริงกันก่อน โดยทำการเซฟไฟล์แฟลชที่เพิ่งถูกสร้างขึ้น โดยเเลือกเมนู File-->Save หรือกด <Ctrl+S> เพื่อทำการเซฟเอกสาร โดยในที่นี้เซฟไฟล์ชื่อว่า testCreateFla
โดยไฟล์แฟลชจะมีนามสกุลคือ ".fla" และตอนเซฟไฟล์นั้น เราสามารถเลือกเซฟย้อนกลับไปได้อย่างน้อย 1 เวอร์ชั่น (cs3 คือเวอร์ชั่น 9 ฉะนั้นสามารถเซฟเป็นเวอร์ชั่น 8 ได้)
ข้อควรรู้ - เมื่อเปิดไฟล์แฟลชคนละเวอร์ชั่นกับตอนที่เซฟ เราสามารถนำแฟลชที่ถูกเซฟจากเวอร์ชั่นเก่ากว่า มาเปิดในโปรแกรมแฟลชเวอร์ชั่นใหม่กว่าได้ แต่เราไม่สามารถเอาไฟล์แฟลชที่ถูกเซฟจากเวอร์ชั่นที่ใหม่กว่าไปเปิดยังโปรแกรมแฟลชเวอร์ชั่นที่เก่ากว่าได้ (ฉะนั้นไฟล์ที่ถูกเซฟจาก cs3 จะไม่สามารถนำไปเปิดในแฟลชเวอร์ชั่น 8 ได้ ดังนั้นต้องเซฟให้ตรงกับเวอร์ชั่นที่จะนำไปเิปิด ไม่งั้นแฟลชจะเตือนว่าไม่สามารถเปิดได้)
เมื่อทำการเซฟไฟล์เสร็จแล้ว เราจะทำการสร้างไฟล์ swf ขึ้นมา ซึ่งจะเป็นไฟล์ที่ถูกนำไปใช้จริงทั้งงานออฟไลน์ (เปิดบนเครื่อง) และงานออนไลน์ (บนเว็บไซต์)
โดยเราสามารถทำการสร้างได้ 3 วิธีคือ
1. ทำการกดทดสอบโดยการกด <Ctrl+Enter> ซึงจะได้เฉพาะไฟล์ประเภท swf เท่านั้น
2. เลือกเมนู File --> publish โดยจะได้ไฟล์ทั้งหมดตามที่เราเลือกเอาไว้
3. เลือกเมนู File --> export โดยจะได้ไฟล์ตามนามสกุลที่เราเลือก
1. การสร้างไฟล์ swf ด้วยการกดทดสอบโดยการกด <Ctrl+Enter>
โดยวิธีแรกนั้น เมื่อทำการกดปุ่ม <Ctrl+Enter> จะได้ผลลัพธ์ดังต่อไปนี้
เนื่องจากเราไม่ได้ทำการวาดหรือวางอะไรลงไป จึงเห็นผลลัพธ์เป็นเพียงพื้นที่สีขาวเท่านั้น และเมื่อเราลองดูในโฟลเดอร์ที่เราได้ทำการบันทึกไฟล์ testCreateFla.fla เอาไว้ จะเห็นว่า ไฟล์ testCreateFla.swf ได้ถูกสร้างขึ้นที่เดียวกัน
2. การสร้างไฟล์ swf และอื่นๆด้วยการเลือกเมนู publish
สำหรับวิธีนี้เราสามารถเลือกสร้างไฟล์นามสกุลอื่นๆ นอกจาก swf ได้ โดยจะมี 3 เมนูดังต่อไปนี้
Publish Settings... - เลือกนามสกุลไฟล์ที่ต้องการสร้างเมื่อกด publish รวมถึงเซตค่าต่างๆ
Publish Preview - เลือกดูผลลัพธ์แต่ละประเภท โดยจะเลือกดูได้เฉพาะที่เลือกไว้ในเมนู Publish Setting เท่านั้น
Publish - ทำการสร้างไฟล์นามสกุลต่างๆทั้งหมด ตามที่ได้เลือกไว้ใน Publish Setting
ทดลองเลือกเมนู Publish Setting จะขึ้นให้เลือกเซตค่าต่างๆ
ซึ่งเมนู tab แรกจะเป็นการเซตนามสกุลของไฟล์ที่จะถูกสร้างขึ้น ประกอบด้วย
Flash (.swf) - ไฟล์แฟลช
็HTML (.html) - ไฟล์ html ที่จะถูกฝังโค้ดแฟลชให้โดยอัตโนมัติ
Gif Image (.gif) - ไฟล์ภาพประเภท gif
JPEG Image (.jpg) - ไฟล์ภาพประเภท jpg
PNG Image (.png) - ไฟล์ภาพประเภท png
Window Projector (.exe) - ไฟล์โปรเจกเตอร์นามสกุล exe
Macintosh Projector - ไฟล์โปรเจกเตอร์เครื่อง Macintosh นามสกุล app
QuickTime with Flash Track (.mov) - ไฟล์วิดีโอนามสกุล mov เปิดด้วย QuickTime Player
สำหรับช่อง File นั้นเราสามารถระบุชื่อที่ต้องการให้สร้างลงไปได้ เนื่องจากว่าบางครั้งเราอาจจะเซฟ fla เป็นหลายๆชื่อเพื่อเก็บไฟล์เก่าไว้ แต่ไม่ต้องการให้ไฟล์ผลลัพธ์ที่ถูกสร้างขึ้นเปลี่ยนชื่อตาม และเสียเวลาต้องมาแก้ชื่อทีหลัง จึงมีช่องนี้ไว้ให้ระบุชื่อที่ต้องการรวมถึงพาธที่จะสร้างไฟล์ ลงไปได้
ข้อควรรู้- มักมีคำถามๆอยู่บ่อยๆว่า จะนำแฟลชไปเปิดเครื่องที่ีไม่มี flash player ได้อย่างไร ถ้าเครื่องนั้นไม่ได้ลง flash player ให้กับบราวเซอร์(ปกติ flash player จะถูกลงในบราวเซอร์อย่างเช่น ie, firefox หรือ safari โดยสามารถโหลดได้ที่เว็บ adobe หรือลงโปรแกรม flash) ซึ่งปกติถ้าเราลงแฟลชที่เครื่องคอมนั้นๆ โปรแกรมจะลง flash stand alone player ให้ซึ่งสามารถใช้เปิดไฟล์นามสกุล swf ได้เลย แต่ถ้าไม่มีทั้งสองเงื่อนไข เราสามารถเลือก publish ไฟล์เป็นนามสกุล .exe สำหรับเครื่อง pc หรือ .app สำหรับเครื่อง mac ซึ่งจะสามารถเปิดได้เลยโดยไม่ต้องมี flash player หรือ flash stand alone player
สำหรับ tab ที่ 2 นั้น
จะสามารถปรับค่าได้คือ
Version ปรับเวอร์ชั่นของ Flash Player ที่จะเล่น ซึ่งบางครั้งเมื่อมีการนำงานที่เซฟจากเวอร์ชั่นเก่ามา ก็จะถูกกำหนดเป็น Flash Player เวอร์ชั่นเก่าที่ใช้ในการเล่น ซึ่งสามารถปรับได้จากช่องนี้ หากต้องการใช้ ActionScript ที่เพิ่มมาใน flash player เวอร์ชั่นใหม่ๆ
Load order จะเป็นลำดับในการคอมไพล์ไฟล์ swf รวมถึง action script โดยจะไล่ลำดับจากระดับล่างขึ้นมาระดับบน หรือจากระดับบนลงไปด้านล่าง (ลำดับในที่นี้มีทั้งลำดับการจัดเรียงของเลเยอร์ และการซ้อนกันของระดับไทม์ไลน์)
ActionScript version เป็นการตั้งค่าเวอร์ชั่นของ ActionScript ที่จะใช้ในการเขียนโปรแกรม โดยจะมีตั้งแต่เวอร์ชั่น 1-3 โดยส่วนใหญ่จะใช้ 2 หรือ 3 เป็นหลัก
Options :
- Generate size report สร้างรายงานรายการขนาดของข้อมูลในแฟลช โดยสร้างรายงานออกมาเป็นไฟล์
- Protect from import ป้องกันผู้อื่นจากการอิมพอรต์ไฟล์ swf และแปลงมันกลับไปเป็นเอกสาร FLA โดยจะให้คุณสามารถใช้รหัสในการปกป้องไฟล์ swf ของคุณได้
- Omit trace actions ยกเลิการแสดงค่าผ่านคำสั่ง trace ในไฟล์ swf โดยเมื่อเลือกคำสั่งนี้ จะทำให้ไม่มีผลลัพธ์จากคำสั่ง trace แสดงผ่านทางหน้าต่าง output
- Permit debugging ยืนยันการใช้งาน debugger (ไว้ตรวจสอบข้อผิดพลาด) และยอมให้ตรวจสอบข้อผิดพลาดระยะไกล (remote) ไฟล์ swf ได้ ซึ่ง คุณสามารถใช้รหัสในการปกป้องไฟล์ swf ของคุณได้
- Compress movie ทำการบีบอัพขนาด swf เพื่อลดขนาดของไฟล์และจำนวนครั้งในการดาวน์โหลด ซึ่งจะมีประโยนช์เมื่อไฟล์ข้อความ หรือไฟล์ ActionScript (สามารถใช้งานได้ในเวอร์ชั่น 6 หรือเวอร์ชั่นสูงกว่าเท่านั้น)
- Optimize for Flas Player 6 r65 ถ้าคุณเลือก Flash Player เป็น เวอร์ชั่น 6 จะสามารถเลือกตัวเลือกนี้ได้ ซึ่งจะช่วยเพิ่มประสิทธิภาพในการทำงานของ action script มากขึ้น
- Export hidden layers ทำการ export เลเยอร์ที่ถูกซ่อนในเอกสาร Flash ทั้งหมด ถ้าไม่เลือกตัวนี้ เลเยอร์ที่ถูกปิดดวงตาซ่อนไว้ จะไม่ถูก export ออกไปด้วย
- Export SWC ทำการ export ไฟล์ .swc ซึ่งถูกใช้สำหรับสร้างคอมโพเนนต์, ไฟล์ .swc จะบรรจุคลิปซึ่งถูกคอมไพล์แล้ว, ไฟล์คลาส ActionSCript สำหรับคอมโพเนนต์ และไฟล์อื่นๆซึ่งใช้กับคอมโพเนนต์
Password : ช่องกรอกรหัสผ่าน เมื่อเลือก Option ที่สามารถกรอกรหัสผ่านได้
Script time limit : เวลาที่ flash จะใช้ในการทำงาน action script ก่อนจะหยุดทำงานกรณีพบปัญหาอย่างเช่นสคริปต์ทำงานไม่จบ
JPEG quality : คุณภาพของไฟล์ภาพ JPEG
Audio stream : ปรับค่าเสียงประเภท stream
Audio event : ปรับค่าเสียงประเภท event
- Override sound settings ทำการยกเลิกการเซตค่า สำหรับเสียงซึ่งถูกเลือกในส่วนของเสียงในหน้าต่าง Property inspector, หากต้องการทำให้ไฟล์ swf มีขนาดเล็กลงให้เลือกตัวเลือกนี้
Note : ถ้า Override Sound Settings ไม่ถูกเลือก แฟลชจะแสกนเสียงประเภทสตรีททั้งหมดในเอกสาร (รวมถึงเสียงในวิดีโอที่ถูกอิมพอรต์เข้ามาด้วย และจะทำการพลับบริชเสียงประเภทสตรีมทั้งหมด
ที่ระดับสูง ซึ่งจะทำให้ขนาดไฟล์ใหญ่ขึ้น ถ้าเสียงประเภทสตรีมเสียงหนึ่งหรือมากกว่านั้น มีปริมาณการตั้งค่าให้ export ที่ระดับสูง
- Export device sounds สำหรับการส่งออกเสียงที่เหมาะสมสำหรับอุปกรณ์อย่างเช่นอุปกรณ์มือถือ แทนที่จะใช้เสียงเริ่มต้นจากในไลบราลี่ ให้ติ๊กเลือก Export Device Sound แทน
Local playback security : ทำการเลือกรูปแบบความปลอดภัยให้กับไฟล์ swf โดยตัวเลือก Local Access Only จะทำให้ swf นั้นสามารถกระทำได้กับเอกสารและทรัพยากรต่างๆที่อยู่บนระบบ local เท่านั้น (ไม่ได้เชื่อมกับเนตเวิรก์)
แต่ถ้าเลือก Access Network Only จะทำให้ไฟล์ swf สามารถทำงานร่วมกับไฟล์หรือทรัพยากรอื่นๆบนระบบเนตเวิรก์ได้
สำหรับ tab ที่ 3 จะเป็นการปรับค่าเกี่ยวกับ html ต่างๆ (กรณีเลือก publish html ด้วย โดยจะแปะ swf ไปให้เลย)
Template : เป็นการเลือกว่า flash นี้ใช้กับเทมเพลตประเภทไหนบ้าง เช่นมือถือ, การใช้งานแบบ full screen, การใช้งานกับคำสั่ง fscommand โดยปกติจะเลือก Flash Only เป็นหลัก แล้วจึงไปแก้ไขใน html อีกทีหนึ่ง
Dimension : เป็นการปรับโหมดการแสดงผลของ swf โดยเลือกให้แสดงผลเท่ากับขนาด Stage ที่สร้างงาน หรือ pixel ที่ำกำหนด หรือหน่วยเป็น percent
Playback : เป็นการเลือกรูปแบบการเล่นของไฟล์ swf โดยมี 4 ตัวเลือกคือ
- Paused at start เป็นการหยุดการเ่ล่นอนิเมชั่นเอาไว้ในตอนเริ่มต้น ถ้าไม่เลือก swf จะเริ่มเล่นไปตามปกติ
- Display menu จะเป็นการแสดงหรือไม่แสดงเมนู เมื่อคลิกเมาส์ขวาบน swf
- Loop เป็นการกำหนดอนิเมชั่นว่าจะวนกลับมาเล่นใหม่เมื่อจบเฟรมสุดท้ายหรือไม่
- Device font เป็นการกำหนดว่าจะใช้ฟอนต์ทั่วไปหรือไม่
Quality : เป็นการกำหนดคุณภาพที่จะแสดงผล
Window Mode : เป็นการแสดงผลของ swf โดยสามารถเลือก transparent เพื่อให้แฟลชใสมองไม่เห็นพื้นหลังได้
HTML alignment : เป็นการปรับตำแหน่ง ซ้าย ขวา บน ล่าง
Scale : เป็นรูปแบบสัดส่วนของ swf โดยเป็นแบบแสดงทั้งหมด, ไม่สนใจขนาดขอบกรอบ, ขนาดฟิตตามกรอบที่วาง swf และสุดท้่าย No scale เป็นการให้วัตถุต่างๆใน swf มีขนาดคงที่ไม่ยืดย่อ ตามขนาดของ swf ที่ถูกปรับขนาด
Flash alignment : เป็นการปรับพิกัดในแนว นอน และ แนวตั้งของ swf เมื่อมีการอาจโดนครอปขนาดเมื่อกรอบมีขนาดลดลงหรือใหญ่ขึ้น
Show warning messages : แสดงคำเตือนเมื่อมีข้อบกพร่อง อย่างเช่นการอ้างอิงของโค้ดไปยังรูปที่ไม่มีอยู่
สำหรับการสร้างไฟล์ swf และอื่นๆ วิธีที่ 2 มีเพียงเท่านี้ สำหรับวิธีถัดไปคือ
3. การสร้างไฟล์ swf และอื่นๆด้วยการเลือกเมนู Export
นอกจาก 2 วิธีที่กล่าวมาแล้ว เรายังสามารถเลือก export ข้อมูลออกไปในรูปแบบต่างๆได้อีก โดยสามารถ export เป็น movie สำหรับภาพขยับ หรือ ไฟล์ image สำหรับภาพนิ่งได้
การเลือกสร้างไฟล์ประเภท movie
ซึ่งจะเป็นทั้งวิดีโอ และภาพขยับเช่น gif animate รวมถึงภาพชนิด sequence ซึ่งจะถูกส่งออกไปจาก flash แบบ ทีละเฟรม
และเราสามารถ export ภาพต่างๆ ได้ดังนี้
สำหรับการสร้างไฟล์และ การสร้างไฟล์เพื่อนำไปใช้มีเพียงเท่านี้ ซึ่งแนะนำว่าให้ลองสร้างไฟล์เอกสารต่างๆมาดู ว่ามีความแตกต่างกันอย่างไรบ้าง
สิ่งที่จะได้เรียนรู้ในบทเรียนนี้
1. การเริ่มต้นสร้างไฟล์แฟลช
2. รู้จักไฟล์ประเภทต่างๆ
3. รู้จักนามสกุลที่ถูกนำไปใช้
4. วิธีสร้างไฟล์ที่จะนำไปใช้
5. การนำไฟล์ swf ไปใช้งาน
โดยหน้าตาเริ่มต้นเมื่อเปิดโปรแกรม จะเป็นดังต่อไปนี้
โดยเริ่มต้นเราสามารถทำการสร้างไฟล์ flash ได้ 3 วิธีคือ
1. การสร้างผ่านเมนู File แล้วจึงเลือก ผ่านเมนู New
เมื่อทำการกดปุ่ม New จะมีให้เลือกสร้างไฟล์ จาก 2 หมวดดังต่อไปนี้
ทำการสร้างเอกสารประเภทต่างๆ
ทำการสร้างไฟล์จากเทมเพลตที่ได้จัดเตรียมไว้แล้ว
สำหรับอีก 2 วิธีคือ
2. การสร้างโดยกดปุ่ม Shortcuts คือ <Ctrl+N>
3. สร้างผ่านหน้าต่าง ด้านล่าง ซึ่งจะขึ้นเมื่อเปิดโปรแกรม flash
โดยวิธีที่ 3 นี้จะแบ่งออกเป็น 3 ส่วนคือ
Open Recent Item - แสดงไฟล์ล่าสุดที่ได้ทำการแก้ไข
Create New - สร้างเอกสารไฟล์ประเภทต่างๆ
Create from Template - สร้างไฟล์แฟลช จากเทมเพลตที่โปรแกรมได้เตรียมไว้ให้แล้ว
ซึ่งจะเห็นว่า สามารถเลือกสร้างไฟล์ได้เช่นเดียวกับวิธีที่ 1 แต่ถ้าเราติ๊กตรงช่อง Don't show again หน้าต่างนี้ก็จะไม่ถูกแสดงอีกเมื่อเปิดโปรแกรมในครั้งถัดไป
คำอธิบายของเอกสารต่างๆ
Flash File (ActionScript 3.0) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้ actionscript เวอร์ชั่น 3.0
Flash File (AtcionScript 2.0) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้ actionscript เวอร์ชั่น 2.0
Flash File (Mobile) - เริ่มต้นสร้างไฟล์แฟลชโดยใช้งานสำหรับ มือถือ (flash lite)
ActionScript File - ทำการสร้างไฟล์สำหรับเขียน actionscript ทั้ง 2.0 และ 3.0
ActionScript Communication File - ทำการสร้างไฟล์ actionscript สำหรับใช้บนเซิรฟ์เวอร์
Flash JavaScript File - ทำการสร้างไฟล์ JSFL (เหมาะสำหรับการเขียนคำสั่งเพื่อทำงานแบบอัตโนมัติเพื่อใช้งานซ้ำๆในการจัดการต่างๆ)
Flash Project - ทำการสร้างไฟล์โปรเจกต์ ซึ่งรวบรวมรายชื่อไฟล์ทั้งหมดของโปรเจกต์นั้นๆ
ส่วนการสร้างไฟล์แฟลชจาก เทมเพลตนั้น จะเป็นเทมเพลตที่เตรียมมไว้ให้สำหรับการสร้าง แบนเนอร์โฆษณา, แฟลชบนมือถือ, สไลด์โชว์ และแบบสอบถาม ซึ่งสามารถทดลองสร้างดูได้
-----------------------------------
ทดลองสร้างไฟล์ flash
เมื่อเรารู้วิธีสร้างไฟล์แฟลช แล้วให้เราทดลองทำการสร้างไฟล์แฟลชดูจากวิธีใดวิธีหนึ่ง โดยทดลองกด <Ctrl+N> แล้วเลือกเอกสารประเภท Flash File (ActionScript 2.0) จะได้หน้าตาดังตัวอย่าง
ซึ่งเราจะอธิบายองค์ประกอบต่างๆในหัวข้อถัดไป แต่ตอนนี้เราจะลองทำการเซฟไฟล์แฟลช และทำการสร้างไฟล์แฟลชที่ถูกนำไปใช้จริงกันก่อน โดยทำการเซฟไฟล์แฟลชที่เพิ่งถูกสร้างขึ้น โดยเเลือกเมนู File-->Save หรือกด <Ctrl+S> เพื่อทำการเซฟเอกสาร โดยในที่นี้เซฟไฟล์ชื่อว่า testCreateFla
โดยไฟล์แฟลชจะมีนามสกุลคือ ".fla" และตอนเซฟไฟล์นั้น เราสามารถเลือกเซฟย้อนกลับไปได้อย่างน้อย 1 เวอร์ชั่น (cs3 คือเวอร์ชั่น 9 ฉะนั้นสามารถเซฟเป็นเวอร์ชั่น 8 ได้)
ข้อควรรู้ - เมื่อเปิดไฟล์แฟลชคนละเวอร์ชั่นกับตอนที่เซฟ เราสามารถนำแฟลชที่ถูกเซฟจากเวอร์ชั่นเก่ากว่า มาเปิดในโปรแกรมแฟลชเวอร์ชั่นใหม่กว่าได้ แต่เราไม่สามารถเอาไฟล์แฟลชที่ถูกเซฟจากเวอร์ชั่นที่ใหม่กว่าไปเปิดยังโปรแกรมแฟลชเวอร์ชั่นที่เก่ากว่าได้ (ฉะนั้นไฟล์ที่ถูกเซฟจาก cs3 จะไม่สามารถนำไปเปิดในแฟลชเวอร์ชั่น 8 ได้ ดังนั้นต้องเซฟให้ตรงกับเวอร์ชั่นที่จะนำไปเิปิด ไม่งั้นแฟลชจะเตือนว่าไม่สามารถเปิดได้)
เมื่อทำการเซฟไฟล์เสร็จแล้ว เราจะทำการสร้างไฟล์ swf ขึ้นมา ซึ่งจะเป็นไฟล์ที่ถูกนำไปใช้จริงทั้งงานออฟไลน์ (เปิดบนเครื่อง) และงานออนไลน์ (บนเว็บไซต์)
โดยเราสามารถทำการสร้างได้ 3 วิธีคือ
1. ทำการกดทดสอบโดยการกด <Ctrl+Enter> ซึงจะได้เฉพาะไฟล์ประเภท swf เท่านั้น
2. เลือกเมนู File --> publish โดยจะได้ไฟล์ทั้งหมดตามที่เราเลือกเอาไว้
3. เลือกเมนู File --> export โดยจะได้ไฟล์ตามนามสกุลที่เราเลือก
1. การสร้างไฟล์ swf ด้วยการกดทดสอบโดยการกด <Ctrl+Enter>
โดยวิธีแรกนั้น เมื่อทำการกดปุ่ม <Ctrl+Enter> จะได้ผลลัพธ์ดังต่อไปนี้
เนื่องจากเราไม่ได้ทำการวาดหรือวางอะไรลงไป จึงเห็นผลลัพธ์เป็นเพียงพื้นที่สีขาวเท่านั้น และเมื่อเราลองดูในโฟลเดอร์ที่เราได้ทำการบันทึกไฟล์ testCreateFla.fla เอาไว้ จะเห็นว่า ไฟล์ testCreateFla.swf ได้ถูกสร้างขึ้นที่เดียวกัน
2. การสร้างไฟล์ swf และอื่นๆด้วยการเลือกเมนู publish
สำหรับวิธีนี้เราสามารถเลือกสร้างไฟล์นามสกุลอื่นๆ นอกจาก swf ได้ โดยจะมี 3 เมนูดังต่อไปนี้
Publish Settings... - เลือกนามสกุลไฟล์ที่ต้องการสร้างเมื่อกด publish รวมถึงเซตค่าต่างๆ
Publish Preview - เลือกดูผลลัพธ์แต่ละประเภท โดยจะเลือกดูได้เฉพาะที่เลือกไว้ในเมนู Publish Setting เท่านั้น
Publish - ทำการสร้างไฟล์นามสกุลต่างๆทั้งหมด ตามที่ได้เลือกไว้ใน Publish Setting
ทดลองเลือกเมนู Publish Setting จะขึ้นให้เลือกเซตค่าต่างๆ
ซึ่งเมนู tab แรกจะเป็นการเซตนามสกุลของไฟล์ที่จะถูกสร้างขึ้น ประกอบด้วย
Flash (.swf) - ไฟล์แฟลช
็HTML (.html) - ไฟล์ html ที่จะถูกฝังโค้ดแฟลชให้โดยอัตโนมัติ
Gif Image (.gif) - ไฟล์ภาพประเภท gif
JPEG Image (.jpg) - ไฟล์ภาพประเภท jpg
PNG Image (.png) - ไฟล์ภาพประเภท png
Window Projector (.exe) - ไฟล์โปรเจกเตอร์นามสกุล exe
Macintosh Projector - ไฟล์โปรเจกเตอร์เครื่อง Macintosh นามสกุล app
QuickTime with Flash Track (.mov) - ไฟล์วิดีโอนามสกุล mov เปิดด้วย QuickTime Player
สำหรับช่อง File นั้นเราสามารถระบุชื่อที่ต้องการให้สร้างลงไปได้ เนื่องจากว่าบางครั้งเราอาจจะเซฟ fla เป็นหลายๆชื่อเพื่อเก็บไฟล์เก่าไว้ แต่ไม่ต้องการให้ไฟล์ผลลัพธ์ที่ถูกสร้างขึ้นเปลี่ยนชื่อตาม และเสียเวลาต้องมาแก้ชื่อทีหลัง จึงมีช่องนี้ไว้ให้ระบุชื่อที่ต้องการรวมถึงพาธที่จะสร้างไฟล์ ลงไปได้
ข้อควรรู้- มักมีคำถามๆอยู่บ่อยๆว่า จะนำแฟลชไปเปิดเครื่องที่ีไม่มี flash player ได้อย่างไร ถ้าเครื่องนั้นไม่ได้ลง flash player ให้กับบราวเซอร์(ปกติ flash player จะถูกลงในบราวเซอร์อย่างเช่น ie, firefox หรือ safari โดยสามารถโหลดได้ที่เว็บ adobe หรือลงโปรแกรม flash) ซึ่งปกติถ้าเราลงแฟลชที่เครื่องคอมนั้นๆ โปรแกรมจะลง flash stand alone player ให้ซึ่งสามารถใช้เปิดไฟล์นามสกุล swf ได้เลย แต่ถ้าไม่มีทั้งสองเงื่อนไข เราสามารถเลือก publish ไฟล์เป็นนามสกุล .exe สำหรับเครื่อง pc หรือ .app สำหรับเครื่อง mac ซึ่งจะสามารถเปิดได้เลยโดยไม่ต้องมี flash player หรือ flash stand alone player
สำหรับ tab ที่ 2 นั้น
จะสามารถปรับค่าได้คือ
Version ปรับเวอร์ชั่นของ Flash Player ที่จะเล่น ซึ่งบางครั้งเมื่อมีการนำงานที่เซฟจากเวอร์ชั่นเก่ามา ก็จะถูกกำหนดเป็น Flash Player เวอร์ชั่นเก่าที่ใช้ในการเล่น ซึ่งสามารถปรับได้จากช่องนี้ หากต้องการใช้ ActionScript ที่เพิ่มมาใน flash player เวอร์ชั่นใหม่ๆ
Load order จะเป็นลำดับในการคอมไพล์ไฟล์ swf รวมถึง action script โดยจะไล่ลำดับจากระดับล่างขึ้นมาระดับบน หรือจากระดับบนลงไปด้านล่าง (ลำดับในที่นี้มีทั้งลำดับการจัดเรียงของเลเยอร์ และการซ้อนกันของระดับไทม์ไลน์)
ActionScript version เป็นการตั้งค่าเวอร์ชั่นของ ActionScript ที่จะใช้ในการเขียนโปรแกรม โดยจะมีตั้งแต่เวอร์ชั่น 1-3 โดยส่วนใหญ่จะใช้ 2 หรือ 3 เป็นหลัก
Options :
- Generate size report สร้างรายงานรายการขนาดของข้อมูลในแฟลช โดยสร้างรายงานออกมาเป็นไฟล์
- Protect from import ป้องกันผู้อื่นจากการอิมพอรต์ไฟล์ swf และแปลงมันกลับไปเป็นเอกสาร FLA โดยจะให้คุณสามารถใช้รหัสในการปกป้องไฟล์ swf ของคุณได้
- Omit trace actions ยกเลิการแสดงค่าผ่านคำสั่ง trace ในไฟล์ swf โดยเมื่อเลือกคำสั่งนี้ จะทำให้ไม่มีผลลัพธ์จากคำสั่ง trace แสดงผ่านทางหน้าต่าง output
- Permit debugging ยืนยันการใช้งาน debugger (ไว้ตรวจสอบข้อผิดพลาด) และยอมให้ตรวจสอบข้อผิดพลาดระยะไกล (remote) ไฟล์ swf ได้ ซึ่ง คุณสามารถใช้รหัสในการปกป้องไฟล์ swf ของคุณได้
- Compress movie ทำการบีบอัพขนาด swf เพื่อลดขนาดของไฟล์และจำนวนครั้งในการดาวน์โหลด ซึ่งจะมีประโยนช์เมื่อไฟล์ข้อความ หรือไฟล์ ActionScript (สามารถใช้งานได้ในเวอร์ชั่น 6 หรือเวอร์ชั่นสูงกว่าเท่านั้น)
- Optimize for Flas Player 6 r65 ถ้าคุณเลือก Flash Player เป็น เวอร์ชั่น 6 จะสามารถเลือกตัวเลือกนี้ได้ ซึ่งจะช่วยเพิ่มประสิทธิภาพในการทำงานของ action script มากขึ้น
- Export hidden layers ทำการ export เลเยอร์ที่ถูกซ่อนในเอกสาร Flash ทั้งหมด ถ้าไม่เลือกตัวนี้ เลเยอร์ที่ถูกปิดดวงตาซ่อนไว้ จะไม่ถูก export ออกไปด้วย
- Export SWC ทำการ export ไฟล์ .swc ซึ่งถูกใช้สำหรับสร้างคอมโพเนนต์, ไฟล์ .swc จะบรรจุคลิปซึ่งถูกคอมไพล์แล้ว, ไฟล์คลาส ActionSCript สำหรับคอมโพเนนต์ และไฟล์อื่นๆซึ่งใช้กับคอมโพเนนต์
Password : ช่องกรอกรหัสผ่าน เมื่อเลือก Option ที่สามารถกรอกรหัสผ่านได้
Script time limit : เวลาที่ flash จะใช้ในการทำงาน action script ก่อนจะหยุดทำงานกรณีพบปัญหาอย่างเช่นสคริปต์ทำงานไม่จบ
JPEG quality : คุณภาพของไฟล์ภาพ JPEG
Audio stream : ปรับค่าเสียงประเภท stream
Audio event : ปรับค่าเสียงประเภท event
- Override sound settings ทำการยกเลิกการเซตค่า สำหรับเสียงซึ่งถูกเลือกในส่วนของเสียงในหน้าต่าง Property inspector, หากต้องการทำให้ไฟล์ swf มีขนาดเล็กลงให้เลือกตัวเลือกนี้
Note : ถ้า Override Sound Settings ไม่ถูกเลือก แฟลชจะแสกนเสียงประเภทสตรีททั้งหมดในเอกสาร (รวมถึงเสียงในวิดีโอที่ถูกอิมพอรต์เข้ามาด้วย และจะทำการพลับบริชเสียงประเภทสตรีมทั้งหมด
ที่ระดับสูง ซึ่งจะทำให้ขนาดไฟล์ใหญ่ขึ้น ถ้าเสียงประเภทสตรีมเสียงหนึ่งหรือมากกว่านั้น มีปริมาณการตั้งค่าให้ export ที่ระดับสูง
- Export device sounds สำหรับการส่งออกเสียงที่เหมาะสมสำหรับอุปกรณ์อย่างเช่นอุปกรณ์มือถือ แทนที่จะใช้เสียงเริ่มต้นจากในไลบราลี่ ให้ติ๊กเลือก Export Device Sound แทน
Local playback security : ทำการเลือกรูปแบบความปลอดภัยให้กับไฟล์ swf โดยตัวเลือก Local Access Only จะทำให้ swf นั้นสามารถกระทำได้กับเอกสารและทรัพยากรต่างๆที่อยู่บนระบบ local เท่านั้น (ไม่ได้เชื่อมกับเนตเวิรก์)
แต่ถ้าเลือก Access Network Only จะทำให้ไฟล์ swf สามารถทำงานร่วมกับไฟล์หรือทรัพยากรอื่นๆบนระบบเนตเวิรก์ได้
สำหรับ tab ที่ 3 จะเป็นการปรับค่าเกี่ยวกับ html ต่างๆ (กรณีเลือก publish html ด้วย โดยจะแปะ swf ไปให้เลย)
Template : เป็นการเลือกว่า flash นี้ใช้กับเทมเพลตประเภทไหนบ้าง เช่นมือถือ, การใช้งานแบบ full screen, การใช้งานกับคำสั่ง fscommand โดยปกติจะเลือก Flash Only เป็นหลัก แล้วจึงไปแก้ไขใน html อีกทีหนึ่ง
Dimension : เป็นการปรับโหมดการแสดงผลของ swf โดยเลือกให้แสดงผลเท่ากับขนาด Stage ที่สร้างงาน หรือ pixel ที่ำกำหนด หรือหน่วยเป็น percent
Playback : เป็นการเลือกรูปแบบการเล่นของไฟล์ swf โดยมี 4 ตัวเลือกคือ
- Paused at start เป็นการหยุดการเ่ล่นอนิเมชั่นเอาไว้ในตอนเริ่มต้น ถ้าไม่เลือก swf จะเริ่มเล่นไปตามปกติ
- Display menu จะเป็นการแสดงหรือไม่แสดงเมนู เมื่อคลิกเมาส์ขวาบน swf
- Loop เป็นการกำหนดอนิเมชั่นว่าจะวนกลับมาเล่นใหม่เมื่อจบเฟรมสุดท้ายหรือไม่
- Device font เป็นการกำหนดว่าจะใช้ฟอนต์ทั่วไปหรือไม่
Quality : เป็นการกำหนดคุณภาพที่จะแสดงผล
Window Mode : เป็นการแสดงผลของ swf โดยสามารถเลือก transparent เพื่อให้แฟลชใสมองไม่เห็นพื้นหลังได้
HTML alignment : เป็นการปรับตำแหน่ง ซ้าย ขวา บน ล่าง
Scale : เป็นรูปแบบสัดส่วนของ swf โดยเป็นแบบแสดงทั้งหมด, ไม่สนใจขนาดขอบกรอบ, ขนาดฟิตตามกรอบที่วาง swf และสุดท้่าย No scale เป็นการให้วัตถุต่างๆใน swf มีขนาดคงที่ไม่ยืดย่อ ตามขนาดของ swf ที่ถูกปรับขนาด
Flash alignment : เป็นการปรับพิกัดในแนว นอน และ แนวตั้งของ swf เมื่อมีการอาจโดนครอปขนาดเมื่อกรอบมีขนาดลดลงหรือใหญ่ขึ้น
Show warning messages : แสดงคำเตือนเมื่อมีข้อบกพร่อง อย่างเช่นการอ้างอิงของโค้ดไปยังรูปที่ไม่มีอยู่
สำหรับการสร้างไฟล์ swf และอื่นๆ วิธีที่ 2 มีเพียงเท่านี้ สำหรับวิธีถัดไปคือ
3. การสร้างไฟล์ swf และอื่นๆด้วยการเลือกเมนู Export
นอกจาก 2 วิธีที่กล่าวมาแล้ว เรายังสามารถเลือก export ข้อมูลออกไปในรูปแบบต่างๆได้อีก โดยสามารถ export เป็น movie สำหรับภาพขยับ หรือ ไฟล์ image สำหรับภาพนิ่งได้
การเลือกสร้างไฟล์ประเภท movie
ซึ่งจะเป็นทั้งวิดีโอ และภาพขยับเช่น gif animate รวมถึงภาพชนิด sequence ซึ่งจะถูกส่งออกไปจาก flash แบบ ทีละเฟรม
และเราสามารถ export ภาพต่างๆ ได้ดังนี้
สำหรับการสร้างไฟล์และ การสร้างไฟล์เพื่อนำไปใช้มีเพียงเท่านี้ ซึ่งแนะนำว่าให้ลองสร้างไฟล์เอกสารต่างๆมาดู ว่ามีความแตกต่างกันอย่างไรบ้าง