ดาวน์โหลดงานนำเสนอ
งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ
1
Funny with Action Script
ที่มา ttp://korstudio.exteen.com/category/Tutorial
2
AddEventListener คืออะไร ....อะ?
ก็ทำตามคำสั่งที่กำหนดไว้ วิธีการเขียนคำสั่ง ชื่อวัตถุ.addEventListener(ชื่อเหตุการณ์, รายการคำสั่ง หรือ Listener); เช่น mc.addEventListener(MouseEvent.CLICK, mouseClick); แปลว่า mc ถูกเฝ้ารอดูเหตุการณ์การเกิดเหตุการณ์ MouseEvent.CLICK หากเกิดเหตุการณ์ดังกล่าวขึ้น.. ให้ทำตามคำสั่งที่เขียนไว้ใน mouseClick สำหรับ MouseEvent.CLICK คือ รูปแบบของเหตุการณ์ ในที่นี้หมายถึง "เมื่อมีการคลิก" เกิดขึ้น
3
ตัวอย่าง การเรียกใช้คำสั่ง MouseEvent.CLICK
4
ตัวอย่าง การเรียกใช้คำสั่ง MouseEvent.CLICK
function goPlay(e) { gotoAndPlay(2) } btnPlay.addEventListener(MouseEvent.CLICK,goPlay); หมายความว่า: เฝ้าดูเหตุการณ์การคลิกเม้าส์ที่ ปุ่มชื่อ btn ถ้ามีการคลิกที่ปุ่มนี้เมื่อไร ให้ทำตามคำสั่ง ที่กำหนดไว้ใน function ชื่อ goPlay
5
การเขียนคำสั่งควบคุมปุ่มอื่น ๆ
stop(); function goClick(e) { gotoAndPlay(2); } function goStop(e) gotoAndStop(26); function goPause(e) { stop(); } function goBack(e) prevFrame(); function goNext(e) nextFrame();
6
การเรียกใช้ Function คำสั่งควบคุมปุ่มอื่น ๆ
btnPlay.addEventListener(MouseEvent.CLICK,goPlay); เรียกใช้คำสั่งในฟังก์ชัน goPlay ให้ Animation เล่น btnStop.addEventListener(MouseEvent.CLICK,goStop); เรียกใช้คำสั่งในฟังก์ชัน goStop ให้ Animation หยุดเล่นที่เฟรมสุดท้าย btnNext.addEventListener(MouseEvent.CLICK,goNext); เรียกใช้คำสั่งในฟังก์ชัน goNext ให้ Animation เล่นที่เฟรมถัดไป btnBack.addEventListener(MouseEvent.CLICK,goBack); เรียกใช้คำสั่งในฟังก์ชัน goBack ให้ Animation เล่นที่เฟรมก่อนหน้านี้ btnPause.addEventListener(MouseEvent.CLICK,goPause); เรียกใช้คำสั่งในฟังก์ชัน goPause ให้ Animation หยุดเล่นที่เฟรมปัจจันที่กำลังเล่นอยู่
7
การจัดการ Layer เพื่อเตรียมส่วนประกอบต่าง ๆ
8
เรื่องของ FRAME เฟรม (Frame) คือส่วนที่ทำงานเหมือนกับเฟรมที่ประกอบกันเป็นภาพยนตร์ โดยเมื่อมีการนำเฟรมเหล่านี้มาแสดงอย่างต่อเนื่องก็จะทำให้เกิดภาพเคลื่อนไหว Frame จะแสดงผลทีละเฟรม จุดเริ่มต้น (Playhead) ที่เป็นเส้นสีแดงบอกตำแหน่งว่ากำลังทำงานอยู่ที่เฟรมใด เฟรมแบ่งออกได้ 3 อย่างคือ 1. Frame คือเฟรมที่ไม่มีการเปลี่ยนแปลงของวัตถุ (ภาพ) 2. Keyframe คือ เฟรมที่มีวัตถุอยู่ในนั้น (มีจุดสีดำ) มีการเปลี่ยนแปลง 3. Blank Keyframe คือเฟรมเปล่าๆ (มีวงกลมสีขาว)
9
เรื่องของ FRAME การแสดงสถานะบน Time Line 1. Current frame เป็นช่องที่บอกว่าขณะนี้ Playhead แสดง Frame อยู่ที่ช่องเท่าไร 2. Frame Rate เป็นช่องที่บอกว่าขณะนี้ Playhead วิ่งด้วยความเร็วกี่ Frame ต่อวินาที 3. Elapsed time เป็นช่องทีบอกว่าเมื่อ Playhead วิ่งมาถึง Frame นี้จะใช้เวลาเท่าไร 1 2 3 คีย์ลัดเกี่ยวกับเฟรม 1. F5 = สร้าง หรือ เพิ่ม Frame 2. F6 = สร้าง หรือ เพิ่ม Keyframe 3. F7 = สร้าง Blank Keyframe
10
เรื่องของ FRAME Frame Label คือ รูปธงสีแดง ใช้แทนการเรียกหมายเลขเฟรมในการเขียนคำสั่ง Action ซึ่งกำหนดการตั้งชื่อที่ส่วนของ LABEL ใน Panel Properties A F L
11
แบบฝึกหัดเรื่องการใช้งาน Frame Label
ศึกษาเพิ่มเติม
12
การอ้างอิงตำแหน่งของวัตถุ
หน้าที่ของสเตจ เป็นพื้นที่ในการแสดงผลลัพธ์ ฉะนั้นวัตถุที่อยู่นอก Stage จะมองไม่ ยกเว้นว่าเมื่อเรานำ swf ไปวางใน html ซึ่งกำหนดขนาดที่ใหญ่กว่า แต่ก็ขึ้นอยู่กับตอน publish ว่าจะให้ swf มีการปรับสเกลหรือขยายตามหรือไม่ พิกัดตำแหน่งของสเตจ ตำแหน่งของวัตถุบน Stage ในแนวแกน x และ y เริ่มต้นคือจุด 0,0 โดยยึด จากตำแหน่งมุมบนซ้ายของ Stage เป็นหลัก เหมือนกับโปรแกรมทั่วๆไป โดยจะมีค่าเพิ่มขึ้นไปทางขวาในแนวแกน x และเพิ่มขึ้นจากบนลงล่างในแนวแกน y
13
การอ้างอิงตำแหน่งของวัตถุ
14
ประเภทของ Symbol ครูเรียกว่า ซิมโบ๊ะ...ขำขำ
Movie Clip สำหรับทำ Animation Button สำหรับทำปุ่ม Graphic สำหรับนำกราฟิกมาใช้งานเป็นภาพนิ่ง หรือ Timeline ของ Animation จะเป็นตัวเดียวกับ Scene ความยาวเท่ากัน วิธีการสร้าง 1. คลิกที่เมนู Insert->New Symbol…
15
Button Symbol การสร้าง Symbol ประเภท Button (ปุ่มกด)
จะได้ Timeline สำหรับสร้างปุ่มดังนี้ Up สี/รูปหน้าปุ่ม Over เมื่อ Mouse อยู่เหนือปุ่ม Down เมื่อกด Mouse Hit กำหนดของเขตการคลิก Mouse ที่เฟรม Hit เป็นการกำหนดขอบเขตพื้นที่รับค่าให้กับปุ่ม (ปกติถ้าไม่กำหนดพื้นที่ที่ Hit เวลาเอา Mouse ไปชี้ที่ระหว่างกลางข้อความกับรูปด้านหน้า ถ้าไม่มีสีพื้นอยู่จะไม่สามารถกดได้จึงต้องแก้ไขด้วยวิธีการกำหนดพื้นที่ที่ Hit)
16
Button Symbol ตัวอย่าง UP Over Down Hit
17
ตัวอย่างการสร้างปุ่มที่มี Animation
1 ที่ตำแหน่ง Up - วาดภาพที่ต้องการ แสดงบนหน้าจอ ที่ตำแหน่ง Hit - ทำเช่นเดียวกัน หรือเปลี่ยนภาพก็ได้ ตามความต้องการ 3 2 ที่ตำแหน่ง Over - Convert ภาพเป็น Movie Clip - สร้าง Animation
18
การสร้างAnimation ที่ปุ่ม
งานนำเสนอที่คล้ายกัน
