We've moved!

My blog had its new home.

Like I said before, this blog is not really official. Now that I got a new server, I'm going WordPress.

You can find me at http://lunaticneko.com/blog for the new blog. Thanks for bearing with my many blog moves.

This one will remain up in case I need to scavenge old data and/or there are more people led through the old link. I hope I don't lose too much PageRank for this...

Thank you very much,
LunaticNeko.

2007-05-03

JAVA : GUI Basics

วันนี้ข้าน้อยรู้สึกเบื่อๆ ครับ ก็เลยมาโพสซะหน่อย เนื้อหาคงวกไปวนมาหน่อยนะครับ (เอาเรื่องยากมาลงก่อนนิ) แต่คงเป็นประโยชน์สำหรับคนที่กำลังทำ GUI อยู่นะครับ

เวลาเราเขียนโปรแกรม เราใช้คนเดียว เราใช้รับ String args[] เอาก็ได้ใช่ไหมครับ แต่ว่าเวลาเอาไปให้คนอื่นใช้ ถ้าเขาเป็น End User ก็คงใช้ไม่ถูก

ยิ่งสมัยก่อน ระบบเป็นแบบ Text-Based (เช่น สมัย DOS) แน่นอน GUI ไม่มีเลย ทุกอย่างใช้การส่งค่าเข้าไปในโปรแกรมตรงๆ ตลอด ตัวอย่างก็เช่น ping, tracert ก็ต้องระบุ IP ของเป้าหมายลงไป ก็ถือเป็นการส่งค่า parameter อย่างหนึ่ง

ต่อมา ในสมัย Windows ก็ได้เกิดการใช้สัญลักษณ์และภาพ หรือเมนู ในการแสดงผล และรับคำสั่งจากผู้ใช้ จากนั้นมาจนถึงปัจจุบัน การใช้งานคอมพิวเตอร์ทำได้อย่างสะดวกสบาย อย่างตอนที่ผมกำลังพิมพ์บทความนี้อยู่ ผมก็กำลังพิมพ์ลงใน Text Box ซึ่งก็เป็นส่วนหนึ่งของ GUI ครับ

GUI ที่ดี จะต้องสวยงาม (อย่างน้อยก็เป็นระเบียบละ) ใช้งานได้ง่าย ทำงานได้รวดเร็วไม่หน่วงระบบ และไม่ทำให้เกิดความสับสนแก่ผู้ใช้ครับ (ถ้าเราสร้่าง Frame1 Frame2 Frame3 etc. แบบนี้พร้อมๆ กัน แถมมีปุ่มอะไรไม่รู้อีกเยอะแยะ User คงงงตาย กดไปจะระเบิดรึเปล่าเนี่ย)

เอาละ เกริ่นกันมามาก เดี๋ยวท่านๆ จะนึกว่าข้าน้อยกำลังบ่นแบบคนแก่ซะเปล่าๆ เอาเป็นว่ามาเริ่มกันเลยครับ

ระบบ GUI ของ Java นั้นมีลักษณะเฉพาะตัว ก็เนื่องมาจากการที่ Java มี JVM อยู่นั่นเอง ทำให้การทำงานมีขั้นตอนมากกว่า C อยู่พอสมควร

Components
Component ก็คือ "ชิ้นส่วน" บน Interface นั่นเอง เช่น Button, TextField, ฯลฯ ซึ่งจะต้องวางลงบน Frame หรือ Component อื่นที่มีคุณสมบัติเป็น Container (เช่น Frame, Window, Dialog, Panel)

ทุกอย่างจะต้อง "วาด" ลงบนวัตถุที่เป็น Top-Level ก็คือ พื้นหน้าจอต่างๆ นั่นเอง หากตัวเองไม่ใช่ Top-Level แล้ว ก็ทำได้แค่ใช้หน่วยความจำ จากนั้นค่อยวาดลงไปบน Top-Level Component อีกที


Layout Manager
Layout Manager ก็คือระบบที่ไว้ช่วยจัดวาง GUI ให้เรานั่นเอง Layout Manager มีสี่อย่างหลักๆ ได้แก่...

- FlowLayout เป็นการแบ่งหน้าจอเป็นบรรทัดๆ วางลงให้เต็มทีละบรรทัด (เรียงตามลำดับการ new Component) จัดกลางเสมอ
- BorderLayout แบ่งจอเป็นห้าส่วน ได้แก่ North, East, South, West และ Center. แต่ละ Region จะวางวัตถุได้แค่ชิ้นเดียว (ซึ่งแก้ได้ด้วยการใช้ Panel)
- GridLayout จะรับค่าจากผู้ใช้ แล้วแบ่งจอออกเป็นส่วนๆ ตามที่ผู้ใช้กำหนด แต่ละช่องมีขนาดเท่ากันเสมอ
- Null - ที่สุดแห่งกระบวนท่า คือไร้กระบวนท่า - ระบบนี้จะให้เราจัดวางตำแหน่งของวัตถุต่างๆ ได้อย่างอิสระ โดยใช้คำสั่ง <object>.setBounds (X,Y,Width,Height); ในการช่วยจัดวาง


Toolkits
ระบบดั้งเดิมสำหรับทำ Interface ก็คือระบบ AWT (Abstract Windowing Toolkit) ซึ่งมีมาใน JDK ตั้งแต่รุ่นแรกๆ มีคำสั่งพื้นฐานสำหรับการสร้าง Interface มาให้ (import java.awt.*;)

ข้อดีของ AWT นั้นคือสามารถใช้ฝึกได้ เพราะไม่มีการอำนวยความสะดวกมากนัก ทำให้ไม่ "รู้สึกสบายจนเคยตัว" และ AWT นั้น ก็คือรูปแบบที่เข้าใจง่าย รูปแบบเรียบๆ

ส่วนข้อเสียนั้น ก็คือ AWT ทำงานค่อนข้างช้าครับ AWT ทำงานโดยการ....

1. ส่งไปยัง JVM
2. JVM โหลดเข้า API (ซึ่งเป็นของ OS)
3. API ใช้ subroutine ของตัวเอง (หลายบรรทัดอยู่มาก) ในการ render ออกมาเป็นภาพ

จากขั้นตอนเหล่านี้ ทำให้ระบบ AWT ไม่ค่อยเป็นที่นิยมในปัจจุบัน

ต่อมาในยุค Java 1.1 ก็ได้เกิดระบบ Swing ขึ้น (เกิดจากภาพ animation เจ้า Duke โล้ชิงช้าในระบบ GUI ในสมัยนั้น จึงได้ชื่อนี้มา) ซึ่งหลักการแตกต่างออกไป คือ จะมีการใช้ Graphic Memory เข้าช่วย และไม่ได้ใช้ subroutine ของ OS โดยตรง ทำให้ลดภาระลงไป และที่มากไปกว่านั้นก็คือ Components ต่างๆ สามารถโหลดเข้า Graphic Memory ได้จาก JVM โดยไม่ต้องใช้ API ทำให้...

1. เร็วขึ้น เนื่องจากไม่หน่วงเครื่องด้วย subroutine มากมาย
2. Platform-Independent เนื่องจาก ใช้ API น้อยลง ทำให้รันบนระบบใดก็ได้ผลคล้ายกันมากๆ
3. เนื่องจากความเป็น Free Source ของ Java ทำให้ออกแบบ component ใหม่เองได้อีกมาก


ก็คงพอจะอ่านเล่นแก้เบื่อได้นะครับ หากมีอะไรเพิ่มเติมก็ใส่ได้เลยนะครับ เพราะว่าอันนี้หนักไปทางการบันทึกทบทวนหลังเรียนเฉยๆ วันไหนว่างๆ จะมาต่อเรื่อง Client/Server นะครับ

No comments:

Post a Comment