Flash :: Introduction to ActionScript 3.0
Posted by PunNeng, Sat May 26 04:19:00 UTC 2007
เล็กน้อย สำหรับ ActionScript
ActionScript หรือเรียกย่อๆ ว่า AS เป็น programming language ที่ใช้บน Flash ทำหน้าที่ควบคุมต่างๆ นานา บน flash
มันจะทำงานบน ActionScript Virtual Machine(AVM) ซึ่งเป็นส่วนหนึ่งบน flash player มันจะถูก compile เป็น bytecode ที่จะเอาไปใช้ต่อไป นอกจากใช้บน flash ได้แล้ว มันยังใช้บน flex ได้ด้วย ซึ่งการนำไปใช้ มันจะติดไปกับไฟล์ .swf ซึ่งจะถูก flash player เรียกใช้งานอีกทีนึง
มาถึง ActionScript 3.0 บ้าง
ActionScript 3.0 ได้ถูกออกแบบมาให้เป็น Object-Oriented(OO) เต็มตัว ใครที่คุ้นเคยกับ OO อยู่แล้ว ก็จะสบายไป
มาดูว่า AS3 มันทำอะไรได้บ้าง
- Virtual Machine ตัวใหม่ เรียกว่า AVM2 มีประสิทธิภาพมากกว่าเดิมด้วย bytecode แบบใหม่
- Compiler ตัวใหม่ ที่ปรับให้เข้ากับมาตรฐานของ ECMAScrpt(ECMA 626) ซึ่งผ่านการปรับปรุงและ optimize ให้ดีขึ้นมากกว่าตัวเก่า
- ปรับปรุงและเพิ่มเติม application programming interface(API) ด้วยตัวควบคุมระดับต่ำ(low-level - ใกล้เคียงภาษาที่ computer ใช้ประมวลผล ทำให้ประมวลผลเร็วขึ้น) และรูปแบบที่เป็น OO จริงๆ
- ตัวภาษาหลัก ก็ใช้มาตรฐานของ ECMAScript(ECMA -262) ที่ปรับปรุงครั้งที่ 4 ซึ่งกำลังร่างอยู่(อันบนเป็นการปรับปรุงครั้งที่ 3)
- XML API ก็ใช้มาตรฐานของ ECMAScript for XML(E4X-ECMA-357 ปรับปรุงครั้งที่ 2) E4X เป็นตัวที่เพิ่มให้ XML เป็น Data type อีกชนิดนึงของ ActionScript(ลองแล้ว ง่ายโคตร)
- รูปแบบของ Event ใช้มาตรฐานของ Document Object Model(DOM) Level 3
AS3 เหมาะสำหรับงานทีมีความซับซ้อนสูงๆ งานที่ออกแบบด้วย OO หรืองานที่ต้องการที่จะนำกับไปใช้ใหม่(reuseable)
สำหรับสิ่งใหม่ๆ สำหรับ AS3
นอกจากจะเพิ่ม features ใหม่ๆ แล้ว มันยังเปลี่ยนรูปแบบต่างจาก version ก่อน ไม่ว่าจะเป็น syntax หรือรูปแบบของ OO และอื่นๆ อีก
มาดู features ของฝั่งภาษาหลัก
Run-time exceptions
เพิ่มมาแล้ว สามารถดักจับในขณะที่งานเรากำลังเล่นอยู่ ซึ่งใน version ก่อน เราต้องเขียนสั่งเอง ก็ช่วยในการ debug นั่นแล
Run-time types
อันนี้เกี่ยวกับการประกาศ data type ซึ่งใน version ก่อน ตอน compile มันจะ check ให้ เพื่อตรวจสอบการเขียน code ของเราให้ผิดพลาดน้อยที่สุด แต่พอรันแล้ว มันกลายเป็นชนิด dynamic(duck type1) ซึ่งจริงๆ มันก็ถูกแปลงให้เป็น bytecode ของ AS1 อีกที แต่ในตัวใหม่ ไม่เป็นแล้ว ก็ช่วยให้เราใช้หน่อยความจำน้อยลง ทำงานเร็วขึ้น เพราะไม่ต้องไปตรวจสอบอีกที ว่ามันเป็นชนิดอะไร
Sealed classes
sealed class คือ class ที่ไม่สามารถเพิ่ม property และ method ในขณะที่มันกำลังเล่นอยู่ได้ มีส่วนทำให้งานมีประสิทธิภาพมากขึ้น เพราะไม่ต้องเสียหน่วยความจำหรือการประมวลผลไปกับเพิ่มส่วนนี้ ยกเว้น Object class ก็ยังคงทำได้ และถ้าเราไม่ต้องการลักษณะของ sealed class สามารถทำได้โดยประกาศ dynamic หน้า class นั้นๆ
Method Closures
เป็นการสั่งให้ method จำ object ที่ตัวเองอาศัยอยู่ได้ ปัญหามักจะเกิดกับการคุม event อธิบายด้วย code ดีกว่า
มาดูของเก่ากับ AS2
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | import mx.controls.Button; import mx.utils.Delegate; function clickHandler(eventObj:Object):Void { trace("[" + eventObj.type + "] event on " + eventObj.target + " instance."); trace("\t this -> " + this); } var buttonListener:Object = new Object(); buttonListener.click = function(eventObj:Object):Void { trace("[" + eventObj.type + "] event on " + eventObj.target + " instance."); trace("\t this -> " + this); }; this.createClassObject(Button, "one_button", 10, {label:"One"}); one_button.move(10, 10); one_button.addEventListener("click", clickHandler); this.createClassObject(Button, "two_button", 20, {label:"Two"}); two_button.move(120, 10); two_button.addEventListener("click", buttonListener); this.createClassObject(Button, "three_button", 30, {label:"Three"}); three_button.move(230, 10); three_button.addEventListener("click", Delegate.create(this, clickHandler)); |
เมื่อคลิกที่ one_button จะได้
[click] event on _level0.one_button instance. this -> _level0.one_button
คลิกที่ two_button จะได้
[click] event on _level0.two_button instance. this -> [object Object]
คลิกที่ three_button จะได้
[click] event on _level0.three_button instance. this -> _level0
ในกรณีนี้ this จะเปลี่ยนไป ขึ้นอยู่กับว่ามันอยู่ object ตัวไหน พระเอกเลยเป็นmx.utils.Delegate แทน
แต่ของใหม่ ไม่สามารถสร้าง object ที่จะมารับดัก event ได้ มันจึงเป็นการบังคับ this ไปในตัวว่าต้องเป็นบน object ที่ method ตัวนั้นอยู่เท่านั้น
ECMAScript for XML (E4X)
โม้ไปข้างบนละ
XML API ก็ใช้มาตรฐานของ ECMAScript for XML(E4X-ECMA-357 ปรับปรุงครั้งที่ 2) E4X เป็นตัวที่เพิ่มให้ XML เป็น Data type อีกชนิดนึงของ ActionScript(ลองแล้ว ง่ายโคตร)
เอาเป็นว่าการใช้ xml มันจะง่ายขึ้นเยอะ
Regular expressions
แน่นอน ผมเคยบอกไปแล้ว ว่า AS3 จะใช้ RegExp ได้
Namespaces
นอกจาก xml ในของเก่าแล้ว ของใหม่ก็รองรับเหมือกัน สามารถสร้าง namespace ใช้เองได้
New primitive types
มีชนิดของข้อมูลแบบพื้นฐานใหม่ เช่น int หรือ uint ซึ่ง int คือ 32 bit sign interger ส่วน uint คือ 32 bit unsigned integer ใช้ให้ถูกต้องตามลักษณะจะช่วยเพิ่มประสิทธิภาพการทำงานให้ flash player เยอะเลย
มาดู features ของฝั่ง flash player บ้าง โดยส่วนใหญ่จะเป็นเรื่องของ api อันใหม่ เตรียม class ใหม่ๆ ไว้ให้ code เราสั่งมันทางาน
DOM3 event model
ข้างบนก็แว่บๆ มาแล้วทีนึง มันก็เป็นมาตรฐานของ event handling ที่กำหนดโดย World Wide Web Consortium เป็นแนวทางใหม่กับการจัดการเรื่อง event handling ใน flash
Display list API
ฝั่งการแสดงผล ก็มีของใหม่มาอีก เช่น Sprite class และ Shape class หรือของเก่าที่มีอยู่แล้วอย่าง MovieClip class ซึ่งความเหมือน หรือแตกต่าง เดี๋ยวมาว่ากันทีหลัง ซึ่งล้วนแต่เพิ่มประสิทธิภาพในการทำงานทั้งสิ้น
Handling dynamic data and content
กลไกใหม่ๆ เพิ่มมาอีกแล้ว อย่างการโหลดของภายนอกอย่างภาพต่างๆ หรือข้อมูลจาก file จะมี Loader class ที่ไว้โหลด .swf หรือภาพต่างๆ ซึ่งจะบอกข้อมูลรายละเอียดต่างๆ ของสิ่งที่เราโหลดเข้ามา ผมว่ามันง่ายดีนะ สำหรับการจัดการพวก preload ทั้งหลาย หรือ URLLoader class ก็จะจัดการกับการโหลด text เข้ามา หรือ Socket class ที่ไว้จัดการกับการต่อ server socket ต่างๆ
Low-level data access
ต่อจากอันบน กับการโหลดสิ่งต่างๆ จากภายนอก มันใช้สิ่งนี้แหละ ในการติดต่อกับข้อมูลระดับต่ำในการเก็บข้อมูลต่างๆ เข้ามา เช่น URLStream class ซึ่ง URLLoader class เอามาทำต่อยอดอีกที ก็ใช้ในการเข้าถึงข้อมูลดิบที่ยังไม่ได้ผ่านการแปลงอะไรเข้ามา หรือ ByteArray class จะใช้ในการจัดการกับ binary data ได้ ไม่ว่าจะอ่านหรือเขียนก็ตาม และของใหม่อย่าง Sound API ที่มีสิ่งที่เพิ่มมาอย่าง SoundChannel และ SoundMixer แค่ชื่อก็น่าเล่นแล้ว และนอกจากนี้ ชุด API ใหม่นี้ ยังจัดการในเรื่องความปลอดภัยในการให้สิทธิ์กับ SWF file หรือการโหลดข้อมูลต่างๆ ซึ่งจะเพิ่มความสามารถด้านความปลอดภัย
Working with text
AS3 แยกการทำงานกับ text ออกมาต่างหากเลย อย่าง TextLineMetrics class, TextField class และอีกต่างๆ นานา รวมถึง Font class ด้วย ที่จะให้เราจัดการเรื่อง font ได้เต็มที่ ผมก็หวังว่ามันคงจะดีนะ(ที่หวัง เพราะยังไม่ได้ลองเลย)
ทีนี้ มาลองดูว่า มันจะเข้าอะไรได้หรือไม่ได้กับ flash ของเก่าบ้าง
สำหรับตัว player ซึ่งตอนนี้คงเป็น version 9 ก็สามารถแสดงผล .swf ที่สร้างจาก version เก่าๆ ได้หมด แต่ของเรา แสดงผลของใหม่ได้ไม่หมดนะ ก็รีบ update กันนะ แต่ก็ใช่ว่าจะเข้ากันได้หมดทุกอย่าง ดังนี้
- ไม่สามารถเขียน AS1-2 รวมกับ AS3 ได้ - ต้องแยก
- AS3 โหลด .swf ที่เขียนด้วย AS1-2 ได้ แต่ไม่สามารถเข้าถึง property หรือ method ได้ - ใช้ได้ในการเตรียม asset ต่างๆ อย่างเดียว
- ในทางตรงกันข้าม .swf ที่เขียนด้วย AS1-2 ไม่สามารถโหลด .swf ที่เขียนด้วย AS3 ได้ - ถ้าสร้างจาก flash8 หรือ Flex Builder 1.5 ละก็ ทำงานร่วมกันไม่ได้เลย มีข้อยกเว้นหน่อย คือ .swf ที่เขียนด้วย as2 สามารถโหลด .swf ที่เขียนด้วย as3 เข้ามาทับตัวมันได้ โดยที่ต้องยังไม่โหลดหรือทำอะไรกับ level ของมัน ซึ่งทำได้โดยใช้ loadMovieNum() method แล้วส่ง 0 ไปเป็น level
- ถ้าอยากให้มันทำงานร่วมกัน ต้องแปลงของเก่า ไปเป็นของใหม่ครับ ใน help จะมี index บอกอยู่ว่าอะไรที่เปลี่ยนไปบ้าง คงต้องปรับๆ ครับ
จากทั้งหมดที่เล่ามา สรรพคุณที่เห็นกันอย่างเด่นชัดเลยคือประสิทธิภาพในการทำงานของ Flash Player ที่ดีขึ้น เนื่องมาจากการจัดการกับ bytecode ใหม่ ซึ่งต้องสร้างจาก ActionScript 3.0 นอกจากเรื่องประสิทธิภาพแล้ว ยังมีเรื่อง OO ที่ดูเป็นรูปเป็นร่างขึ้นมามากกว่าของเก่า ซึ่งตัวนี้แหละ จะช่วยให้เราจัดการกับงานใหญ่ๆ ได้ดีขึ้น
1duck type คือ เป็นชนิดอะไรก็ได้ ขึ้นอยู่กับการใช้งาน เหมือนเป็ด ทำได้ทุกอย่าง
ปล. thaiflashdev ตายอยู่ ชาว flash ใจเย็นนะครับ :)
ข้อมูลจาก help ของ flash
คือผมทำเกม flash แบบ multi อยู่น่ะคับ ใช้ smartfox server มีปัญหาในการส่งข้อมูลส่องฝั่งไม่เหมือนกันน่ะคับ ขอคำแนะนำด้วยคับ ขอวิธีติดต่อหน่อยนะคับ หรือแอดเมลมาหาผมที ขอบพระคุณมากคับ