เพื่อการศึกษา

2. โปรแกรม NetBeans เป็นโปรแกรม IDE สำหรับเขียนโปรแกรมภำษำจำวำใน
ลักษณะต่ำงๆ เป็นโปรแกรมที่เพียงแต่เติม และจัดระเบียบโค้ดโปรแกรม ก็
สำมำรถสร้ำงโปรแกรมประยุกต์ได้ง่ำย และเป็นโปรแกรมที่หำใช้ได้ฟรี
กำรเขียนโปรแกรมด้วย NetBeans นั้นจะไม่ต้องพิมพ์คำสั่งเพื่อรัน
โปรแกรม เนื่องจำกมีเมนูคำสั่งต่ำงๆ กำรเขียนโปรแกรมเมื่อพิมพ์คำสั่งลงไป
โปรแกรมจะประมวลผลเพื่อพิจำรณำว่ำเป็นคำสั่งหรือเมธอดใด จำกนั้นจะ
แสดงคำสั่งที่น่ำจะเป็นออกมำให้เลือกใช้ ซึ่งเหมำะกับผู้ที่ เขียนโปรแกรมไม่
คล่อง และผู้ที่ไม่ชอบจำเมธอดต่ำงๆ

3. เริ่มต้นการสร้าง Project บน
Netbeans
เลือกเมนู File -> New Project

4. เลือก Java -> Java
Application
กำหนดชื่อ Project ในส่วนของ Create Main Class ให้ติ๊กออก จำกนั้นเลือก Finish

5. ตอนนี้ได้โปรเจคเปล่า ๆ ยังไม่มีไฟล์.java
สร้าง Package โดยการคลิกขวา Project
-> New -> Java Package...

6. ใส่ชื่อ Package เช่น com.java.myapp
ได้ Package เช่น com.java.myapp เรียบร้อยแล้ว

7. สร้างไฟล์Class ของ Java
คลิกขวาที่ Package เลือก New -> Others...

8. การสร้าง GUI ในการสร้างไฟล์.java แบบ GUI สามารถเลือก Class ได้หลายตัวมาก
เช่น
Swing GUI Forms และภายใน Swing ก็มี Class แยกย่อยอีกหลายตัว เช่นเดียวกัน

9. หรือจะเลือกใช้ AWT GUI Forms ซึ่งจะแยกย่อย Class ได้อีก 4-5 ตัวหลายคน
จะยังสงสัยว่าจะเลือกตัวไหนดี ซึ่งปกติแล้วพวกการเลือกพวก GUI ต่าง ๆ เป็ น
เพียงค่า Default เริ่มต้นตอนที่สร้างไฟล์Classเท่านั้น แต่หลังจากที่สร้างแล้ว
เราสามารถทาการแก้ไข Code ต่าง ๆ
และเรียกใช้งาน Class ต่าง ๆ เพิ่มได้ทีหลัง และสามารถใช้ได้ทั้งSwing
และ AWT หรืออื่น ๆ ในการออกแบบและสร้าง Form ได้
ในขั้นตอนนี้ให้เลือก Swing GUI Forms -> JFrame Form

10. กาหนดชื่อ Class
ตอนนี้ได้เราได้ Class ที่มี .java เรียบร้อยแล้ว พร้อมทั้ง Form เปล่า ๆ ที่โปรแกรม
สร้างมาให้

11. จะเห็นว่ามี Toolbox ที่ประกอบด้วย Controls และ Object ต่าง ๆ มากมาย ที่ไว้
ออกแบบ Form

12. ก่อนอื่นให้เราเข้าใจเกี่ยวกับ Layout ของ Form ซะก่อน ซึ่งปกติแล้วเวลาเราเขียน
บน VB.Net หรือ Visual Studio จะมีการจัดพวกControl ต่าง ๆ ตามตาแหน่ง X , Y
ของ Form แต่ในภาษา Java เราสามารถเลือกที่จะจัดรูปแบบของ Control และ
Object ต่าง ๆ ได้ เช่น จะเป็ นแบบ GridLayout (ให้นึกถึง HTML แบบ Table) และ
อื่น ๆ อีกหลายรูปแบบ แต่ในค่าพื้นฐานแนะนาให้ปรับเป็ น Null layout คือจัดวาง
ตาแหน่งแบบ X , Y เหมือนกับ VB.Net ที่เราคุ้นเคย

13. ตอนนี้ได้เราได้ Class ที่มีทดสอบการสร้าง Label , TextField และ Button ด้วย
(JLabel, jTextField และ jButton) อาศัยการลากวาง ๆ .java เรียบร้อยแล้ว พร้อมทั้ง
Form เปล่า ๆ ที่โปรแกรมสร้างมาให้

14. ปรับแต่ Properties ของ Form ซะหน่อยด้วยการคลิกที่ Form แล้วไป
ที่

15. หรือจะปรับแต่งพวก Size ได้ตามขนาดที่ต้องการ
ทดสอบการรันโปรแกรม
เลือก Class ที่เราได้สร้างไว้เพื่อทาการ Run

16. ได้ผลลัพธ ์ดังรูป
สรุป จากผลลัพธ์จะเห็นว่า Netbeans ช่วยให้เราสร้าง Form GUI ด้วย Java แบบ
ง่ายมาก ๆ โดยที่เรายังไม่ได้เขียน Code เลยซะบรรทัด ก็สามารถสร ้าง GUI ได้แล้ว
และขั้นตอนถัดไป หลังจากได้ GUI แล้ว เราจะต้องสร ้าง Event เหตุการณ์ต่าง ๆ กับ
User เช่นการรับค่าผ่าน Input และแสดง Dialog โต้ตอบแบบง่าย ๆ
Tip&Trick
ในการ code คาสั่งต่างๆ เราสามารถกด CTRL+SpaceBar เพื่อเรียกดูได้ว่า
สามารถใช ้method หรือเรียก Attribute ใดมาใช ้ได้บ้าง หรือบาง
ที NetBeans ก็จะขึ้นส่วนนี้มาให้เอง

17. เมื่อทาการแก้ไข Code เสร็จเรียบร้อย เราจะลองทาการ Run โปรแกรมนี้ดู โดย
การกดปุ่ มสีเขียวที่อยู่ด้านล่างแถบเมนู

18. โดย NetBeans จะทำกำร Save ให้อัตโนมัติทุกครั้งที่จะทำกำร Run ถ้ำ NetBeans ทำกำร compile แล้วไม่พบ error โปรแกรมจะ
แสดงผลที่ส่วนด้ำนล่ำงดังภำพ

19. การสร้าง app android
เริ่มต้นสร ้างแอปพลิเคชันแอนดรอยด์บน Eclipse
เริ่มต้นสร ้างโปรเจค
เริ่มแรกให้เลือกไปที่ File > New > Android Application Project

20. ถ้ำไม่มีให้เลือกก็ให้ไปที่ File > New > Other.. แทน จะมีให้เลือก Android > Android Application
Project (แปลว่ำไม่ได้ติดตั้ง ADT Bundle แต่ไปใช้ Eclipse แบบธรรมดำแทนแน่ๆ แนะนำให้เปลี่ยนไปลง
ADT Bundle แทน)

21. จะมีหน้าต่างให้กาหนดค่าต่างสาหรับโปรแกรม โดยหน้าแรกสุดจะประกอบไปด้วย
Application Name : ชื่อแอปพลิเคชันที่จะแสดงบนเครื่องของผู้ใช้
Project Name : ชื่อโปรเจคของแอปพลิเคชันที่จะแสดงใน Eclipse
Package Name : ชื่อแพคเกจของแอปพลิเคชันนี้
Minimum Required SDK : เวอร ์ชันของแอนดรอยด์ขั้นต่าที่รองรับ
Target SDK : เวอร ์ชันของแอนดรอยด์ที่จะใช้ในโปรเจคนี้
Compile With : เวอร ์ชันของแอนดรอยด์ที่จะใช้ Compile โปรเจคนี้
Theme : ธีมหรือรูปแบบของแอปพลิเคชัน

22. สำหรับ Application Name กับ Project Name สำมำรถตั้งชื่อแตกต่ำงกันได้ แต่ Project Nameไม่แนะนำให้มี
เว้นวรรค ในขณะที่ Application Name สำมำรถกำหนดได้ตำมปกติ
ส่วน Package Name เป็นเสมือนชื่อที่เอำไว้ระบุแอปพลิเคชันนั้นๆ สำมำรถดูเพิ่มเติมได้ที่ Package
Name บน Android Application คืออะไร?
สำหรับ Theme เอำไว้กำหนดรูปแบบของ UI เบื้องต้นว่ำให้มีลักษณะยังไง โดยจะมีให้เลือกระหว่ำง None,
Holo Dark, Holo Light และ Holo Dark with Action Bar

23. ในเบื้องต้นเจ้ำของบล็อกกำหนดค่ำต่ำงๆไว้ดังนี้

24. จากนั้นก็กดปุ่ ม Next > มายังหน้ากาหนดว่าจะตั้งค่าอะไรบ้าง ซึ่งไม่
ต้องยุ่งอะไร ให้กดปุ่ ม Next > ต่อไปได้เลย

25. หน้ำถัดมำจะเป็นหน้ำกำหนดไอคอนของแอปพลิเคชัน ซึ่งจะมีภำพไอคอนอยู่ในระดับหนึ่งและสำมำรถปรับได้เล็กๆน้อยๆ
(ลองกดเล่นๆดูได้) ถ้ำจะให้ดี แนะนำให้เตรียมภำพไอคอนมำกำหนดไว้ในหน้ำนี้เลยดีกว่ำ เพรำะโปรแกรมจะทำกำรปรับขนำด
ของภำพไอคอนให้เหมำะสมกับแต่ละหน้ำจอให้เลย ถ้ำใส่ภำพไอคอนเองทีหลังจะต้องมำนั่งปรับขนำดภำพเองนะเออ เมื่อ
กำหนดเสร็จแล้วก็กดปุ่ม Next > ได้เลย

26. มำจะเป็นรูปแบบของ Activity ที่จะสร้ำง ให้เลือกเป็น Empty Activity แล้วกดปุ่ม Next

27. ต่อมำจะเป็นกำรกำหนดชื่อของคลำส Activity ที่จะสร้ำง ชื่อ Layout และชื่อ Fragment รวมไปถึงรูปแบบของกำร
เปลี่ยนไปยังหน้ำต่ำงๆ (Navigator Type) เนื่องจำกบทควำมนี้สำหรับเริ่มต้นอย่ำงง่ำย ดังนั้นจึงกำหนดค่ำตำมเจ้ำของบล็อก
ไปก่อนนะ กดปุ่ม Finish เพื่อทำกำรสร้ำงได้เลย

28. รอซักพักจนโปรแกรมสร้ำงโปรเจคเริ่มต้นเสร็จ ก็จะได้หน้ำตำประมำณแบบนี้

29. กำรจัดกำรเล็กน้อยสำหรับโปรเจค
สำหรับหน้ำแรกที่แสดงให้เห็นนี้เรียกว่ำ Graphical Layout คือหน้ำออกแบบแอปพลิเคชันแบบซึ่งจะเป็นกำรจำลอง
หน้ำจอให้เห็นว่ำที่ออกแบบไว้มีหน้ำตำคร่ำวๆยังไง สำมำรถลำกอุปกรณ์ต่ำงๆที่อยู่ใน Palette มำวำงบนหน้ำจอได้ทันที
ส่วน activity_main.xml จะขึ้นอยู่กับชื่อของไฟล์นั้นๆ
โดยที่หน้ำนี้สำมำรถดูได้อีกแบบคือ XML ซึ่งเป็นในรูปแบบโค๊ด XML โดยเจ้ำของบล็อกจะนิยมทำงำนในหน้ำ XML
มำกกว่ำ เพรำะกำรจัดเลย์เอำท์ในนี้มันทำได้ยืดหยุ่นกว่ำ ถ้ำเป็นมือใหม่ก็แนะนำให้ฝึกจำกหน้ำ Graphical Layout ก่อน
โดยใช้หน้ำต่ำงที่อยู่ตรงขวำมือที่ชื่อว่ำ Outline ช่วย
สำหรับกำรสลับไปมำระหว่ำงสองรูปแบบดังกล่ำวนี้สำมำรถกดได้ที่แถบข้ำงล่ำงดังภำพ

30. สังเกตที่แถบข้ำงบนจะเห็นว่ำมี MainActivity.java เปิดไว้อยู่ด้วย สำมำรถกดสลับไปมำระหว่ำงแต่ละหน้ำได้
โดยที่หน้ำนี้จะเป็นหน้ำสำหรับเขียนโค๊ดคำสั่งภำษำ Java ที่จะเอำไว้ใช้ควบคุมกำรทำงำนของแอปพลิเคชัน

31. และจะเห็นว่ำมีสองบรรทัดที่มีขัดเส้นใต้สีเหลือง ซึ่งอย่ำเข้ำใจผิดว่ำโค๊ดคำสั่งมีเออเรอร์นะ แต่หมำยถึง "กำรเตือน" หรือ
Warning ซึ่งมีสำเหตุมำจำกกำรประกำศคลำสทั้งสองตัวนี้ไว้แต่ทว่ำไม่มีกำรเรียกใช้ในโค๊ดคำสั่ง โปรแกรมจึงแจ้งประมำณ
ว่ำ "ประกำศคลำสนี้ไว้แล้วทำไมไม่ใช้ มันเปลืองนะ" ซึ่งจะปล่อยไว้อย่ำงงั้นก็ได้ หรือจะลบทิ้งก็ได้เช่นกัน
เพิ่มเติม - สำหรับสำเหตุของ Warning จะมีแตกต่ำงกันไป ให้เอำเม้ำส์วำงบนคำสั่งนั้นแล้วดูสำเหตุได้ เพรำะไม่ได้
หมำยควำมว่ำมีขีดเส้นใต้สีเหลืองแล้วจะลบทิ้งได้เลยนะ
ทำงที่ดีก็ลบทิ้งละกัน โดยเจ้ำของบล็อกลบส่วนที่ไม่จำเป็นออกเหลือดังนี้