การเรียกใช้คำสั่งนั้น ก็อย่างที่บอกไปแล้ว คุณก็แค่ เรียกไปที่ชื่อคำสั่ง ตามด้วย ();
แต่ถ้าเราต้องการการทำงานที่โต้ตอบกับการกระทำของผู้ใช้ล่ะ
การโต้ตอบการกระทำของผู้ใช้ นั่นคือ เมื่อผู้ใช้ใช้งานทำกิจกรรมอะไรบางอย่าง ตัวงานที่เราทำก็จะตอบรับอย่างเป็นระบบ เช่น
ผู้ชายคนหนึ่งเมาเหล้าและต่อยเมีย(ต่อยเมียคือกิจกรรมหรือเหตุการณ์ที่ทำ) ผลก็คือ วันรุ่งขึ้นเขานอนอยู่โรงพยาบาลหยอดน้ำข้าวต้ม (ผลของกิจกรรม) รูปแบบมันก็มีเช่นนี้แหละ เป็นรูปแบบที่เราต้องกำหนดไว้ แปลง่ายๆคือ ถ้ามีการกระทำ ก็ต้องมีผลตามมา
เพียงแต่เราต้องเป็นคนกำหนดเหตุการณ์ และกำหนดผลที่ตามมา
ในงานที่คุณจะสร้างมันขึ้น ถ้าคุณกดปุ่มลง ตัวละครของคุณจะย่อเข่าลง ถ้ากดขึ้น ตัวละครก็จะกระโดด ไอ้ที่คุณกดปุ่มต่างๆเหล่านี้คือการเกิดเหตุการณ์(กิจกรรม)ทั้งสิ้น เราเรียกเหตุการณ์เหล่านี้ว่า Event
เอาล่ะ เจ้าEvent หรือเหตุการณ์เนี่ย พูดถึงมันก็คือสิ่งที่จะเกิดกับงานแฟลชที่เราสร้าง โชคดีที่คนสร้างแฟลชนั้น คิดเผื่อพวกเราไว้แล้วว่า มันจะมีเหตุการณ์อะไรเกิดขึ้นได้บ้าง ดังนั้น เราจึงมีคำสั่งสำเร็จรูปไว้ใช้ได้เลย นั่นคือ
addEventListener();
โอ้ว ตัวเนี้ยแหละสำคัญ ว่าแต่ เราจะใช้งานมันยังไงล่ะ ง่ายๆ เมื่อเราจะเรียกใช้คำสั่งอะไร ก็ให้เอาคำสั่งนั้น ยัดลงไปในคำสั่งนี้ งงล่ะสิ ค่อยๆไปละกันนะ การทำงานของแฟลชมันก็แบบนี้ละ เอาตัวแปร มาซ้อนตัวแปร เอาคำสั่งมาซ้อนคำสั่ง ค่อยๆทำความเข้าใจไปช้าๆก็ได้ครับ ไม่ว่าหรอก
เจ้าคำสั่งนี้ รูปแบบการทำงานก็เหมือนคำสั่งทั่วไป เพียงแต่ เราต้องกำหนดค่าที่จะใช้ในคำสั่ง ให้ครบเท่านั้นเอง ซึ่งโดยรวมแล้วก็มี
ตัวแปรที่เราอยากรู้ เหตุการณ์ที่เราคาดว่าจะเกิด และคำสั่งที่จะให้เกิดขึ้นเมื่อเกิดเหตุการเหล่านั้น เช่น
stage.addEventListener(Event.ENTER_FRAME , pick);
ข้อความด้านบนคือ เมื่อ เสตจ หรือหน้าจอหลักของเรา เกิดเหตุการณ์ที่เรียกว่า แสดงเฟรม ให้เรียกการทำงานคำสั่งที่ชื่อว่า pick
ในวงเล็บของคำสั่ง addEventListener จะมี 2 ตัวแปรที่เราต้องใส่มันลงไปเพื่อกำหนดการทำงาน นั่นคือ
1 เหตุการณ์เฝ้าระวัง
2 คำสั่งที่ต้องการถ้าเหตุการณ์เฝ้าระวังนั้นดันเกิดขึ้นจริง
การพิมพ์ addEventListener นั้น บอกตามตรงว่า ยาวจนเมื่อยมือ แต่น่าเสียดายที่คำสั่งนี้เป็นคำสั่งที่ใช้งานมากที่สุด ดังนั้น เราจึงต้องจำวิธีการใช้งานให้ดีๆ
คำถาม ถ้าเราสร้างตัวแปรขึ้นมา แล้วเราอยากตรวจจับเหตุการณ์ของตัวแปรนั้น เราจะทำอย่างไร
เฉลย - ตัวแปรนั้น.addEventListener();
คำถาม ตัวแปรเดิม ถ้าเราสร้าง function pick(){} อยู่ แล้วตรวจจับเหตุการณ์ของตัวแปรนั้น ถ้าเจอเหตุการณ์ที่ว่า ให้คำสั่ง pick ทำงาน เราจะทำอย่างไร
เฉลย - ตัวแปรนั้น.addEventListener(เหตุการณ์ที่ว่า , pick);
ต่อๆ รูปแบบเท่าที่อ่านมันไม่ได้มีความยากอะไรเลยล่ะ จะติดก็ตรง เหตุการณ์ที่ว่าที่เราจะใส่นั่นเอง แล้วเหตุการณ์มีอะไรบ้าง
เหตุการณ์ที่เกิดบ่อยๆมีดังนี้
Event - คือเหตุการณ์ที่เห็นโดยทั่วไปและแบ่งหมวดยาก แต่สำหรับเรา ไม่ค่อยได้ใช้หรอก ได้ใช้แค่ไม่กี่อันเอง
MouseEvent - เหตุการณ์ที่เกี่ยวข้องกับการใช้เมาส์ เช่น ถ้าเรากดเม้าส์ คำสั่งก็จะทำงาน
KeyboardEvent - เป็นเหตุการณ์เกี่ยวกับการกดแป้นพิมพ์ต่างๆ
TimerEvent - เป็นเหตุการณ์ที่เกี่ยวกับการตั้งเวลา
เอาล่ะ เราเข้าใจแล้วล่ะนะว่า แต่ละเหตุการณ์นั้น ก็จะแยกหมวดหมู่ชัดเจน เหล่าเหตุการณ์นี้ จะนำเอาไปใส่ลงในคำสั่ง addEventListener กันล่ะ
addEventListener(Event.ENTER_FRAME , pick);
ลืมบอกไปนิด หลังเหตุการณ์ที่เป็นหัวข้อ คุณต้องระบุด้วยว่า เหตุการณ์ที่ว่านั้นคืออะไร สมมติ คุณเรียกนามสกุลของคนคนหนึ่งขึ้นมา คุณจะรู้ไหมว่าเรียกใคร คุณต้องระบุชื่อด้วย จะได้เรียกถูกคน นั่นคือ ซับอีเว้นท์ หรือเหตุการณ์ย่อย
ถ้าเกิดเหตุการณ์กับเม้าส์ คุณจะรู้ไหมว่า เกิดอะไรกับเม้าส์ เพราะมันเป็นได้หลายอย่าง เช่น การขยับเม้าส์ กดเม้าส์ เม้าส์อยู่บนข้อความนั้น มันเป็นได้หลายอย่าง คุณต้องกำหนดเหตุการณ์ย่อยลงไป
จากตัวอย่าง เหตุการณ์ที่เกิดคือเหตุการณ์ทั่วไป เหตุการณ์ย่อยคือ แสดงเฟรม แน่นอนว่า การทำงานของแฟลชนั้น คือการที่โปรแกรมจะค่อยๆแสดงทีละเฟรมของไทม์ไลน์จากซ้ายไปขวา เพราะเป็นการแสดงทีละเฟรม ดังนั้น เมื่อให้
addEventListener(Event.ENTER_FRAME , pick); ทำงาน
เมื่อไม่กำหนดตัวแปร มันจะถือว่า เมนหลักของไทม์ไลน์ เป็นตัวที่กำลังทำการตรวจจับเหตุการณ์ ถ้าเกิดเหตุการณ์ แสดงในเฟรมเมื่อไหร่ ฟังก์ชั่น(คำสั่ง) pick จะถูกเรียกทำงาน 1 ครั้ง แต่โดยปรกติ flash จะทำงาน 12 เฟรม/ 1 วินาที ดังนั้น คำสั่ง pick จึงถูกเรียกใช้งาน 12 ครั้งต่อวินาที ซึ่งก็ถือว่ามากโขอยู่นะ ดังนั้น จะสั่งอะไรให้ทำงาน คิดด้วยละกัน
แล้วเราจะประยุกต์ใช้อย่างไร
เอาเป็นว่า ในตอนนี้ คุณแค่จำรูปแบบไว้ก่อนก็พอ ว่า มันทำงานอย่างไร เพราะเมื่อถึงการใช้งานจริง ผมจะเข้าสู่รายละเอียดอีกที
สรุป
1. ถ้าเราต้องการให้คำสั่งของเราทำงานเลย ให้เราเลือกชื่อคำสั่งนั้น ตามด้วย (); เช่น pick(); นั่นคือคำสั่ง pick ถูกเรียกใช้งานแล้ว
2. ถ้าเราต้องการให้เกิดเหตุการณ์ก่อนถึงจะเรียกคำสั่ง pick ให้ทำงาน ให้เราใส่ไว้ในคำสั่ง addEventListener เพียงแต่ต้องกำหนดเหตุการณ์ที่จะเกิดด้วย เช่น addEventListener(เหตุการณ์.เหตุการณ์ย่อย, pick);
อาจเริ่มหนักสมองกันบ้างแล้วล่ะนะ แต่พอได้ทำจริงประกอบไปด้วยเดี๋ยวจะเข้าใจมากขึ้น เจอกันใหม่คาบหน้าครับ
ขอคุณมากครับ
ตอบลบ