บทที่ 1 การติดตั้ง PhoneGap บน Eclipse สำหรับ Android

ขอประเดิมบทแรกด้วยการติดติ้ง PhoneGap เพื่อเขียน หรือพัฒนาแอพบน Android  ครับ !
โดยเครื่องของคุณจะต้องติดตั้ง SDK และ Eclipse ให้เรียบร้อยก่อนนะครับ เมื่อพร้อมแล้ว
เข้าเว็บด้านล่างนี้ เพื่อดาวห์โหลด เลยครับ
http://phonegap.com/download

คลิก Download


เมื่อคลี่ไฟล์ ออกมาคุณจะพบ กับโฟลเดอร์ 


    โฟลเดอร์ doc คือ ตัวอย่างและวิธีการเขียน PhoneGap สามารถเปิดอ่านได้โดยรันผ่าน 
เว็บบาวเซอร์
    โฟลเดอร์ถัดมาคือ  lib ตัวนี้ละครับที่ คุณจะเอาไปพัฒนาแอพบนโมบายรุ่นต่างๆ ซึ่งภายในจะประกอบด้วย Android,  Bada, BadaWac, Blackberry, ios, Symbian, Webos และ Windows-phone


ตอนนี้คุณต้องการเขียน บน Android ก็คลิกเข้าไปในโฟลเดอร์ android เลยครับ
จากนั้นเปิด โปรแกรม Eclipse  แล้วสร้าง New Android Application ให้เรียบร้อยครับ
สร้างตามที่คุณต้องการ !


เมื่อสร้างเสร็จแล้วต่อไป จะให้คุณติดตั้ง PhoneGap  กันครับ
ไปที่โฟลเดอร์ anroid ของ PhoneGap ที่คุณโหดลมา 
คลิกขวาที่ cordova-2.0.0.jar เลือก Copy 


กลับมาที่โปรแกรม Eclipse ที่โปรเจ็คแอพคุณ
คลิกขวา ที่โฟลเดอร์ libs เลือก Paste เพื่อวาง


เสร็จแล้วจะได้ตามรูปนี้ครับ


มาต่อกันครับ ไปที่โฟรเดอร์ assets ครับ
คลิปขวา แล้วเลือก New จากนั้นไปที่ Folder เพื่อสร้างโฟรเดอร์ใหม่เข้าไปครับ



ตั้งชื่อ Folder name: ให้คุณใส่ www จากนั้นกด Finish


ให้คุณ Copy ไฟล์ cordova-2.0.0.js จากโฟลเดอร์ PhoneGap ทีุ่คุณโหลดมาในโฟลเดอร์
android  


ให้คุณนำไปวางใว้ใน โฟลเดอร์  www ของ assets  ที่คุณเพิ่มสร้างไป



เมื่อ Copy มา Paste คุณจะได้แบบนี้ครับ


กลับไปที่โฟลเดอร์ android เพื่อ Copy โฟลเดอร์ xml


ให้คุณนำไฟล์ xml ไปวางใว้ในโฟลเดอร์ res เลยครับ


เสร็จแล้วจะได้ตามรูปด้านล่างนี้ครับ


ขั้นตอนสุดท้าย คุณจะต้องตั้ง Path ให้กับ App Android ด้วย
ให้คุณ คลิกขวาที่โปรเจ็ค App Android  ของคุณ
ไปที่ Build Path  จากนั้น คลิกเลือก Configure Build Path.. 


คลิกที่ Resource 
เลือก  Java Build Path
คลิกที่แท็ป Libraries


คลิกที่ Add JARs... เมนูด้านขวา เลยครับ


จะมี popup ขึ้นมาให้คุณเลือกโปรเจ็ค App Android ที่คุณติดตั้ง PhoneGap ใว้แล้ว
ไปที่ โฟรเดอร์ libs 
เลือก cordova-2.0.0.jar
แล้วกด OK ครับ

จากนั้น กด OK อีกครั้ง



แค่นี้ก็เสร็จแล้วการติดตั้ง PhoneGap ครับ อาจจะยุ่งยากไปนิดนะครับ
บทต่อไป จะเริิ่มเขียนกันเลยครับ..






















0 comments:

Post a Comment