2010-12-24

Android Dev - Preparation (3/3)


การเตรียมเครื่องเพื่อการพัฒนาโปรแกรมบน Android (3/3)
ผมเล่าสำหรับผู้ที่จะใช้ Eclipse เพื่อการพัฒนา App ของ Android นะคับ
[ผลลัพธ์ที่ได้]
  • เครื่องที่พร้อมที่จะเริ่มพัฒนา Android Application
  • Android Emulator ที่พร้อมใช้งาน
  • ทำความคุ้นเคยเบื้องต้นกับ ตัว Eclipse   
[อ้างอิง]  http://developer.android.com/sdk/installing.html 

[ขั้นตอนการทำ]
  1. ทำการ install  ตัว Tools ที่ได้ download มา
  2. ทำการ install ตัว ADT (Android Development Tools Plug-in for Eclipse)
  3. Activate ตัว (Android) Emulator
  4. ทำสอบผลการติดตั้ง - โดยการ Run ตัว App ชื่อ "Hello, World"
มาว่ากันเลย...

[Install  ตัว Tools ต่างๆ]

***ก่อนอื่น***  ต้องตัดสินใจให้ได้ว่าเราจะลงไว้ที่ไหน  เช่น [c:\Program Files\]  สำหรับผม  ผมเอาไปกองไว้ที่ [c:\Program Files\android\XXX]  เผื่อเลิกทำ Android จะได้ถอดเป็นยวงไปเลยคับ

***เริ่มที่  JRE6.0 กับ JDK6.0***

เริ่มที่ตัวง่ายๆก่อนคับ  คือ JRE6.0 กับ JDK6.0  โดยการ run ตัวไฟล์ที่ download มา  ทำทีเหมือนอ่าน [Terms and Conditions] แล้วกดกดไปจนจบ  ทำทั้งสองตัวเสร็จแล้วค่อย Reboot นะครับ

*****จด directory ของตัว JRE ไว้หน่อยคับ  จะมีการอ้างอิงตอนทำ Tutorials ตัว MapView คับ

*****http://developer.android.com/resources/tutorials/views/index.html

***ตัวต่อไป ตัว Eclipse***

ขั้นตอนนี้คือการติดตั้งตัว Eclipse คับ

Eclipse เป็น IDE ย่อมาจาก *Integrated* Development Environment

*Integrated* ยังไง   ที่เรียกว่า Integrated เพราะมันมี Editor, Compiler, Debugger แบบเบ็ดเสร็จ เพราะถ้าเป็นสมัยก่อน  ต้อง NotePad เพื่อการเขียนโค๊ต  เขียนเสร็จ(ผิดถูกไม่รู้)ค่อยไปโหลดตัว Compiler.exe  พอเสร็จต้องทดสอบเอง  โชคดีมีตัว Debugger มาให้ก้อสามารถ debug  ถ้าไม่มีก้อต้องใช้เทคนิค print ค่าตัวแปรออกหน้าจอเอาเองคับ

Eclipse ไม่ได้ทำมาในรูปแบบของ Windows Installer คับ  เราแกะ(UnZip)ออกมาที่จุดหมายปลายทางของเราได้เลย 

ตามนี้ดังนี้คับ
  1. แกะ (Unzip) ไปที่ๆกำหนด  ผมแกะไว้ที่ [c:\Program Files\android\eclipse\]
  2. สร้าง ShortCut (เอง) เพื่อไว้เรียกใช้ตัว Eclipse ได้สะดวก โดยการกดปุ่มเมาส์ขวาที่ eclipse.exe->SendTo->DeskTop
  3. ทำการ Run ตัว Eclipse ครั้งแรก  โปรแกรมจะให้ระบุ Dir ที่เราจะทำการและที่เก็บ Source Code (ผมระบุไว้เป็น  [d:\data\android\eclipse\])
  4. (นับหนึ่งถึงสิบช้าๆ... หรือจนมันนิ่งๆไป) ให้ออกจากโปรแกรมเพื่อทำการติดตั้งต่อไป


***ต่อไปคือ Android SDK***ขั้นตอนนี้นี้คือการติดตั้งตัว SDK คับ

อันนี้ทำเหมือนตัว Eclipse คับ แกะไปไว้ที่ที่กำหนดไว้  ผมไว้ที่  [C:\Program Files\android\sdk_1.6_r1]

พอแกะเสร็จแล้วให้ทำดังนี้คับ

1. ตั้งค่า PATH ของ WinXP ให้ชี้ไปที่ Tools  ดังนี้

(ของผมคือ [C:\Program Files\android\sdk_1.6_r1\tools])
  • [เมาส์ขวาที่ MyComputer]->[Properties]->[Advanced]->[ปุ่ม Environment Variables]
  • [กรอบ System variables]->[เลือกบรรทัด Path]->[กดปุ่ม Edit]
  • (ค่อยๆนะครับ) ทำการเติม [C:\Program Files\android\sdk_1.6_r1\tools;]ต่อท้ายเข้าไปโดยมีเครื่องหมาย ";" (Semi-Colon) คัน(ก่อน)หน้านะคับ  [...ของเดิม...; C:\Program Files\android\sdk_1.6_r1\tools;]
  • ถ้าพลาดพลั้งยังไงกด [Cancel] ถอยออกมาก่อนคับ
[ทำการ install ตัว ADT - ขั้นตอนนี้ต้องต่อ Net ด้วยคับ] 
**อ้างอิง** http://developer.android.com/sdk/eclipse-adt.html  ขั้นตอนนี้เป็นการติดตั้งตัว ADT คับ

ADT คือ Android Developer Tools ที่เป็น Plug-in บน Eclipse คับ

ชื่อก้อบอกอยู่แล้วว่าเป็น Plug-in (เสียบเพิ่มเข้าไป) ดังนั้นการติดตั้งจะต้องเรียก Eclipse ขึ้นมาก่อนคับ
  1. Run โปรแกรม Eclipse ขึ้นมา (จาก ShortCut ที่เราทำไว้ตอนแรกอ่ะ)
  2. *ที่ Eclipse* [Menu Help]->[Install New Software]->[กดปุ่ม Add] แล้วระบุดังนี้[Name]="Android PlugIn"[Location] = https://dll.ssl.google.com/android/eclipse/
  3. [กด OK]  แล้วทำการเลือก  DDMS กับ DevTools  แล้วกดไปเรื่อยๆจนจบ
  4. จบแล้วให้ลงไปสั่งก๊วยเตี๋ยวกินสักชาม  กินเสร็จแล้วค่อยมาทำต่อ  เนื่องจาก Eclipse จะต่อไปที่ Google เพื่อทำการ download และติดตั้งตัว Plug-in เอง
  5. พอดูว่ามันสลบไปแล้ว (คือ ไฟ Harddisk หยุดกระพริบ) ให้ปิดโปรแกรม Eclipse
  6. พอปิดเสร็จแล้วนับหนึ่งถึงสิบ  แล้วเปิดใหม่  คราวนี้ให้ไปเข้าห้องส้วม  ล้างมือ  ล้างหน้าหน่อย เนื่องจาก Eclipse จะทำการติดตั้ง"โน้นนี้นั้น"อีก"หน่อยหนึ่ง"
  7. พอดูว่ามันสลบไปแล้ว  ก้อทำการ Reboot เครื่องสักหน่อย  (จะได้ดูขลัง)
  8. เรียก Eclipse อีกครั้ง  ไปที่ [Menu Window]->[Preferences]->[กรอบซ้าย Android]->[กรอบขวา SDK Location]  ให้ระบุไปที่ที่ติดตั้งตัว SDK(ของผมคือ [C:\Program Files\android\sdk_1.6_r1])
  9. ปิดโปรแกรม Eclipse
[Activate ตัว Android Emulator]

Android Emulator ตัวนี้ถูกออกมากมาให้ทำงานกับ SD_Card  เสมือน (คือเสมือนกับเราใส่ Memory Card ที่เป็นแบบ SD เข้าไปในเครื่องมือถือ)  ศัพท์ที่เรียก(เทห์ๆ)กันคือ [AVD Manager] ย่อมาจาก [Android Virtual Device Manager] ดังนั้นเราต้องทำการสร้าง SD_Card หลอกๆให้  ดังต่อไปนี้
  1. เรียก Eclipse (อีกแล่ะ)
  2. **ที่ Eclipse**  [Menu Window]->[Android SDK and AVD Manager]->[กรอบซ้าย Virtual Device]->[ปุ่ม New]
  3. ระบุดังนี้[Name] = ตั้งชื่อ SDCard ของคุณ อะไรก็ได้  (ผมใช้  card1)[Target] = Android 1.6 – API Level 4

    [Size] = 2000 MB  (เสมือนเป็น SDCard ขนาด 2GB)

    [Built-in] = Default (HVGA)
  4. กดปุ่ม [Create AVD]
  5. ปิดโปรแกรม Eclipse (ไม่รู้จะให้ปิดทำไม เพราะเดี๋ยวขั้นต่อไปก้อต้องเปิดอีกอ่ะ)
ถ้าถึงจุดนี้ถือว่าการติดตั้งเสร็จสิ้น  ต่อไปจะทำการทำสอบว่าการติดตั้งถูกต้องและทำงานได้จริง 

[ทำการทดสอบผลการติดตั้ง โดยการ Run ตัว App ชื่อ "Hello, World"]

สิ่งที่จะทำคือการรัน App ตัวแรก(ในชีวิต)บนตัว Emulator คับ  ให้ทำดังนี้คับ

***เปิด Source Code ตัวอย่างของ Hello, Word***

ทำการเปิด Source Code ขึ้นมา
  1. Run Eclipse ขึ้นมา (เห็นป่ะ  แล้วให้ปิดทำไมเนี้ย)
  2. [Menu File]->[New]->[Project…]->[Android]->[Android Project]
  3. [เลือก  Create project from existing source] ตั้งค่าเป็น [c:\...…\sdk_1.6_r1\platforms\android-1.6\samples\HelloActivity]
  4. กดปุ่ม [Finish]
***ทำการ Run โปรแกรม Hello, World***

ทำการ Run โปรแกรม
  1. [กรอบซ้าย Project Explorer]->[HelloActivity]->[คลิกที่ src]
  2. [Menu Run]->[เลือก Run]->[เลือก Android App]->[กด OK]
  3. รอให้ Emulator โหลดตัวเองขึ้นมา  (เร็ว/ช้า ก้ออยู่ที่ Spec เครื่องละคับ  ตอนนี้)
 ***รอโปรแกรม Hello, World ที่ Emulator***

พอ Emulator โหลดตัวเองขึ้นมาแล้ว  ตัวมันเองจะเข้าโหมด "Key Lock" เสมือนมือถือเวลาเราต้องการ lock ปุ่มเวลาเอาเครื่องใส่กระเป๋ากางเกง  เราต้องทำดังนี้
  1. เมื่อ Emulator โหลดเสร็จแล้วอยู่ใน Mode "Key Lock"
  2. **บน Emulator** [กดปุ่ม Menu] เพื่อ Unlock
  3. โปรแกรม Hello, Word จะโหลดตัวเองขึ้นมา
  4. **บางครั้ง** อาจมี Pop-Up  บ่นว่า "Warning, Process…  Not Responding"ไม่เป็นไร  ให้กด [Wait]
  5. **บางครั้ง**  [กด Wait] แล้วเงียบ  สงบ "Hello, World ไม่ขึ้นให้"สลับ"กลับไปที่ Eclipse แล้วทำหัวข้อ ***ทำการ Run Hello, World*** อีกครั้ง("สลับ" = Switch กลับไปที่ Eclipse โดยที่ยังไม่ต้องปิดตัว Emulator)
  6. **บางครั้ง** Hello, World ไม่ขึ้นอีกให้ทำการปิดโปรแกรมอื่นๆบนเครื่องให้หมด  แล้วทำข้อ 5 อีกครั้ง
  7. **บางครั้ง** Hello, World ไม่ขึ้นอีกให้ทำการปิดตัว Emulator ไปเลย แล้วทำข้อ 6 แล้วทำหัวข้อ ***ทำการ Run Hello, World*** อีกครั้ง
  8. **ทั้งหมดนี้** อาจเป็นเพราะเครื่อง Spec ไม่ถึงคับ  อย่างเครื่องผมต้องทำข้อ 6 (แน่นอน) และทำข้อ 7 เป็นบางครั้ง  เวลาทำการพัฒนาโปรแกรมจิงๆ  เราสามารถ"สลับ"กลับไปกลับมาระหว่าง Eclipse กับ Emulator ได้คับ

.

[หน้าจอตอน Emulator ขึ้นข้อความ "…. Not Responding…"]




[โดยสรุป]
ขั้นตอนที่บรรยายไว้น่าจะสามารถนำท่านมาจบที่โปรแกรม Hello World บน Emulator ได้อย่างสะดวกโยธิน  ผมเชื่อว่าบางท่านอาจติดขัดอะไรบ้างเพราะฐานของเครื่องมีโปรแกรมมามากน้อยไม่เท่ากัน

นอกเหนือไปจากเครื่องที่พร้อมในการพัฒนาโปรแกรม Android แล้ว  สิ่งที่ผมรู้สึกได้คือว่า Tools ทุกอย่างเป็น 100% Freeware  เราสามารถเริ่มได้จากตัวปล่าวๆไม่ต้องลงทุนอะไรเลย  สำหรับผู้ที่ต้องการจะเรียนรู้ในโลกของ Android นี้   ผมถือว่ามันเป็นจุดเริ่มต้นที่ดีมากๆเลยคับ

สิ่งที่อยากให้ทำต่อไปคืออยากให้ทำ Bookmark ของ IE ให้ชี้ไปที่ Document ใน SDK  โดยใช้ IE ทำการเปิดไฟล์

[c:/…  …/sdk_1.6_r1/docs/guide/topics/fundamentals.html]  แล้วทำเป็น bookmark ไว้ (ทำเป็น Favorites ไว้)

เราสามารถอ่านคู่มือและพัฒนาทุกอย่างโดยที่ยังไม่ต้อง Online ใดๆคับ  สำหรับท่านที่ติดตั้งอยู่บน NoteBook  ท่านก้อจะสามารถพัฒนา Apps บนเครื่องได้ทุกที่ทุกเวลาแบบ OffLine  ใช้ชีวิตอิสระพัฒนา App ไปแลกค่าขนมเล็กๆน้อยคับ  หรือจะไปปลูกผักขายไปทำ Android ไปก้อได้คับ (เวอร์ไปมั๊ยเนี้ย)

 Blog หน้า  จะพาชมการเริ่มต้นพัฒนา App ของ Android โดยเดินตามโปรแกรมตัวอย่างที่มีไว้ใน SDK ทั้งหมดเลยคับ  โดยผมถือคติว่า  การเรียนรู้ที่ดีที่สุดคือการทำเอง  คุณจะเข้าใจเทคนิคได้ดีที่สุดจากการไล่ Code คับ

สวัสดีปีใหม่ 2010

...เที่ยวไปตามตะวัน  บุกบันไปตามลม  สนุกสุขสมหัวใจหายคว่ำ....

Solution 9420 Blog