SlideShare une entreprise Scribd logo
1  sur  23
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
AndroidApp
μμÔ´μÒÁ¢ŒÍÁÙÅ¢‹ÒÇÊÒÃ
http://khaooat.com/
http://programsdd.com/
https://www.facebook.com/ProgramsDD
http://khaooat.com/icourse/
AndroidApp
ÊÊÒúÑÞ
รูจัก PhoneGap 1
การตรวจสอบ System Type ของ Windows 3
การติดตั้ง Java 3
การติดตั้ง Eclipse 6
เริ่มตนการสราง Android Application 10
การติดตั้งและใชงาน PhoneGap 17
การสราง Icon Application 29
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
AndroidApp
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
1
AndroidApp
ÃÃÙŒ¨Ñ¡ PPhoneGap
PPhoneGap ¤×ÍÍÐäÃ
PhoneGap คือ เครื่องมือสําหรับพัฒนา Mobile Application ที่ชวยใหพัฒนา Application
บนสมารทโฟนไดงายโดยใช HTML5, Javascript หรือ CSS เพียงเราสามารถสรางเว็บไซตไดก็สามารถ
สรางแอพพลิเคชั่นได และยังสามารถทํางานขาม Platform ได เชน iOS, Android, Windows
Phone, BlackBerry, Symbian, webOS, และ bada
¡Ò÷íÒ§Ò¹¢Í§ PhoneGap
PhoneGap จะหอหุม (Wrap) สิ่งที่เราสรางขึ้นจาก HTML5, Javascript หรือ CSS ใหเปน
Application ที่สามารถทํางานไดในระบบปฏิบัติการตางๆ ของสมารทโฟน โดยPhoneGap มีรูปแบบ
การทํางาน 2 ลักษณะ ไดแก
PhoneGap Build เปนการสราง Application บนเว็บ build.phonegap.com เพียงสมัคร
AdobeID ก็สามารถหอหุม HTML5, Javascript หรือ CSS เปน .zip แลวอัพโหลดเพื่อ
Build เปน Application บน Platform ตางๆ ไดทันที แตจะมีขอจํากัดดานขนาดและ
จํานวนของ Application หากตองการขนาดและจํานวนเพิ่มตองเสียเงิน
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
2
AndroidApp
PhoneGap Developer เปนการสราง Application โดยใชโปรแกรม Eclipse สามารถทํา
ไดโดยเขาไปดาวนโหลดเครื่องมือไดที่ phonegap.com แตจะมีความยุงยากกวา
PhoneGap Build เนื่องจากจะตองติดตั้งโปรแกรมหลายชนิด และมีการเขียนโคด ซึ่งขอดีก็
คือฟรี และสามารถสราง Application ไดไมจํากัดขนาดและจํานวน
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
3
AndroidApp
¡¡ÒÃμÃǨÊͺ SSystem Type ¢¢Í§ WWindows
กอนที่จะติดตั้งเครื่องมือใดๆ ลงในคอมพิวเตอร จะตองตรวจสอบ System Type ของ
Windows กอนวาเปน 32 หรือ 64 บิต โดยคลิกที่ This PC Properties
จากรูปเปน Windows 8.1 Pro ที่มี System Type เปน 64 บิต ดังนั้นการติดตั้งเครื่องมือที่
มีใหเลือกระหวาง 32 กับ 64 บิต ก็ใหเลือกใหตรงกับ System Type
¡¡ÒÃμÔ´μÑé§ JJava
การสรางพัฒนา Application สําหรับแอนดรอยดจะพัฒนาภายใตการทํางานของ JAVA โดย
โปรแกรมที่ใชในการพัฒนา Application ก็คือ Eclipse ซึ่งกอนที่จะติดตั้ง Eclipse จะตองทําการ
ติดตั้ง JAVA กอน โดยมีขั้นตอนดังนี้
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
4
AndroidApp
1. คลิกขวาที่ JDK 8 Update 40 แลวเลือก Extract Here
2. เขาไปที่โฟลเดอร JDK 8 Update 40 แลวดับเบิลคลิก JDK 8 Update 40 ตาม System
Type
3. คลิก Next
4. คลิก Next
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
5
AndroidApp
5. รอสักครู
6. คลิก Next
7. รอสักครูขณะที่โปรแกรมกําลังติดตั้ง
8. คลิก Close
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
6
AndroidApp
¡¡ÒÃμÔ´μÑé§ EEclipse
Eclipse เปนโปรแกรมสําหรับสราง Application สําหรับแอนดรอยด ซึ่งสามารถใชไดกับ
Windows 7 / 8 / 8.1 มีใหเลือกทั้ง 32 และ 64 บิต ดังนั้นตองเลือกใชใหตรงกับ System Type ดวย
โดยขั้นตอนการติดตั้งมีดังนี้
1. คลิกขวาที่ ADT Bundle Windows แลวเลือกคําสั่ง Extract Here
2. เขาไปที่โฟลเดอร ADT Bundle Windows x64 eclipse
3. ดับเบิลคลิก eclipse เพื่อเขาสูโปรแกรม
4. รอสักครูจะปรากฏหนาตาง Workspace Launcher ใหคลิก Browse เพื่อเลือกที่เก็บไฟล
5. คลิก OK
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
7
AndroidApp
6. จะปรากฏหนาตาง Java - Eclipse
7. ไปที่ Windows Android SDK Manager
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
8
AndroidApp
8. จะปรากฏหนาตาง Android SDK Manager ใหทําการเลือก Tools และ Android Version
ที่ตองการ โดยปกติโปรแกรมจะเลือกใหอัตโนมัติ (หากไมเลือกอัตโนมัติใหเลือก Android
Version 5.1 และ 4.4)
9. คลิก Install Packages
10. คลิก Accept License สังเกตวา
ดานซายมือจะตองขึ้นเครื่องหมาย
ถูกทั้งหมด
11. คลิก Install
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
9
AndroidApp
12. Android SDK Manager กําลังดาวนโหลดเครื่องมือและ Android Version ที่เลือก ใน
ขั้นตอนนี้จะใชเวลา 2 – 3 ชั่วโมง แนะนําใหเชื่อมตออินเทอรเน็ตความเร็วสูง
13. คลิก OK
14. คลิก Close
15. ปดโปรแกรม Java – Eclipse แลวเปดขึ้นมาใหม
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
10
AndroidApp
ààÃÔèÁμŒ¹¡¡ÒÃÊÌҧ AAndroid AApplication
1. เปดโปรแกรม Java – Eclipse
2. ไปที่ New Android Application Project
3. กําหนดรายละเอียดดังนี้
Application Name กําหนดชื่อ
แอพพลิเคชั่น
Project Name กําหนดชื่อโปรเจค
เหมือนกับชื่อแอพพลิเคชั่น
Package Name กําหนดแบบ
Reverse Domain Name เชน
com.khaooat.helloprogramsdd
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
11
AndroidApp
4. คลิก Next
5. คลิก Next
6. คลิกเครื่องหมายถูกที่ Create Activity
7. คลิก Blank Activity
8. คลิก Next
9. คลิก Finish
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
12
AndroidApp
10. จะปรากฏหนาตางสําหรับสราง Application
11. ไปที่ Windows Android Virtual Device Manager
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
13
AndroidApp
12. จะปรากฏหนาตาง Android
Virtual Device (AVD)
Manager ใหคลิก Create
13. จะปรากฏหนาตาง Create new
Android Virtual Device (AVD)
ใหกําหนดคาดังนี้
AVD Name ตั้งชื่ออุปกรณ
Device เลือกอุปกรณหรือ
ขนาดหนาจอที่ตองการ
Target กําหนด Android Version ที่ตองการ แนะนํา Android 4.4.2
CPU/ABI กําหนดเปน ARM (armeabi-v7a)
Skin กําหนดเปน Skin with dynamic hardware controls
14. คลิก OK
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
14
AndroidApp
15. จะปรากฏ Device ที่สรางขึ้น ใหคลิกที่ Device
16. คลิก Start
17. คลิก Launch
18. รอ 3 – 5 นาที
ปรากฏหนา
Lock Screen
19. แตะที่รูปกุญแจ
เพื่อทําการปลด
ล็อคหนาจอ
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
15
AndroidApp
20. จะเขาสูหนา
Home ใหคลิก
เขาสูหนา Menu
21. ปดหนาตาง
Emulator
22. ปดหนาตาง
Android
Virtual Device
23. คลิกขวาที่โปรเจค เลือกคําสั่ง Run As Android Application
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
16
AndroidApp
24. หลังจากเขาสูหนา Menu ใหคลิกที่ชื่อ Application ที่สรางขึ้น
25. จะปรากฏ Application โดยแสดงชื่อและขอความ Hello world! ใหทําการปดหนาตาง
Emulator
Note
หากไมสามารถเปดโปรแกรม Java – Eclipse ได ใหทําการติดตั้ง JDK กอน
หากไมสามารถ Create Android Virtual Device (AVD) ได ใหเขาไปติดตั้งเครื่องมือ และ
Android Version เพิ่มเติมที่ Android SDK Manager โดยติดตั้งเวอรชั่นลาสุดและเวอรชั่นที่
ตองการใชงาน
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
17
AndroidApp
¡¡ÒÃμÔ´μÑé§áÅÐ㪌§Ò¹ PPhoneGap
1. แตกไฟล PhoneGap โดยคลิกขวาที่ PhoneGap 2.2 แลวคลิก Extract Here
2. เขาไปที่โฟลเดอร
Phonegap 2.2 lib
android จะพบโฟลเดอร
xml
3. ทําการคัดลอกโฟลเดอร
xml โดยการคลิกขวาแลว
เลือกคําสั่ง Copy
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
18
AndroidApp
4. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร res แลวคลิกขวาเลือกคําสั่ง Paste
5. คัดลอก cordova-2.2.0.jar โดยการคลิกขวาแลวเลือกคําสั่ง Copy
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
19
AndroidApp
6. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร libs แลวคลิกขวาเลือกคําสั่ง Paste
7. คัดลอก cordova-2.2.0.js โดยการคลิกขวาแลวเลือกคําสั่ง Copy
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
20
AndroidApp
8. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร assets แลวคลิกขวาเลือกคําสั่ง New Folder
9. ในชอง Folder name ใหกําหนดชื่อ
โฟลเดอรเปน www
10. คลิก Finish
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
21
AndroidApp
11. ไปที่โฟลเดอร www แลวคลิกขวาเลือกคําสั่ง Paste
12. ไปที่โฟลเดอร src com.example.example แลวดับเบิลคลิกที่ไฟล MainActivity.java
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
22
AndroidApp
13. ไปที่บรรทัด public class MainActivity extends ใหทําการลบ ActionBarActivity ออก
14. พิมพ droi
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
23
AndroidApp
15. กด Ctrl + Spacebar ที่คียบอรด จะปรากฏ DroidGap โดยอัตโนมัติ
16. ไปที่บรรทัด import org.apache.cordova.DroidGap ใหลบคําวา DroidGap ออก
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
24
AndroidApp
17. แกเปน * (ดอกจัน) จะได import org.apache.cordova. *;
18. ลบ protected ออก
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
25
AndroidApp
19. เปลี่ยนจาก protected เปน public
20. ลบบรรทัด setContentView (R.layout.activity_main); ออก
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
26
AndroidApp
21. พิมพ Code เพื่อเรียก HTML โดยตัวอักษรเล็กใหญตองตรงตามนี้
Super.loadUrl(“file:///android_asset/www/index.html);
22. ไปที่ File Save เพื่อบันทึกไฟล MainActivity
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
27
AndroidApp
23. ไปคัดลอกไฟลที่ Publish เปน HTML5 จากโปรแกรม Adobe Captivate โดยคัดลอกไฟล
และโฟลเดอรทั้งหมดที่ Publish
24. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร assets www
25. คลิกขวาที่โฟลเดอร www แลวเลือกคําสั่ง Paste
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
28
AndroidApp
26. คลิกขวาที่โปรเจค Run As Android Application
27. จะปรากฏหนาตาง Emulation ใหรอประมาณ 4 – 5 นาที จะปรากฏหนา Lock Screen
28. ทําการปลดล็อคหนาจอ จะปรากฏหนา Home ใหคลิกขาสูหนา Application
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
29
AndroidApp
29. จะปรากฏ Application ตามชื่อที่เรากําหนดไวตอนเริ่มตนสรางโปรเจค
30. คลิกที่ Application ที่เราสรางขึ้น จะปรากฏ Application
¡¡ÒÃÊÊÌҧ IIcon Apppllication
1. ออกแบบไอคอนตามตองการ โดย
ใชโปรแกรม Adobe Photoshop
โดยเปดไฟลที่ขนาด 512 x 512
Pixels และ Resolution 72
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
30
AndroidApp
2. บันทึกรูปภาพเปนขนาดตางๆ เปน 512 x 512, 144 x 144, 96 x 96, 72 x 72, 48 x 48
และตั้งชื่อไฟลตามลําดับ ดังนี้
ic_launcher-web
ic_launcher-144
ic_launcher-96
ic_launcher-72
ic_launcher-48
3. คัดลอกไฟล ic_launcher-web โดยการคลิกขวาแลวเลือกคําสั่ง Copy
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
31
AndroidApp
4. กลับไปที่โปรแกรม Eclipse แลวคลิกขวาที่โปรเจคแลวเลือกคําสั่ง Paste
5. คลิก Yes To All
6. คัดลอกไฟล ic_launcher-144 โดยการคลิกขวาแลวเลือกคําสั่ง Copy
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
32
AndroidApp
7. กลับไปที่โปรแกรม Eclipse แลวเขาไปที่โฟลเดอร res drawable-xxhdpi
8. คลิกขวาที่โฟลเดอร drawable-xxhdpi แลวเลือกคําสั่ง Paste
9. คลิกขวาที่ ic_launcher ซึ่งเดิมมีอยูแลว แลวคลิก Delete
10. คลิก OK
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
33
AndroidApp
11. คลิกขวาที่ไฟล ic_launcher-144 แลวเลือกคําสั่ง Refactor Rename
12. ในชอง New name ใหกําหนดชื่อเปน ic_launcher.png
13. คลิก OK
14. คลิก Continue
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
34
AndroidApp
15. สําหรับ ic_launcher ที่เหลือใหนําไปไวที่โฟลเดอรตางๆ ดังนี้
ic_launcher-96 ไวในโฟลเดอร drawable-xhdpi
ic_launcher-72 ไวในโฟลเดอร drawable-hdpi
ic_launcher-48 ไวในโฟลเดอร drawable-mhdpi
16. ลบ ic_launcher เดิมมีอยูแลวใน
โฟลเดอร drawable-xhdpi,
drawable-hdpi และ drawable-
mhdpi
17. ทําการ Rename ในสวนของไฟล
ic_launcher-96, ic_launcher-
72 และ ic_launcher-48 ที่อยูใน
โฟลเดอรตางๆ เปน ic_launcher
18. คลิกขวาที่โปรเจค Run As Android Application
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
35
AndroidApp
19. จะปรากฏหนาตาง Emulation ใหรอประมาณ 4 – 5 นาที จะปรากฏหนา Lock Screen
20. ทําการปลดล็อคหนาจอ จะปรากฏหนา Home ใหคลิกขาสูหนา Application
21. จะปรากฏไอคอน Application และชื่อที่เรากําหนดไวตอนเริ่มตนสรางโปรเจค
22. คลิกที่ Application ที่เราสรางขึ้น จะปรากฏ Application
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
36
AndroidApp
NNOTE
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
37
AndroidApp
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
สราง Android Application จาก HTML5 ดวย PhoneGap
38
AndroidApp
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
__________________________________________________________________________
กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย
39
AndroidApp
μμÔ´μÒÁ¢ŒÍÁÙÅ¢‹ÒÇÊÒÃ
http://khaooat.com/
http://programsdd.com/
https://www.facebook.com/ProgramsDD
http://khaooat.com/icourse/
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995

Contenu connexe

Tendances

การสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforia
การสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforiaการสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforia
การสร้างสื่อ AR Augmented Reality ด้วย Unity + VuforiaDr.Kridsanapong Lertbumroongchai
 
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventor
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventorคู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventor
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App InventorSomchart Phaeumnart
 
Powerpoint บทที่ 1
Powerpoint บทที่ 1Powerpoint บทที่ 1
Powerpoint บทที่ 1patchareepoim
 
เอกสารประกอบการอบรม Adroidpdf
เอกสารประกอบการอบรม Adroidpdfเอกสารประกอบการอบรม Adroidpdf
เอกสารประกอบการอบรม AdroidpdfWeerachat Martluplao
 
Workshop of mobile application development and design android
Workshop of mobile application development and design androidWorkshop of mobile application development and design android
Workshop of mobile application development and design androidWorawith Sangkatip
 
ส่งงาน Microsoft Visual Basic 6.0
ส่งงาน Microsoft Visual Basic 6.0ส่งงาน Microsoft Visual Basic 6.0
ส่งงาน Microsoft Visual Basic 6.0Bass Bass
 
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint potใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint potNattapon
 
การใช้งานโปรแกรม android studio
การใช้งานโปรแกรม android studioการใช้งานโปรแกรม android studio
การใช้งานโปรแกรม android studioWorawith Sangkatip
 
คู่มือการใช้งาน Mac book-pro
คู่มือการใช้งาน Mac book-proคู่มือการใช้งาน Mac book-pro
คู่มือการใช้งาน Mac book-proSomkid Rablee
 
Powerpoint บทที่ 2
Powerpoint บทที่ 2Powerpoint บทที่ 2
Powerpoint บทที่ 2patchareepoim
 

Tendances (14)

การสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforia
การสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforiaการสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforia
การสร้างสื่อ AR Augmented Reality ด้วย Unity + Vuforia
 
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventor
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventorคู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventor
คู่มือการอบรมครู การพัฒนาสื่อการเรียนการสอน ด้วย MIT App Inventor
 
Powerpoint บทที่ 1
Powerpoint บทที่ 1Powerpoint บทที่ 1
Powerpoint บทที่ 1
 
เอกสารประกอบการอบรม Adroidpdf
เอกสารประกอบการอบรม Adroidpdfเอกสารประกอบการอบรม Adroidpdf
เอกสารประกอบการอบรม Adroidpdf
 
Cstructure
CstructureCstructure
Cstructure
 
Workshop of mobile application development and design android
Workshop of mobile application development and design androidWorkshop of mobile application development and design android
Workshop of mobile application development and design android
 
ส่งงาน Microsoft Visual Basic 6.0
ส่งงาน Microsoft Visual Basic 6.0ส่งงาน Microsoft Visual Basic 6.0
ส่งงาน Microsoft Visual Basic 6.0
 
สอนออนไลน์ด้วย OBS Studio
สอนออนไลน์ด้วย OBS Studioสอนออนไลน์ด้วย OBS Studio
สอนออนไลน์ด้วย OBS Studio
 
ใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint potใบความรู้ที่ 7 application paint pot
ใบความรู้ที่ 7 application paint pot
 
Google App Engine Using Eclipse
Google App Engine Using EclipseGoogle App Engine Using Eclipse
Google App Engine Using Eclipse
 
การใช้งานโปรแกรม android studio
การใช้งานโปรแกรม android studioการใช้งานโปรแกรม android studio
การใช้งานโปรแกรม android studio
 
คู่มือการใช้งาน Mac book-pro
คู่มือการใช้งาน Mac book-proคู่มือการใช้งาน Mac book-pro
คู่มือการใช้งาน Mac book-pro
 
Powerpoint บทที่ 2
Powerpoint บทที่ 2Powerpoint บทที่ 2
Powerpoint บทที่ 2
 
ยินดีนำเสนอ
ยินดีนำเสนอยินดีนำเสนอ
ยินดีนำเสนอ
 

En vedette

โครงงาน การสร้างสื่อ E-book เรือง ระบบปฏิบัติการแอนดรอยด์ (Android)
โครงงาน การสร้างสื่อ E-book  เรือง ระบบปฏิบัติการแอนดรอยด์ (Android) โครงงาน การสร้างสื่อ E-book  เรือง ระบบปฏิบัติการแอนดรอยด์ (Android)
โครงงาน การสร้างสื่อ E-book เรือง ระบบปฏิบัติการแอนดรอยด์ (Android) tata17329
 
การคิดโปรเจค โปรแกรมบนมือถือ
การคิดโปรเจค โปรแกรมบนมือถือการคิดโปรเจค โปรแกรมบนมือถือ
การคิดโปรเจค โปรแกรมบนมือถือrubtumproject.com
 
โครงงาน แอนดรอยด์
โครงงาน แอนดรอยด์โครงงาน แอนดรอยด์
โครงงาน แอนดรอยด์teerarat55
 
เขียนเว็บไซต์ด้วย Html 5
เขียนเว็บไซต์ด้วย Html 5เขียนเว็บไซต์ด้วย Html 5
เขียนเว็บไซต์ด้วย Html 5Samart Phetdee
 
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละ
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละแนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละ
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละWithoon Wangsa-Nguankit
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานAjBenny Pong
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานAjBenny Pong
 
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์JK133
 
การสร้าง แบบทดสอบ App for android
การสร้าง แบบทดสอบ  App for androidการสร้าง แบบทดสอบ  App for android
การสร้าง แบบทดสอบ App for androidพัน พัน
 
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศ และภูมิสารสนเทศ ด้านการให้บริการข้อมูล ภูมิ...
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศและภูมิสารสนเทศ ด้านการให้บริการข้อมูลภูมิ...บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศและภูมิสารสนเทศ ด้านการให้บริการข้อมูลภูมิ...
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศ และภูมิสารสนเทศ ด้านการให้บริการข้อมูล ภูมิ...Chingchai Humhong
 
นำเสนอครั้งที่ 1-60258
นำเสนอครั้งที่ 1-60258นำเสนอครั้งที่ 1-60258
นำเสนอครั้งที่ 1-60258Ampol Sonwises
 
บทที่ 1 วิจัย
บทที่ 1 วิจัยบทที่ 1 วิจัย
บทที่ 1 วิจัยNatmol Thedsanabun
 
Introduction to Database
Introduction to DatabaseIntroduction to Database
Introduction to DatabaseOpas Kaewtai
 
ICT 2020 Conceptual framwork
ICT 2020 Conceptual framworkICT 2020 Conceptual framwork
ICT 2020 Conceptual framworkBunsasi
 

En vedette (20)

โครงงาน การสร้างสื่อ E-book เรือง ระบบปฏิบัติการแอนดรอยด์ (Android)
โครงงาน การสร้างสื่อ E-book  เรือง ระบบปฏิบัติการแอนดรอยด์ (Android) โครงงาน การสร้างสื่อ E-book  เรือง ระบบปฏิบัติการแอนดรอยด์ (Android)
โครงงาน การสร้างสื่อ E-book เรือง ระบบปฏิบัติการแอนดรอยด์ (Android)
 
การคิดโปรเจค โปรแกรมบนมือถือ
การคิดโปรเจค โปรแกรมบนมือถือการคิดโปรเจค โปรแกรมบนมือถือ
การคิดโปรเจค โปรแกรมบนมือถือ
 
โครงงาน แอนดรอยด์
โครงงาน แอนดรอยด์โครงงาน แอนดรอยด์
โครงงาน แอนดรอยด์
 
Responsive Learning : Adobe Captivate 8
Responsive Learning : Adobe Captivate 8Responsive Learning : Adobe Captivate 8
Responsive Learning : Adobe Captivate 8
 
เขียนเว็บไซต์ด้วย Html 5
เขียนเว็บไซต์ด้วย Html 5เขียนเว็บไซต์ด้วย Html 5
เขียนเว็บไซต์ด้วย Html 5
 
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละ
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละแนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละ
แนะนำ HTML5 แบบอ่านจบต้องรู้บ้างแหละ
 
รูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงานรูปเล่มวิชาโครงงาน
รูปเล่มวิชาโครงงาน
 
ผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงานผลงานนักศึกษาวิชาโครงงาน
ผลงานนักศึกษาวิชาโครงงาน
 
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์
การแข่งขันการออกแบบสิ่งของเครื่องใช้ด้วยโปรแกรมคอมพิวเตอร์
 
การสร้าง แบบทดสอบ App for android
การสร้าง แบบทดสอบ  App for androidการสร้าง แบบทดสอบ  App for android
การสร้าง แบบทดสอบ App for android
 
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศ และภูมิสารสนเทศ ด้านการให้บริการข้อมูล ภูมิ...
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศและภูมิสารสนเทศ ด้านการให้บริการข้อมูลภูมิ...บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศและภูมิสารสนเทศ ด้านการให้บริการข้อมูลภูมิ...
บทบาทของสถานภูมิภาคเทคโนโลยีอวกาศ และภูมิสารสนเทศ ด้านการให้บริการข้อมูล ภูมิ...
 
นำเสนอครั้งที่ 1-60258
นำเสนอครั้งที่ 1-60258นำเสนอครั้งที่ 1-60258
นำเสนอครั้งที่ 1-60258
 
บทที่ 1 วิจัย
บทที่ 1 วิจัยบทที่ 1 วิจัย
บทที่ 1 วิจัย
 
Example of gis&rs applications
Example of gis&rs applicationsExample of gis&rs applications
Example of gis&rs applications
 
Educational Technology at NSTDA
Educational Technology at NSTDAEducational Technology at NSTDA
Educational Technology at NSTDA
 
Introduction to Database
Introduction to DatabaseIntroduction to Database
Introduction to Database
 
1109291212453896 12111614140548
1109291212453896 121116141405481109291212453896 12111614140548
1109291212453896 12111614140548
 
Interactive e leraning_ctu
Interactive e leraning_ctuInteractive e leraning_ctu
Interactive e leraning_ctu
 
ICT 2020 Conceptual framwork
ICT 2020 Conceptual framworkICT 2020 Conceptual framwork
ICT 2020 Conceptual framwork
 
Android room award 2556
Android room award 2556Android room award 2556
Android room award 2556
 

Similaire à การสร้าง Android Application จาก HTML5 ด้วย PhoneGap

ใบความรู้ที่ 11
ใบความรู้ที่ 11ใบความรู้ที่ 11
ใบความรู้ที่ 11chaiwat vichianchai
 
๋Java Web Programming on Cloud Computing using Google App Engine
๋Java Web Programming on Cloud Computing using Google App Engine๋Java Web Programming on Cloud Computing using Google App Engine
๋Java Web Programming on Cloud Computing using Google App EngineIMC Institute
 
การเขียนโปรแกรมโดยใช้ Netbeans
การเขียนโปรแกรมโดยใช้ Netbeansการเขียนโปรแกรมโดยใช้ Netbeans
การเขียนโปรแกรมโดยใช้ NetbeansWasin Kunnaphan
 
บทที่ 5 การออกแบบผลิตภัณฑ์
บทที่ 5 การออกแบบผลิตภัณฑ์บทที่ 5 การออกแบบผลิตภัณฑ์
บทที่ 5 การออกแบบผลิตภัณฑ์Dr.Krisada [Hua] RMUTT
 
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]Thossaphol Noratus
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์Kiattipong Sriwichai
 
การเขียนโปรแกรมด้วย Net beans
การเขียนโปรแกรมด้วย Net beansการเขียนโปรแกรมด้วย Net beans
การเขียนโปรแกรมด้วย Net beansApisit Song
 
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i os
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i osคู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i os
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i osNisachol Poljorhor
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8Mind Kyn
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8Fin Sawitree
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8Mind Kyn
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8Mind Kyn
 

Similaire à การสร้าง Android Application จาก HTML5 ด้วย PhoneGap (20)

Manual
ManualManual
Manual
 
ระบบปฏิบัติการIos9
ระบบปฏิบัติการIos9ระบบปฏิบัติการIos9
ระบบปฏิบัติการIos9
 
Joomla CMS
Joomla CMSJoomla CMS
Joomla CMS
 
13510163
1351016313510163
13510163
 
ใบความรู้ที่ 11
ใบความรู้ที่ 11ใบความรู้ที่ 11
ใบความรู้ที่ 11
 
๋Java Web Programming on Cloud Computing using Google App Engine
๋Java Web Programming on Cloud Computing using Google App Engine๋Java Web Programming on Cloud Computing using Google App Engine
๋Java Web Programming on Cloud Computing using Google App Engine
 
การเขียนโปรแกรมโดยใช้ Netbeans
การเขียนโปรแกรมโดยใช้ Netbeansการเขียนโปรแกรมโดยใช้ Netbeans
การเขียนโปรแกรมโดยใช้ Netbeans
 
650 1
650 1650 1
650 1
 
บทที่ 5 การออกแบบผลิตภัณฑ์
บทที่ 5 การออกแบบผลิตภัณฑ์บทที่ 5 การออกแบบผลิตภัณฑ์
บทที่ 5 การออกแบบผลิตภัณฑ์
 
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]
Thossaphol o oo_migration_success_rmutto5_16_may_2012 [compatibility mode]
 
โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์โครงงานคอมพิวเตอร์
โครงงานคอมพิวเตอร์
 
การเขียนโปรแกรมด้วย Net beans
การเขียนโปรแกรมด้วย Net beansการเขียนโปรแกรมด้วย Net beans
การเขียนโปรแกรมด้วย Net beans
 
ม.6 05 แผนการจัดการเรียนรู้ที่ 18 23
ม.6  05 แผนการจัดการเรียนรู้ที่ 18 23ม.6  05 แผนการจัดการเรียนรู้ที่ 18 23
ม.6 05 แผนการจัดการเรียนรู้ที่ 18 23
 
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i os
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i osคู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i os
คู่มือการใช้งานโปรแกรมพัฒนา Application สำหรับระบบปฏิบัติการ i os
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8
 
ใบงานที่8
ใบงานที่8ใบงานที่8
ใบงานที่8
 
Web dav android
Web dav androidWeb dav android
Web dav android
 
Web dav android (1)
Web dav android (1)Web dav android (1)
Web dav android (1)
 

Plus de Dr.Kridsanapong Lertbumroongchai

ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...
ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...
ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...Dr.Kridsanapong Lertbumroongchai
 
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์Dr.Kridsanapong Lertbumroongchai
 
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...Dr.Kridsanapong Lertbumroongchai
 
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...Dr.Kridsanapong Lertbumroongchai
 
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)Dr.Kridsanapong Lertbumroongchai
 
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)Dr.Kridsanapong Lertbumroongchai
 
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริง
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริงAR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริง
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริงDr.Kridsanapong Lertbumroongchai
 
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)Dr.Kridsanapong Lertbumroongchai
 
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)Dr.Kridsanapong Lertbumroongchai
 
การจัดวางตัวอักษร (Typography)
การจัดวางตัวอักษร (Typography)การจัดวางตัวอักษร (Typography)
การจัดวางตัวอักษร (Typography)Dr.Kridsanapong Lertbumroongchai
 
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)Dr.Kridsanapong Lertbumroongchai
 
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...Dr.Kridsanapong Lertbumroongchai
 
การสร้างสื่อภาพกราฟิกเคลื่อนไหว (Motion Graphic)
การสร้างสื่อภาพกราฟิกเคลื่อนไหว  (Motion Graphic)การสร้างสื่อภาพกราฟิกเคลื่อนไหว  (Motion Graphic)
การสร้างสื่อภาพกราฟิกเคลื่อนไหว (Motion Graphic)Dr.Kridsanapong Lertbumroongchai
 
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)Dr.Kridsanapong Lertbumroongchai
 
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)Dr.Kridsanapong Lertbumroongchai
 
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...Dr.Kridsanapong Lertbumroongchai
 
อัตลักษณ์องค์กร (Corporate Identity: C.I.)
อัตลักษณ์องค์กร (Corporate Identity: C.I.)อัตลักษณ์องค์กร (Corporate Identity: C.I.)
อัตลักษณ์องค์กร (Corporate Identity: C.I.)Dr.Kridsanapong Lertbumroongchai
 
AR VR Metaverse ทางการแพทย์และพยาบาล
AR VR Metaverse ทางการแพทย์และพยาบาลAR VR Metaverse ทางการแพทย์และพยาบาล
AR VR Metaverse ทางการแพทย์และพยาบาลDr.Kridsanapong Lertbumroongchai
 
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinoti
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinotiสร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinoti
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย VidinotiDr.Kridsanapong Lertbumroongchai
 
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)Dr.Kridsanapong Lertbumroongchai
 

Plus de Dr.Kridsanapong Lertbumroongchai (20)

ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...
ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...
ทักษะดิจิทัลสำหรับการปฏิบัติงานในยุคดิจิทัล (Digital Skills for Working in Th...
 
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับการท่องเที่ยว โรงแรม และอีเวนต์
 
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...
เทคนิคการสร้างสื่อเพื่อการปฏิบัติงานในยุคดิจิทัล (Creating Techniques Media f...
 
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...
การทำการตลาดบนมือถือสำหรับธุรกิจจัดจำหน่ายสินค้า (Mobile Marketing for Produc...
 
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)
การทำการตลาดบนมือถือสำหรับธุรกิจบริการ (Mobile Marketing for Service Business)
 
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)
การตลาดผ่านเครื่องมือค้นหา (Search Engine Marketing)
 
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริง
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริงAR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริง
AR / VR / MR / XR มุ่งสู่อนาคตการท่องเที่ยวที่เหนือจริง
 
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)
สีกับการออกแบบส่วนประสานงานกับผู้ใช้ (Color with User Interface Design)
 
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)
การออกแบบกราฟิกส่วนประสานงานกับผู้ใช้ (Graphical User Interface)
 
การจัดวางตัวอักษร (Typography)
การจัดวางตัวอักษร (Typography)การจัดวางตัวอักษร (Typography)
การจัดวางตัวอักษร (Typography)
 
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)
เทคนิคการจัดการเรียนรู้ด้วยเกมมิฟิเคชั่น (Gamification)
 
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...
เทคนิคการสร้างสื่อการเรียนรู้ในยุคดิจิทัล (Learning Media Technique in Digita...
 
การสร้างสื่อภาพกราฟิกเคลื่อนไหว (Motion Graphic)
การสร้างสื่อภาพกราฟิกเคลื่อนไหว  (Motion Graphic)การสร้างสื่อภาพกราฟิกเคลื่อนไหว  (Motion Graphic)
การสร้างสื่อภาพกราฟิกเคลื่อนไหว (Motion Graphic)
 
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)
เสียงสำหรับงานมัลติมีเดีย (Sound for Multimedia)
 
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)
การตลาดไมซ์ที่รู้ใจและเข้าถึงการตลาดดิจิทัล (MICE Digital Marketing)
 
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...
เทคโนโลยีเสมือนจริงและจักรวาลนฤมิตสำหรับงานไมซ์ (Virtual Reality and Metavers...
 
อัตลักษณ์องค์กร (Corporate Identity: C.I.)
อัตลักษณ์องค์กร (Corporate Identity: C.I.)อัตลักษณ์องค์กร (Corporate Identity: C.I.)
อัตลักษณ์องค์กร (Corporate Identity: C.I.)
 
AR VR Metaverse ทางการแพทย์และพยาบาล
AR VR Metaverse ทางการแพทย์และพยาบาลAR VR Metaverse ทางการแพทย์และพยาบาล
AR VR Metaverse ทางการแพทย์และพยาบาล
 
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinoti
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinotiสร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinoti
สร้างสื่อ Augmented Reality ง่ายๆ ด้วย Vidinoti
 
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)
การเล่าเรื่องสินค้าผ่านภาพถ่าย (Digital Storytelling in Photography)
 

การสร้าง Android Application จาก HTML5 ด้วย PhoneGap

  • 1. ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 2. AndroidApp μμÔ´μÒÁ¢ŒÍÁÙÅ¢‹ÒÇÊÒà http://khaooat.com/ http://programsdd.com/ https://www.facebook.com/ProgramsDD http://khaooat.com/icourse/ AndroidApp ÊÊÒúÑÞ รูจัก PhoneGap 1 การตรวจสอบ System Type ของ Windows 3 การติดตั้ง Java 3 การติดตั้ง Eclipse 6 เริ่มตนการสราง Android Application 10 การติดตั้งและใชงาน PhoneGap 17 การสราง Icon Application 29 ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 3. AndroidApp กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 1 AndroidApp ÃÃÙŒ¨Ñ¡ PPhoneGap PPhoneGap ¤×ÍÍÐäà PhoneGap คือ เครื่องมือสําหรับพัฒนา Mobile Application ที่ชวยใหพัฒนา Application บนสมารทโฟนไดงายโดยใช HTML5, Javascript หรือ CSS เพียงเราสามารถสรางเว็บไซตไดก็สามารถ สรางแอพพลิเคชั่นได และยังสามารถทํางานขาม Platform ได เชน iOS, Android, Windows Phone, BlackBerry, Symbian, webOS, และ bada ¡Ò÷íÒ§Ò¹¢Í§ PhoneGap PhoneGap จะหอหุม (Wrap) สิ่งที่เราสรางขึ้นจาก HTML5, Javascript หรือ CSS ใหเปน Application ที่สามารถทํางานไดในระบบปฏิบัติการตางๆ ของสมารทโฟน โดยPhoneGap มีรูปแบบ การทํางาน 2 ลักษณะ ไดแก PhoneGap Build เปนการสราง Application บนเว็บ build.phonegap.com เพียงสมัคร AdobeID ก็สามารถหอหุม HTML5, Javascript หรือ CSS เปน .zip แลวอัพโหลดเพื่อ Build เปน Application บน Platform ตางๆ ไดทันที แตจะมีขอจํากัดดานขนาดและ จํานวนของ Application หากตองการขนาดและจํานวนเพิ่มตองเสียเงิน ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 4. สราง Android Application จาก HTML5 ดวย PhoneGap 2 AndroidApp PhoneGap Developer เปนการสราง Application โดยใชโปรแกรม Eclipse สามารถทํา ไดโดยเขาไปดาวนโหลดเครื่องมือไดที่ phonegap.com แตจะมีความยุงยากกวา PhoneGap Build เนื่องจากจะตองติดตั้งโปรแกรมหลายชนิด และมีการเขียนโคด ซึ่งขอดีก็ คือฟรี และสามารถสราง Application ไดไมจํากัดขนาดและจํานวน กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 3 AndroidApp ¡¡ÒÃμÃǨÊͺ SSystem Type ¢¢Í§ WWindows กอนที่จะติดตั้งเครื่องมือใดๆ ลงในคอมพิวเตอร จะตองตรวจสอบ System Type ของ Windows กอนวาเปน 32 หรือ 64 บิต โดยคลิกที่ This PC Properties จากรูปเปน Windows 8.1 Pro ที่มี System Type เปน 64 บิต ดังนั้นการติดตั้งเครื่องมือที่ มีใหเลือกระหวาง 32 กับ 64 บิต ก็ใหเลือกใหตรงกับ System Type ¡¡ÒÃμÔ´μÑé§ JJava การสรางพัฒนา Application สําหรับแอนดรอยดจะพัฒนาภายใตการทํางานของ JAVA โดย โปรแกรมที่ใชในการพัฒนา Application ก็คือ Eclipse ซึ่งกอนที่จะติดตั้ง Eclipse จะตองทําการ ติดตั้ง JAVA กอน โดยมีขั้นตอนดังนี้ ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 5. สราง Android Application จาก HTML5 ดวย PhoneGap 4 AndroidApp 1. คลิกขวาที่ JDK 8 Update 40 แลวเลือก Extract Here 2. เขาไปที่โฟลเดอร JDK 8 Update 40 แลวดับเบิลคลิก JDK 8 Update 40 ตาม System Type 3. คลิก Next 4. คลิก Next กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 5 AndroidApp 5. รอสักครู 6. คลิก Next 7. รอสักครูขณะที่โปรแกรมกําลังติดตั้ง 8. คลิก Close ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 6. สราง Android Application จาก HTML5 ดวย PhoneGap 6 AndroidApp ¡¡ÒÃμÔ´μÑé§ EEclipse Eclipse เปนโปรแกรมสําหรับสราง Application สําหรับแอนดรอยด ซึ่งสามารถใชไดกับ Windows 7 / 8 / 8.1 มีใหเลือกทั้ง 32 และ 64 บิต ดังนั้นตองเลือกใชใหตรงกับ System Type ดวย โดยขั้นตอนการติดตั้งมีดังนี้ 1. คลิกขวาที่ ADT Bundle Windows แลวเลือกคําสั่ง Extract Here 2. เขาไปที่โฟลเดอร ADT Bundle Windows x64 eclipse 3. ดับเบิลคลิก eclipse เพื่อเขาสูโปรแกรม 4. รอสักครูจะปรากฏหนาตาง Workspace Launcher ใหคลิก Browse เพื่อเลือกที่เก็บไฟล 5. คลิก OK กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 7 AndroidApp 6. จะปรากฏหนาตาง Java - Eclipse 7. ไปที่ Windows Android SDK Manager ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 7. สราง Android Application จาก HTML5 ดวย PhoneGap 8 AndroidApp 8. จะปรากฏหนาตาง Android SDK Manager ใหทําการเลือก Tools และ Android Version ที่ตองการ โดยปกติโปรแกรมจะเลือกใหอัตโนมัติ (หากไมเลือกอัตโนมัติใหเลือก Android Version 5.1 และ 4.4) 9. คลิก Install Packages 10. คลิก Accept License สังเกตวา ดานซายมือจะตองขึ้นเครื่องหมาย ถูกทั้งหมด 11. คลิก Install กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 9 AndroidApp 12. Android SDK Manager กําลังดาวนโหลดเครื่องมือและ Android Version ที่เลือก ใน ขั้นตอนนี้จะใชเวลา 2 – 3 ชั่วโมง แนะนําใหเชื่อมตออินเทอรเน็ตความเร็วสูง 13. คลิก OK 14. คลิก Close 15. ปดโปรแกรม Java – Eclipse แลวเปดขึ้นมาใหม ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 8. สราง Android Application จาก HTML5 ดวย PhoneGap 10 AndroidApp ààÃÔèÁμŒ¹¡¡ÒÃÊÌҧ AAndroid AApplication 1. เปดโปรแกรม Java – Eclipse 2. ไปที่ New Android Application Project 3. กําหนดรายละเอียดดังนี้ Application Name กําหนดชื่อ แอพพลิเคชั่น Project Name กําหนดชื่อโปรเจค เหมือนกับชื่อแอพพลิเคชั่น Package Name กําหนดแบบ Reverse Domain Name เชน com.khaooat.helloprogramsdd กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 11 AndroidApp 4. คลิก Next 5. คลิก Next 6. คลิกเครื่องหมายถูกที่ Create Activity 7. คลิก Blank Activity 8. คลิก Next 9. คลิก Finish ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 9. สราง Android Application จาก HTML5 ดวย PhoneGap 12 AndroidApp 10. จะปรากฏหนาตางสําหรับสราง Application 11. ไปที่ Windows Android Virtual Device Manager กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 13 AndroidApp 12. จะปรากฏหนาตาง Android Virtual Device (AVD) Manager ใหคลิก Create 13. จะปรากฏหนาตาง Create new Android Virtual Device (AVD) ใหกําหนดคาดังนี้ AVD Name ตั้งชื่ออุปกรณ Device เลือกอุปกรณหรือ ขนาดหนาจอที่ตองการ Target กําหนด Android Version ที่ตองการ แนะนํา Android 4.4.2 CPU/ABI กําหนดเปน ARM (armeabi-v7a) Skin กําหนดเปน Skin with dynamic hardware controls 14. คลิก OK ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 10. สราง Android Application จาก HTML5 ดวย PhoneGap 14 AndroidApp 15. จะปรากฏ Device ที่สรางขึ้น ใหคลิกที่ Device 16. คลิก Start 17. คลิก Launch 18. รอ 3 – 5 นาที ปรากฏหนา Lock Screen 19. แตะที่รูปกุญแจ เพื่อทําการปลด ล็อคหนาจอ กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 15 AndroidApp 20. จะเขาสูหนา Home ใหคลิก เขาสูหนา Menu 21. ปดหนาตาง Emulator 22. ปดหนาตาง Android Virtual Device 23. คลิกขวาที่โปรเจค เลือกคําสั่ง Run As Android Application ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 11. สราง Android Application จาก HTML5 ดวย PhoneGap 16 AndroidApp 24. หลังจากเขาสูหนา Menu ใหคลิกที่ชื่อ Application ที่สรางขึ้น 25. จะปรากฏ Application โดยแสดงชื่อและขอความ Hello world! ใหทําการปดหนาตาง Emulator Note หากไมสามารถเปดโปรแกรม Java – Eclipse ได ใหทําการติดตั้ง JDK กอน หากไมสามารถ Create Android Virtual Device (AVD) ได ใหเขาไปติดตั้งเครื่องมือ และ Android Version เพิ่มเติมที่ Android SDK Manager โดยติดตั้งเวอรชั่นลาสุดและเวอรชั่นที่ ตองการใชงาน กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 17 AndroidApp ¡¡ÒÃμÔ´μÑé§áÅÐ㪌§Ò¹ PPhoneGap 1. แตกไฟล PhoneGap โดยคลิกขวาที่ PhoneGap 2.2 แลวคลิก Extract Here 2. เขาไปที่โฟลเดอร Phonegap 2.2 lib android จะพบโฟลเดอร xml 3. ทําการคัดลอกโฟลเดอร xml โดยการคลิกขวาแลว เลือกคําสั่ง Copy ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 12. สราง Android Application จาก HTML5 ดวย PhoneGap 18 AndroidApp 4. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร res แลวคลิกขวาเลือกคําสั่ง Paste 5. คัดลอก cordova-2.2.0.jar โดยการคลิกขวาแลวเลือกคําสั่ง Copy กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 19 AndroidApp 6. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร libs แลวคลิกขวาเลือกคําสั่ง Paste 7. คัดลอก cordova-2.2.0.js โดยการคลิกขวาแลวเลือกคําสั่ง Copy ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 13. สราง Android Application จาก HTML5 ดวย PhoneGap 20 AndroidApp 8. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร assets แลวคลิกขวาเลือกคําสั่ง New Folder 9. ในชอง Folder name ใหกําหนดชื่อ โฟลเดอรเปน www 10. คลิก Finish กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 21 AndroidApp 11. ไปที่โฟลเดอร www แลวคลิกขวาเลือกคําสั่ง Paste 12. ไปที่โฟลเดอร src com.example.example แลวดับเบิลคลิกที่ไฟล MainActivity.java ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 14. สราง Android Application จาก HTML5 ดวย PhoneGap 22 AndroidApp 13. ไปที่บรรทัด public class MainActivity extends ใหทําการลบ ActionBarActivity ออก 14. พิมพ droi กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 23 AndroidApp 15. กด Ctrl + Spacebar ที่คียบอรด จะปรากฏ DroidGap โดยอัตโนมัติ 16. ไปที่บรรทัด import org.apache.cordova.DroidGap ใหลบคําวา DroidGap ออก ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 15. สราง Android Application จาก HTML5 ดวย PhoneGap 24 AndroidApp 17. แกเปน * (ดอกจัน) จะได import org.apache.cordova. *; 18. ลบ protected ออก กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 25 AndroidApp 19. เปลี่ยนจาก protected เปน public 20. ลบบรรทัด setContentView (R.layout.activity_main); ออก ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 16. สราง Android Application จาก HTML5 ดวย PhoneGap 26 AndroidApp 21. พิมพ Code เพื่อเรียก HTML โดยตัวอักษรเล็กใหญตองตรงตามนี้ Super.loadUrl(“file:///android_asset/www/index.html); 22. ไปที่ File Save เพื่อบันทึกไฟล MainActivity กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 27 AndroidApp 23. ไปคัดลอกไฟลที่ Publish เปน HTML5 จากโปรแกรม Adobe Captivate โดยคัดลอกไฟล และโฟลเดอรทั้งหมดที่ Publish 24. กลับไปที่โปรแกรม Eclipse ใหไปที่โฟลเดอร assets www 25. คลิกขวาที่โฟลเดอร www แลวเลือกคําสั่ง Paste ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 17. สราง Android Application จาก HTML5 ดวย PhoneGap 28 AndroidApp 26. คลิกขวาที่โปรเจค Run As Android Application 27. จะปรากฏหนาตาง Emulation ใหรอประมาณ 4 – 5 นาที จะปรากฏหนา Lock Screen 28. ทําการปลดล็อคหนาจอ จะปรากฏหนา Home ใหคลิกขาสูหนา Application กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 29 AndroidApp 29. จะปรากฏ Application ตามชื่อที่เรากําหนดไวตอนเริ่มตนสรางโปรเจค 30. คลิกที่ Application ที่เราสรางขึ้น จะปรากฏ Application ¡¡ÒÃÊÊÌҧ IIcon Apppllication 1. ออกแบบไอคอนตามตองการ โดย ใชโปรแกรม Adobe Photoshop โดยเปดไฟลที่ขนาด 512 x 512 Pixels และ Resolution 72 ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 18. สราง Android Application จาก HTML5 ดวย PhoneGap 30 AndroidApp 2. บันทึกรูปภาพเปนขนาดตางๆ เปน 512 x 512, 144 x 144, 96 x 96, 72 x 72, 48 x 48 และตั้งชื่อไฟลตามลําดับ ดังนี้ ic_launcher-web ic_launcher-144 ic_launcher-96 ic_launcher-72 ic_launcher-48 3. คัดลอกไฟล ic_launcher-web โดยการคลิกขวาแลวเลือกคําสั่ง Copy กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 31 AndroidApp 4. กลับไปที่โปรแกรม Eclipse แลวคลิกขวาที่โปรเจคแลวเลือกคําสั่ง Paste 5. คลิก Yes To All 6. คัดลอกไฟล ic_launcher-144 โดยการคลิกขวาแลวเลือกคําสั่ง Copy ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 19. สราง Android Application จาก HTML5 ดวย PhoneGap 32 AndroidApp 7. กลับไปที่โปรแกรม Eclipse แลวเขาไปที่โฟลเดอร res drawable-xxhdpi 8. คลิกขวาที่โฟลเดอร drawable-xxhdpi แลวเลือกคําสั่ง Paste 9. คลิกขวาที่ ic_launcher ซึ่งเดิมมีอยูแลว แลวคลิก Delete 10. คลิก OK กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 33 AndroidApp 11. คลิกขวาที่ไฟล ic_launcher-144 แลวเลือกคําสั่ง Refactor Rename 12. ในชอง New name ใหกําหนดชื่อเปน ic_launcher.png 13. คลิก OK 14. คลิก Continue ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 20. สราง Android Application จาก HTML5 ดวย PhoneGap 34 AndroidApp 15. สําหรับ ic_launcher ที่เหลือใหนําไปไวที่โฟลเดอรตางๆ ดังนี้ ic_launcher-96 ไวในโฟลเดอร drawable-xhdpi ic_launcher-72 ไวในโฟลเดอร drawable-hdpi ic_launcher-48 ไวในโฟลเดอร drawable-mhdpi 16. ลบ ic_launcher เดิมมีอยูแลวใน โฟลเดอร drawable-xhdpi, drawable-hdpi และ drawable- mhdpi 17. ทําการ Rename ในสวนของไฟล ic_launcher-96, ic_launcher- 72 และ ic_launcher-48 ที่อยูใน โฟลเดอรตางๆ เปน ic_launcher 18. คลิกขวาที่โปรเจค Run As Android Application กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 35 AndroidApp 19. จะปรากฏหนาตาง Emulation ใหรอประมาณ 4 – 5 นาที จะปรากฏหนา Lock Screen 20. ทําการปลดล็อคหนาจอ จะปรากฏหนา Home ใหคลิกขาสูหนา Application 21. จะปรากฏไอคอน Application และชื่อที่เรากําหนดไวตอนเริ่มตนสรางโปรเจค 22. คลิกที่ Application ที่เราสรางขึ้น จะปรากฏ Application ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 21. สราง Android Application จาก HTML5 ดวย PhoneGap 36 AndroidApp NNOTE __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 37 AndroidApp __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 22. สราง Android Application จาก HTML5 ดวย PhoneGap 38 AndroidApp __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ __________________________________________________________________________ กฤษณพงศ เลิศบํารุงชัย ผูบรรยาย 39 AndroidApp μμÔ´μÒÁ¢ŒÍÁÙÅ¢‹ÒÇÊÒà http://khaooat.com/ http://programsdd.com/ https://www.facebook.com/ProgramsDD http://khaooat.com/icourse/ ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995
  • 23. ลิขสิทธิ์ของ iCourse และ khaooat.com ใช้เพื่อประกอบการอบรม ห้ามท้าซ้้า ดัดแปลง เผยแพร่ หรือใช้เชิงพานิชย์ ติดต่อวิทยากรได้ที่ khaooat.com หรือโทร. 095-116-6995