ตามธรรมเนียมไทย เจอกันครั้งแรกมักกล่าวคาว่า “สวัสดี” ช่างประจวบเหมาะกับธรรมเนียมในการเริ่มต้นหัดเขียนโปรแกรมซึ่งนิยมเขียน Hello world เป็นโปรแกรมแรกเช่นกัน แต่ผมจะทำอะไรที่แตกต่างออกไปนิดหน่อย คือเปลี่ยนจาก Hello World เป็น Hello BlackBerry
สิ่งที่ต้องจำเป็นต้องมี
ด้านล่างเป็นรายการเครื่องมือ ต่างๆที่จำเป็นต้องใช้ ถ้าคุณยังไม่มีแล้วละก็ให้ รีบไปจัดมา แล้วกลับมาเจอกันในหัวข้อถัดไป
1. Sun SDK :
http://java.sun.com/javase/downloads/
2. Eclipse:
http://www.eclipse.org/downloads/
3. Blackberry Plug-in for eclipse :
http://na.blackberry.com/eng/developers/
ถ้าคุณคิดว่า “บอกแค่นี้แล้วจะติดตั้งสำเร็จได้ยังไง” ผมมีตัวช่วยครับ คุณสามารถอ่านวิธีการติดตั้งได้จากเอกสาร
http://na.blackberry.com/developers/resources/A1_Setting_up_necessary_tools_v5.0.pdf
แต่ถ้าคุณรอได้ ครั้งหน้าผมจะนำเสนอวิธีติดตั้งเครื่องมืออย่างละเอียดอีกครั้ง เขียนมาถึงตรงนี้เริ่มสงสัยว่า ทำไมผมถึงไม่สอนวิธีติดตั้งก่อนนะ นั่นน่ะสิ แต่ผมอยากเขียนเรื่อง “สวัสดี Blackberry” ก่อนนี่นา
BlackBerry สวัสดีครับ
เมื่อพร้อมแล้วเรามาเริ่มกันเลย เราจะลำดับขั้นตอนการเรียนรู้ดังนี้ครับ
1. สร้าง BlackBerry project
2. เริ่มสร้างคลาส
3. ทำความรู้จักและเข้าใจ UiApplication และ MainScreen
4. เขียน Hello BlackBerry
5. รันโปรแกรมผ่าน Simulator
สร้าง BlackBerry Project
1. คลิ๊กเมนู File > New > Project
2. เลือก BlackBerry Project ดังรูปที่1
รูปที่ 1
3. คลิ๊ก Next
4. ระบุ Project Name เป็น “Hello BlackBerry” ดังรูปที่ 2
รูปที่ 2
5. คลิ๊ก Finish
สร้างคลาส
1. ก่อนจะมีคลาส ต้องสร้าง Package กันก่อนโดยคลิ๊กเมนู File >New>Package
2. กรอกชื่อ Package เช่น com.rim.samples.helloblackberry อย่าลืมว่าต้องใช้ lowercase ทั้งหมดนะครับ
รูปที่ 3
3. คลิ๊ก Finish
4. ต่อไปสร้างคลาสโดยการคลิ๊กเมนู File > New >Class
รูปที่ 4
5. ลองตรวจสอบนะครับว่า Source Folder มีค่าเป็น Hello BlackBerry/src และ Package มีค่าเป็น com.rim.samples.helloblackberry หรือไม่ จากนั้นในช่อง Name ให้ใส่ชื่อคลาสว่า HellBlackBerry แล้วคลิ๊ก Finish
ทำความรู้จัก UiApplication และ MainScreen
- -UiApplication :ให้จำไว้เสมอว่า Application ที่มี user interface ต้อง extend (inherit ) มาจาก UiApplication ซึ่งมีหน้าที่ในการบริหารจัดการ Object ของ Screen(หน้าจอ) ในรูปแบบของ stack นั่นคือ เมื่อต้องการแสดง Screen ใดๆ มันจะทำการ push Screen นั้นไว้อยู่บนสุดของ Stack เมื่อมีการ pop Stack มันจะทำการนำ Screen ที่อยู่ล่างถัดไปมาแสดงแทน และจะมีเพียง Screen ที่อยู่บนสุดของ stack เท่านั้นที่ตอบสนอง event ต่างๆ ได้
- - MainScreen :คือหน้าจอส่วนแสดงผลข้อมูล ดังนั้นเราจะเขียนโค้ด “Hello BlackBerry” ในคลาสนี้ จริงๆแล้วเราสามารถใช้คลาส Screen ก็ได้แต่มันมีความยุ่งยากในการเขียนมากกว่า MainScreen ซึ่งช่วยจัดการ Layout ต่างๆให้เราได้
เริ่มเขียนโค้ดกันเลย
1. อย่างที่ได้บอกไปแล้วเราต้องมีคลาส UIApplication เพื่อจัดการ screen ดังนั้นให้ทำการเพิ่มโค้ด extends เข้าไป ดังนี้
public class HelloBlackBerry extends UiApplication
2. แน่นอนว่าเพื่อให้การอ้างถึง UiApplication สมบูรณ์เราต้องทำการ import package ของมันมาด้วย โดยการนำเมาส์ไปคลิ๊กตรงชื่อ UiApplication จากนั้น กด <Ctrl + Shift + O > eclipse จะทำการสร้างส่วนของการ import ให้โดยอัตโนมัติ แต่ถ้าคุณเป็นคนขยันอยากพิมพ์เองก็ได้เลยครับ ให้พิมพ์ข้อความต่อไปนี้ในบรรทัดที่สอง
import net.rim.device.api.ui.UiApplication;
เสร็จแล้วคุณจะได้หน้าตาโค้ดประมาณนี้นะ
package com.rim.samples.helloblackberry;
import net.rim.device.api.ui.UiApplication;
public class HelloBlackBerry extends UiApplication {
}
3. จากข้อ 2 จะเห็นว่าทำมาตั้งนานได้แค่คลาสว่างๆมาคลาสนึง ใช่แล้วมันยังทำงานไม่ได้ครับ เราต้องสร้างฟังก์ชั่น Main ขึ้นมา ส่วนนี้จะเป็นจุดเริ่มต้นการทำงานของ Application ซึ่งภายในฟังก์ชั่นเราจะทำการสร้าง instance ของ HelloBlackBerry จากนั้นสั่งให้มันแสดงหน้าจอซึ่งสามารถรอรับ Event ต่างๆได้ โดยการเรียกฟังก์ชั่น enterEventDispatcher ใครเริ่มขี้เกียจพิมพ์แล้วบ้างครับ โอเค Copy โค้ดด้านล่างนี้ไปใช้ได้เลย แต่ผมแนะนำว่า พิมพ์เองดีกว่านะ
public static void main(String[] args)
{
HelloBlackBerry theApp = new HelloBlackBerry();
theApp.enterEventDispatcher();
}
4. ฟังก์ชั่นต่อมาคือ Constructor ของ HelloBlackBerry ซึ่งจะถูกเรียกใช้ทันทีหลังจากมีการ new ในฟังก์ชั่น main โค้ดที่เราเขียนจะเป็นการสร้าง instance ของ screen จากนั้นเอาไปวางไว้บน stack ของ UIApplication หรือที่เราเรียกกันว่าการ push (คุ้นๆนะเนี่ย push & pop) โดยการเรียก pushScreen ส่วนชื่อคลาสที่ทำหน้าที่เป็น Main Screen นั้นผมขอตั้งไว้ล่วงหน้าเลยว่า HelloBlackBerryScreen จะไดผลลัพธ์ดังนี้
public HelloBlackBerry()
{
//display a new screen
pushScreen(new HelloBlackBerryScreen());
}
5. ต่อมาเราจะมาทำส่วนของ MainScreen กันบ้าง วัตถุประสงค์ของเราเพียงแค่ให้มันแสดงข้อความ “Hello BlackBerry” ผมไม่ต้องบอกคุณก็คงเดาถูกว่าให้ new คลาสที่ชื่อว่า HelloBlackBerryScreen ขึ้นมา แต่คราวนี้ผมจะลองแนะนำวิธีการสร้างคลาสพร้อมทั้ง extend ไปด้วยในครั้งเดียว
- เหมือนเดิมครับคลิ๊กเมนู File > New >Class
- ในช่อง Name ให้ใส่ชื่อ HelloBlackBerryScreen
- ในช่อง SuperClass ให้พิมพ์ MainScreen จากนั้นกด <Ctrl + Space> เพื่อให้ eclipse เติมชื่อพร้อม package ให้โดยอัตโนมัติเป็น net.rim.device.api.ui.container.MainScreen ถ้าใครทำไม่ได้ก็พิมพ์ยาวๆเองเลย ลองตรวจสอบดูว่าคุณพิมพ์เหมือนรูปที่ 5 หรือไม่
รูปที่ 5
6. จากนั้นคลิ๊ก Finish จะได้ผลลัพธ์ดังนี้
package com.rim.samples.helloblackberry;
import net.rim.device.api.ui.container.MainScreen;
public final class HelloBlackBerryScreen extends MainScreen {
}
7. เนื่องจากผมลืมบอกคุณ ให้คลิ๊กตัวเลือกเพื่อสร้าง constructor แบบอัตโนมัติ ดังนั้นเราต้องเขียนกันเองอีกครั้ง ทำเลยครับ นิ่งอยู่ทำไม
8. อื้ม ใกล้แล้วสินะ อีกนิดเดียว ใน Constructor เราจะสั่งโปรแกรมให้แสดงข้อความว่า “Hello BlackBerry” โดยการสร้าง LabelField ขึ้นมาจากนั้นเรียกฟังก์ชัน add เพื่อเพิ่ม Control นี้เข้าไปในหน้าจอ
public HelloBlackBerryScreen(){
super();
add(new LabelField("Hello BlackBerry!"));
}
9. ผมรู้ครับว่ามันยัง error อยู่เพราะเรายังไม่ได้ทำการ import package ให้คุณเอา mouse ไปคลิ๊กตรง LabelField จากนั้นกด<Ctrl + Shift + O>
10. ยินดีอย่างยิ่งที่จะบอกว่าทุกอย่างเสร็จเรียบร้อยแล้ว คุณลองตรวสอบดูว่าได้ผลลัพธ์สุดท้ายเหมือนโค้ดด้านล่างหรือไม่
package com.rim.samples.helloblackberry;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.container.MainScreen;
public final class HelloBlackBerryScreen extends MainScreen {
public HelloBlackBerryScreen(){
super();
add(new LabelField("Hello BlackBerry!"));
}
}
Run บน Simulator
ส่วนของการโค้ดเสร็จแล้วต่อไปก็ลองรัน Application ใน Simulator โดย
1. ก่อนจะ Run ได้คุณจะตองทำการ configuration เล็กน้อยซึ่งจะทำเพียงครั้งเดียวเท่านั้น (ในการ Run ครั้งต่อไปให้กด <Ctrl + F11> ได้เลย) ให้เข้าไปที่เมนู Run > Run configuration จะเห็นหน้าจอดังรูปที่ 6
รูปที่ 6
2. ในหน้าต่างด้านซ้ายให้เลือก BlackBerry Simulator จากนั้นกดปุ่ม
ด้านบน
3. จะพบหน้าจอดังนี้
รูปที่ 7
4. ทำการใส่ชื่ออะไรก็ได้ในช่อง Name ที่สาคัญใน tab Projects ให้ทำการเลือก Project “Hello BlackBerry” ของเราด้วย
5. คุณสามารถเลือกรุ่นของ Simulator ได้ โดยการเลือก tab Simulator ในที่นี้ผมเลือก BlackBerry-SDK-9550 จากนั้นกด Run
รูปที่ 8
6. เราจะเห็นหน้าตา Simulator ดังรูปที่ 9 ด้านล่าง(ซึ่งจะแตกต่างกันไปตามรุ่นของ Simulator ที่เลือก)
รูปที่ 9
7. โปรแกรมของเราจะถูก install เข้าไปไว้ในส่วนของ Downloads หาให้เจอนะครับ มันอธิบายลาบากว่าอยู่ตรงไหน
8. ถ้าหาเจอแล้วคลิ๊ก program ขึ้นมาจะเห็นหน้าจอประมาณนี้
รูปที่ 10
ส่งท้าย
เสร็จสิ้นกระบวนความ เป็นอันว่าทั้งเขียนและ Run ได้เรียบร้อย
ก่อนจะจากกันไป ผมอยากให้คุณลองแก้ไขโปรแกรมเล่นกันเองดูบ้าง อันดับแรก ลองแสดงข้อความบน Title โดยการเพิ่มโค้ดด้านล่างใน constructor ของคลาส HelloBlackBerryScreen
LabelField title = new LabelField("Hello BlackBerry Sample",
LabelField.ELLIPSIS | LabelField.USE_ALL_WIDTH);
setTitle(title);
ครั้งแรกที่เราพบกันเรากล่าวสวัสดี ก่อนจากกันก็ควรจะลาสักเล็กน้อย ดังนั้นเราจะแสดงข้อความ Goodbye เมื่อโปรแกรมถูกปิด โดยใช้โค้ดด้านล่างเพิ่มลงในคลาส HelloBlackBerryScreen
public boolean onClose()
{
Dialog.alert("Goodbye!");
System.exit(0);
return true;
}
ผมหวังว่าคุณจะแก้ปัญหาเกี่ยวกับการ import package ต่างๆได้แล้วนะครับ จากนั้นทดลอง run และปิดโปรแกรม จะเห็นข้อความสุดท้ายที่ผมจะอยากจะบอกกับคุณ