Flex Event Propagation

1 Comment

ปล่อยเรื่องนี้ค้างคาใจมานานเหลือเกิน เพราะไม่ได้ใช้ Event ครบทุก Phase อย่างจริงจัง วันนี้ต้องทำให้ Checkbox List ทำงานเร็วขึ้นแต่ไม่อยากแก้ List ของ Adobe ตรงๆ หรือทำไรเพิ่มเติมก็ต้องเล่นกับ Event แทนนี่แหละ อ่านคร่าวๆ ขั้นตอนการส่งต่อ Event ของ Flex มีแค่สามขั้นคือ Capturing Phase, Targeting Phase, Bubbling Phase ลองดูภาพด้านล่างเผื่อเข้าใจง่ายขึ้น


ภาพด้านบนแสดงการซ้อนกันของ Component ต่างๆ ที่สร้างขึ้น มี Application เป็น Component ที่อยู่นอกสุด ตามด้วย HBox และ Button ถ้าเขียนเป็น mxml ก็จะได้อย่างด้านล่าง

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Box>
<mx:Button />
</mx:Box>
</mx:Application>

เมื่อมีคนกดปุ่มสิ่งที่เกิดขึ้นคือ component ที่อยู่นอกสุดซึ่งก็คือ Application จะดักจับ event ได้ก่อน จากนั้นจะส่งต่อไปที่ Box และ Box จะส่งต่อให้ Button อีกที การส่งต่อ Event ในช่วงนี้เรียกว่า Capturing Phase เมื่อถึง Button ซึ่งเป็นปุ่มที่เรากดแล้ว ช่วงที่อยู่ตรงปุ่มเรียกว่า Targeting Phase จากนั้น Button จะส่ง Event กลับไปยัง Box และ Box ส่งต่อให้ Application อีกที เรียกว่า Bubbling Phase
เอาหละ มาดูผลลัพธ์กันดีกว่าว่าใช้พวกนี้ช่วยแล้วเป็นยังไง หรือจะ ดาวโหลด ไปดูเต็มๆ ก็ได้




ของแถม อันนี้ทำเพื่อทดสอบว่า Event มันส่งต่อยังไงบ้าง


เกี่ยวข้อง:

  1. Event Propagation in Adobe help

Dropzone + Simplenote

Comments Off

ช่วงนี้เบื่อๆ เลยหาอะไรที่ทำเสร็จได้ไม่เกินหนึ่งวันเล่น ก็เลยเผลอหลวมตัวจิ้มเอา Dropzone มาจนได้ วันนี้ก็เลยหาทางเขียนตัวเสริมให้มันเชื่อมกับ Simplenote ที่ใช้อยู่ด้วยซะเลย ผลก็ตามด้านล่าง




แต่ก่อนใช้งานต้องติดตัวช่วยให้ ruby ในเครื่องก่อนด้วยคำสั่งด้านล่าง

llun$sudo gem i rest-client

จากนั้นดาวโหลด simplenote.dropzone กดติดตั้ง ใส่ username(email) และ password ก็เรียบร้อย

ตอนเย็นมีคำแนะนำเพิ่มเติมว่า น่าจะลากไฟล์ประเภทอื่นได้ด้วย เช่น PDF ลองหาๆ ดูว่ามี Library ไหนอยู่แล้วบ้างปรากฏว่าหาไม่เจอ เลยช่างมันก่อนละกัน ไว้เบื่ออีกรอบ จะกลับมาทำเพิ่มเติม

English step for install Dropzone and Simplenote extension:

  1. Download Dropzone. Open it dmg and drag Dropzone icon to Application folder.
  2. Install rest-client ruby library. I use this library instead of NET::HTTP because I’m lazy to find the way to use it. I try standard library but it always error with HTTP 500. So, I switch to rest-client but it needs a few more step to use, install rest-client library on Shell(Terminal)
    llun$sudo gem install rest-client
  3. Download Simplenote extension and install by double click on download file.
  4. Set username(email) and password then add.
  5. Simplenote icon should lives in Dropzone now. Drag text file to it or click Simplenote icon and paste text for create note.

Functional Programming Camp

1 Comment

วันเสาร์เพื่อนเลื่อนนัด เลยตัดสินใจไป Functional Programming Camp แทน(จริงๆ มีสอบอังกฤษ แต่โดดไป ^^!) ไปถึงประมาณสิบโมง หลงทาง(ในหมู่บ้าน) อีกครึ่งชั่วโมง กว่าจะไปถึงจริงๆ ก็ประมาณสิบโมงครึ่งนั่งเล่น นั่งคุย แล้วเริ่มกันจริงๆ ก็สิบเอ็ดโมงกว่า แต่จากนั้น เนื้อหาที่ตามมาเรียกว่าหนักหัวมาก กว่าจะย่อยได้หมดเรียกว่าเมาสัญลักษณ์ไปเลย

เริ่มจาก Functional Programming คืออะไร คำตอบจากพี่ @pphetra บอกว่ามันคือรูปแบบในการเขียนโปรแกรม โดยรูปแบบที่ว่ามีลักษณะคือ

  1. Immutable ข้อมูลต่างๆ เมื่อประกาศมาแล้วจะไม่มีการเปลี่ยนแปลง หรือเทียบเท่ากับ function ที่ไม่รับตัวแปรอะไรเลยแล้วให้ผลลัพธ์กลับมา เช่น var a = 5 ก็จะเหมือนกับประกาศว่า function a() = 5
  2. Recursion การทำซ้ำต่างๆ ในรูปแบบการเขียนโปรแกรมอื่น จะใช้รูปแบบการวนซ้ำเช่น for, while แต่เนื่องจาก ตัวแปรไม่สามารถเปลี่ยนแปลงได้ การวนซ้ำแบบนั้นจึงทำไม่ได้ การทำซ้ำต่างๆ ใน functional programming จึงอยู่ในรูปแบบเรียกตัวเองซ้ำ (นอกจากนี้ในงานมีการพูดถึงเทคนิคต่างๆ เช่น continuos passing style, tail recursion, … อีกพอสมควร เรียกว่าช่วงเช้าหนักหัวเพราะคำศัพท์นี่แหละ =_=)
  3. First class function คือ function ที่มีลักษณะเหมือนตัวแปรในภาษาอื่น คือสามารถเปลี่ยนแปลงการทำงานของ function ได้ โดยใช้ชื่อเดิม เช่น
    var a = function(x,y) { alert(x+y) }
    a = function(x) { alert(x*x) }
  4. Higher order function เนื่องจาก function นั้นมีความสามารถเหมือนตัวแปรแล้ว มันจึงส่งเข้าไปใน function อื่น หรือ return จาก function อื่นได้ โดยถ้า มันรับจาก function อื่นซ้อนๆ กันหรือคืนค่าจาก function อื่นซ้อนๆกัน ลำดับของมันก็สูงขึ้นตามจำนวนที่ซ้อนเรียกลงไป เช่น
    (A,_,B) = (1,2,3)
    A=1
    B=3
    
  5. non-strict evaluation คือการทำงานกับข้อมูลที่ต้องใช้เท่านั้นเช่นๆ ถ้าหากมี List ขนาด 10 ฃ่อง แล้วเราต้องการหาว่า ในช่องแรกเก็บค่าอะไร เราก็แค่ดูที่ช่องแรก โดยไม่ต้องดูสิบช่องที่เหลือว่าถูกหรือผิด
  6. lambda function … อื่ม ยังเป็นสิ่งที่คาใจผมอยู่ว่ามันคืออะไร เพราะเข้ามาดูอีกทีก็ตัวอย่างแล้ว

เอาหละหมดช่วงเช้าด้วยนิยามหนักๆ แล้ว ตอนบ่ายพักกินข้าว ต่อด้วยลองเขียนเล่นจริงโดย @iporsut ปิดท้ายด้วย เหตุผลต่างๆ ว่าทำไม Functional Programming จึงพูดถึงกันตอนนี้ (ทั้งๆ ที่มันก็มานานพอสมควรแล้ว) สรุปเป็นข้อๆ คือ

  1. เนื่องจาก CPU มันไม่เพิ่มประสิทธิภาพเท่าไหร่แล้ว แบ่งเหัวแยกออกมาแทน การที่จะใช้พื้นที่ร่วมกัน ก็จะใช้ประสิทธิภาพได้ไม่เต็มที่ จึงเอา Functional Programming มาช่วยเพื่อลดผลข้างเคียงจากการเปลี่ยนแปลงข้อมูลของตัวแปรต่างๆ (เพราะกันไม่ให้มันเปลี่ยนเลย -*-)
  2. จะหัดเขียน อยากเข้าใจง่ายๆ ก็จงเริ่มจาก Haskell ซะ แต่ถ้ามันลำบากไป ก็จะเริ่มจากลูกครึ่งอย่าง Scala ก็ได้แต่อาจจะเข้าใจช้ากว่า เพราะอาจเผลอไปเขียนรูปแบบเดิมๆ ได้
  3. ปัจจุบันยังไม่มีใครใช้เอามาเขียนเป็นโปรแกรมในระบบใหญ่ๆ ทั่วไป จะเห็นส่วนมากก็ใน AI หรือข่ายวิชาเฉพาะทางต่างๆ ซะมากกว่า

คราวถัดไป นัดกันอีกประมาณเดือนหรือสองเดือน เรื่องที่จะคุยกันคือ NoSQL แต่ก่อนเจอทุกวัน​(Berkley DB) ปัจจุบันเจอแต่ Flex เลยโม้ไม่ได้ ให้ @visibletrap ที่กำลังหมกมุ่นอยู่ไปโม้แทนแน่นอน แต่จะได้ไปหรือป่าวนั้นอีกเรื่องนึงแฮะ

Older Entries Newer Entries