Phonegap book

50 %
50 %
Information about Phonegap book
Software

Published on June 25, 2014

Author: dekcomgang

Source: slideshare.net

Description

PhoneGap & Cordova book in Thai

PhoneGap Cordova& นัง ือ อนพื้นฐาน http://aorjor.blogspot.com Bhuridech Sudsee License

สารบัญ เรื่อง หนา Introduction 1 ­ Natiive application 1 ­ Mobile web application 2 ­ Hybridge application 2 Why we use PhoneGap? 4 How PhoneGap works? 5 Support APIs 6 Why HTML5? 7 Installation guide 8 ­ Java Development Kit(JDK) 9 ­ Software Development Kit(SDK) 15 ­ Node.js 19 ­ Cordova command­line interface 20 ­ PhoneGap command­line interface 21 ­ Ripple Emulator (PhoneGap Emulator) 22 ­ PhoneGap Developer Application 24 Basic knowledge 26 Plug­in 31 Documentation 31 Adobe® PhoneGap™ Build 32 Workshop : Pao­Ying­Chup 41 Deploy to Store 44 บรรณานุกรม 56

นา 1 Introduction : PhoneGap ถูก รางโดยบริ ัท Nitobi เมื่อป 2008 ภายในคาย iPhoneDevCamp โดย Brock Whitten และ Rob Ellis เพื่อที่จะ รางโปรเจกการทำงานแบบ cross­platform mobile developement แบบงายๆขึ้นมา[1] (cross­platform คือการไมขึ้นอยูกับระบบ เชนเขาเ ็บ Google ตอใ เปนระบบปฏิบัติการไ น Web browser ไ นก็มองเ ็นแบบเดีย กัน) ตอมาใน ันที่ 4 เดือนตุลาคมป 2011 Adobe ประกา ในงาน Adobe MAX 2011 าไดทำการเขาซื้อบริ ัท Nitobi เจาของ PhoneGap เรียบรอยแล [2] จากการ นับ นุนของ Adobe และ IBM ทาง Adobe จึงมอบ Source code ใ องคกร Apache Software Foundation (ASF) ดูแลเพื่อเปดเปน Opensource ที่มีชื่อ า “PhoneGap” แตเนื่องจากติดปญ าดานทรัพย ินทางปญญาและเครื่อง มายทางการคาจึงไดมีการเปลี่ยนชื่อเรียก เปน “Apache Callback” แตไดมีการเปลี่ยนชื่อใน ันที่ 28 พฤ จิกายน 2011 ดังนั้นตั้งแต Version 1.4 ก็ไดเปลี่ยนมาใชชื่อ “Apache Cordova” ในปจจุบันแทน จะเ ็น าทั้ง PhoneGap, Apache Callback และ Apache Cordova คือ ิ่งเดีย กันซึ่งเปน Open source framework ที่ใช ัญญา อนุญาตแบบ Apache License v2.0 ในการพัฒนา Mobile application จะทำผานภา าและ เครื่องมือที่เปนมาตรฐาน ำ รับเ ็บทั่ ไป โดยใช HyperText Markup Language (HTML), Cascading Style Sheets (CSS) และ JavaScript (JS) กลา คือ าก ามารถ ราง นาเ ็บไดก็ ามารถ ราง Mobile application ได และในทางกลับกัน าก ราง Mobile application ไดก็ ราง นาเ ็บไดเชนเดีย กันเพราะเทคโนโลยีที่ใชมีค ามใกลเคียงกันมาก โดยทั่ ไปการพัฒนา Mobile application นั้นจะมีประเภทของการพัฒนาแบงเปน 3 แบบใ ญๆ คือ 1. Native application คือการพัฒนา Mobile application ด ยการใชภา าพื้นฐาน ำ รับตั platform ที่รองรับ รือที่เรียก า device­specific languages เชน ใชภา า Android/Java NDK (Syntax คลายกับ Java มาก) ในการพัฒนา application ำ รับอุปกรณที่ ทำงานบนระบบปฏิบัติการ Android แตฝงของ Apple ใชภา า Objective­C ในการพัฒนา Application ำ รับระบบปฏิบัติการ iOS เปนตน จะเ ็นได า Native application คือการจำกัด ระบบในการพัฒนา าตอง รางจาก Platform ที่กำ นดไ ใ เทานั้น ซึ่งขอดีของ application เ ลา นี้คือ ามารถเขาถึง Application Programming Interface (API) ไดดีก า ปรับแตง Source code

นา 2 ไดมากก า ามารถทำงานไดแมไมไดตอกับอินเทอรเน็ต และการประม ลผลใชเ ลานอยก า ขอเ ีย คือยากตอการเรียนรูภา าที่เปน Native ของแตละระบบ และการปรับแตงใ ยงามก็ทำไดไมคอย ะด ก ากเทียบกับแบบอื่น[3] 2. Mobile web application คือการใชงานอุปกรณเคลื่อนที่ ในการเขาชมเ ็บไซตคลายการเขาเ ็บปกติ แตเ ็บไซตนั้นไดมี การเขียนมาเปนพิเ เพื่อรองรับกับขนาด นาจอและฟงกชัน การทำงานซึ่งเมื่อเราเปดเ ็บขึ้นมาจะมี นาตาคลายกับ Application ที่ถูกติดตั้งในเครื่อง และมีปุมตางๆที่ ะด กตอ การใชงานเ ็บไซต ขอดีของ Application ประเภทนี้คือไมไดติด ตั้งบนเครื่องเราจริงๆ จึงไมเปลืองเนื้อที่ใน น ยค ามจำของ เครื่อง ใชงานไดกับทุก Plaform โดยไมตองเปลี่ยน Source code ใ ม และใชงานไดเ มือนเปน Application บนเครื่อง จริง แตก็มีขอเ ียคือไม ามารถเขาถึง API ไดโดยตรงดังนั้นจึง ตองขอ Permission ในการใชงานผานทาง HTML5 และจำเปน ตองตออินเทอรเน็ตเมื่อตองการใชงาน และบาง API ก็ไม ามารถรองขอไดใชงานได เชน การขอจัดการ SMS 3. Hybridge application ร มเอาขอดีของ Native และ Mobile web application เขา ไ ด ยกันโดย Application ประเภทนี้จะถูกเขียนด ยภา าตั กลางคือภา า HTML ซึ่ง ามารถ

นา 3 ประกอบเขากับ JS เพื่อโปรแกรมการทำงาน Event ตางๆ และ CSS เพื่อปรับแตงใ ยงามไดงาย อีกทั้งยัง ามารถใชโคดชุดเดีย กันในการแปลงเปน Application ใน ลาย Platform ซึ่งไดเปรียบ Native application อยางมาก ลัก ณะการทำงานของ Application ประเภทนี้คลายกับการทำงาน ของ Mobile web application แต ามารถทำงานโดยไมตองเชื่อมตอกับอินเทอรเน็ต ามารถติดตั้ง ลงบนอุปกรณและ ามารถขายที่ Store ของแตละระบบไดนอกจากนี้ยัง ามารถเรียกใช API ในการ เขาถึงอุปกรณเชนกลอง ไมโครโฟน และฟเจอรตางๆไดโดยขอ Permission แคขั้นตอนการติดตั้ง Application แตก็มีขอเ ียคือโดยทั่ ไปแล ค ามเร็ จะนอยก า Native application แต ากจะ เทียบกับค าม ะด กในการพัฒนาแล ก็ถือ าคุมคา ากจะแลกกับค ามเร็ ที่เ ียไป[4] และถา าก ไมใช Application เกม รือประม ลผลกราฟฟกที่ตองใชการประม ลผล ูงก็ไมเ ็นค ามแตกแตงกัน มากนัก.

นา 4 Why we use PhoneGap? : ­ PhoneGap ามารถ ราง Mobile application โดยการใชงาน HTML/JS/CSS พื้นฐานการใชงานที่มาจาก HTML , JavaScript และ CSS นั้นเรียนรูไดงายและแมแต ในประเท ไทย ลายๆโรงเรียนมี ลัก ูตรการ อน รางเ ็บด ย HTML/JS/CSS ทำใ งายในการเรียน รูตอยอด แ ลงขอมูลก็ ามารถ าไดงายในอินเทอรเน็ต การจัด Layout และตกแตงด ย CSS ก็ไม ยากจนเกินไป และการเขียนโปรแกรมที่ลดการตั้งคาระบบของอุปกรณโดยตรงลง ทำใ จำกัดตั แปรที่ อาจจะกอใ เกิดค ามผิดพลาดไดดีขึ้น ­ PhoneGap ามารถ Deploy ไดบน ลาย Platform เนื่องจากเขียนผานตั กลางคือ PhoneGap framework ทำใ ามารถแปลงเปน Application ไดใน ลาย Platform โดยเราตองมี SDK ของ Native นั้นๆ กอนเชนตองลง SDK ของ Android กอน PhoneGap จึงจะ ั่งใ Build application เพื่อไปทำงานในอุปกรณที่ทำงานบน ระบบปฏิบัติการ Android ได (แคลงไ ก็พอเนื่องจากการ Compile บางไฟลยังจำเปนตองใชอยู) แต เพื่อแกปญ านี้ ากเราไม ามารถลง SDK ลายๆตั ไดก็มีบริการ Build ผานระบบ Cloud เชน Adobe® PhoneGap™ Build ­ PhoneGap ทำใ ไมจำเปนตองเรียนรูภา า Native ทุกภา า คงจะ ุน ายไมนอย ากเราตองเรียนรูทุกภา าเพื่อจะเขียน Application ที่ทำงาน แบบเดีย กันแถมยัง นาตาเ มือนกัน เพียงเพื่อใ ใชไดบน ลายอุปกรณเทานั้น มันจะดีก าไ มถา เรา ามารถเขียนครั้งเดีย เพื่อทำงานบน ลายๆอุปกรณได ­ PhoneGap ามารถใชงานไดกับ Framework HTML/CSS/JavaScript ไ นก็ได ปกติเรามักจะเขียน Application โดยใช Framework เพื่อช ยใ ะด กขึ้น PhoneGap ก็เชนกันมัน ามารถใชกับ Framework เดิมเชน BootStrap,jQuery รือ AnularJS ได

นา 5 How PhoneGap works? : การทำงานของ PhoneGap เปนการนำเอาไฟล HTML , JS และ CSS ที่เราไดมาจากการ เขียน Web application มา อ ุมด ย Web View ซึ่งเปนกลไกการทำงานของ Native application (จึงเปนเ ตุผลที่ าทำไมตองติดตั้ง SDK ลงไปด ย) ซึ่ง Web View มี นาที่แ ดงผล ขอมูลในลัก ณะของเ ็บ โดยเรียกใช Build­in web browser ที่ติดมากับระบบปฏิบัติการของ อุปกรณเคลื่อนที่ ากอธิบายงายๆ Hybridge application ก็ คือ Native application ที่มีแค Web View นั่นเอง แตก็จะ ามารถเขาถึง API เพื่อเรียกใชงานอุปกรณตางๆ ของเครื่องได ผานทาง PhoneGap API ดังนั้นจึงจะเ ็น าเรายังจำเปนตัองใช SDK ของแต Platform รือแตละระบบปฏิบัติการเพราะยัง ตองการการ Compile บางอยางใน นที่เปน Native application แตบางระบบปฏิบัติการเชน Bada, Symbian และ WebOS ที่มี Native application เปน Web application อยู แล จึงไมตองใชการ Compile เพื่อจะใ อ ุมด ย Native application Hybridge application จะคลายกับ Mobile web application ใน ิธีการพัฒนาในรูปแบบของเ ็บแต Hybridge application จะเก็บไฟลของเ ็บที่ถูกพัฒนาไ ใน น ยค ามจำ

นา 6 ภายในเครื่อง ดังนั้นจึงไมตองการการเชื่อมตออินเทอรเน็ตกอนเขา ใชงาน Application ทำใ ะด กมากขึ้น และขั้นตอนการพัฒนาที่ ามารถใช Web browser ในเครื่องคอมพิ เตอรของผูพัฒนาเพื่อ ทด อบบางอยางไดกอนก็ทำใ ามารถลดเ ลาพัฒนาลงได การเรียกใชโมดูลของอุปกรณใน PhoneGap นั้นเกิดจากขั้น ตอนแรกเมื่อเกิด Event ใน JavaScript ที่เราเขียนโปรแกรมไ ก็จะ มีการเรียกใช PhoneGap API ซึ่งเปน Interface กลางติดตอ ระ าง JavaScsript ที่เราเขียนกับ Native API ของภา าที่เปน ภา า Native ของอุปกรณ จากนั้น Native API จะไปเรียกใช Device OS ซึ่งเปนตั จัดการอุปกรณของระบบปฏิบัติการ และเมื่อ Decvice OS รับคำ ั่งแล จึงจะทำการเรียกใชงานโมดูลอุปกรณที่ เปนทางกายภาพจริงทำงาน เชน ากเปนการเรียกใชโมดูลกลองในอุปกรณ ก็จะมีลำดับการเรียกดังนี้ JS ­> PhoneGap API ­> Native API ­> Device OS ­> [Camera module] การทำใ ระบบตอง เรียกใชงาน ลายขั้นตอนนี้ก็เพื่อ ะด กในการพัฒนา และช ยลดโอกา ที่จะเกิดค ามผิดพลาดราย แรงในการเรียกใชงานอุปกรณจึงไมใ เรียกใชโดยตรง แตจะใ เรียกผาน API ที่ถูกจำกัดปจจัยเ ี่ยง ออกไปในระดับ นึ่งแล Support APIs : PhoneGap นับ นุน API พื้นฐานดังนี้ ­ Accelerometer เซนเซอร ัดค ามเรง ­ Camera โมดูลกลอง ­ Capture เก็บภาพ นาจอของอุปกรณเคลื่อนที่ ­ Compass เข็มทิ ­ Connection การเชื่อมตอ ­ Contacts รายชื่อผูติดตอ ­ File การจัดการไฟล ­ Geolocation ตำแ นงทางภูมิ า ตร

นา 7 ­ Media จัดการมัลติมีเดีย ­ Notification การแจงเตือน ­ Strorage จัดการเนื้อที่บน น ยค ามจำ การ นับ นุนที่กลา ไปดานบนอาจจะไมถูกรองรับเ มือนกันในทุกอุปกรณ (เชนอุปกรณบางรุนไมมี GPS ก็เรียกใชไมได) รือในทุกระบบปฏิบัติการดังนั้น ามารถ าขอมูลเพิ่มเติมไดที่ http://phonegap.com/about/feature/ และ าขอมูลโมดูลที่รองรับการใชงานในอุปกรณนั้นๆ Why HTML5? : แตเดิมในยุค Web 1.0 เปนยุคที่เ ็บเปน Statics web ขอมูลเปนการ ื่อ ารทางเดีย จากผูใ บริการเ ็บไซตและในตอน ลังไดมีการพัฒนาเ ็บไซตใ เขามา ูยุค Web 2.0 คือมีการโตตอบกัน ระ างผูใชด ยกันและกับผูดูแลเ ็บเชนมี Webboard นทนา มี Social network และมีการนำ Desktop application รือ application ที่ทำงานบนเครื่องปกติที่ตองติดตั้งกอนใชงานมาใ บริการ ผานเ ็บไซตซึ่งไมตองติดตั้งโปรแกรม เชน email แตเดิมใชโปรแกรมรับ ง แตปจจุบันก็ไดเพิ่มการใ บริการผานเ ็บโดยไมตองติดตั้งโปรแกรมกอน ขอมูลทั้งในยุคของ Web 1.0 และ Web 2.0 นั้นถูก เก็บอยูใน Server ที่ใ บริการ โดยเมื่อผูใชงานเ ็บเรียกใชเ ็บไซตขอมูลก็จะถูกตีค ามแล จึง งกลับ มาเพื่อแ ดงผล ในยุค Web 1.0 นั้น HTML เพียงพอที่จะใชในการนำเ นอขอมูลที่เปน Static web content เนื่องจากเปนการ ื่อ ารทางเดีย จากผูใ บริการเ ็บไซต และแมในยุค Web 2.0 เริ่มแรกนั้นเราก็ยัง ามารถใชงานภา าฝง Server (Server­side language) เชน PHP, ASP ร มด ยด ยเนื่องจาก ขอมูลไม ามารถเก็บในฝง Client เพราะค าม ามารถของภา าฝง Client (Client­side language) เชน HTML, JavaScript ทำใ มีค ามตองการเชื่อมตอกับอินเทอรเน็ต เพื่อเรียกใช Server อยูตลอด เ ลาทำใ Server และเครือขายของผูใ บริการที่มีทรัพยากรไ บริการจำกัดเกิดเ ตุการณ Server ลมได จึงไดมีการพัฒนากระบ นการเก็บขอมูลไ ในฝง Client เพื่อใ ลดการเชื่อมตอกับ Server และ ทำใ ามารถใชงานโดยไมตองเชื่อมตอกับอินเทอรเน็ตได จึงไดมีการพัฒนา Google Gears ขึ้นมาซึ่ง ภายใน Google Gears มี Client­side SQL database โดยใชฐานขอมูลที่มีชื่อ า SQLite ำ รับ เก็บขอมูลตางๆ ไ ที่เครื่องเรา และมี JavaScript API ใ เรียกใชงานผาน JavaScript ทำใ ไมจำเปน

นา 8 ตองตออินเทอรเน็ตตลอดเ ลา และยังเขาถึงขอมูลไดเร็ ก าเพราะฐานขอมูลอยูในเครื่องของเราเอง และใน ันที่ 19 กุมภาพันธ 2010 Google ก็ประกา เลิก นับ นุน Google Gears[5] และถูกถอด ออกจาก Google Chrome ตั้งแตรุน 12.0.742.91 Stable[6] แตก็มีการเพิ่มคุณ มบัติของ HTML5 เพื่อใ รองรับ Client­side database เพื่อเก็บขอมูล และจากค ามจำเปนดังกลา HTML5 จึงได เพิ่มค าม ามารถขึ้นมาดังนี้ ­ ใชการกำ นด Doctype ที่ ั้นลงเพียงกำ นด <!DOCTYPE html> บน ั ไฟลเอก ารที่มีนาม กุล .html ­ ามารถใชงาน CSS3 ไดอยางเต็มรูปแบบ ­ มี Elements ใ มเพิ่มขึ้นมา เชน <canvas>, <audio>, <video>, <header>,<footer>,<article> ­ นับ นุนการใชงานภาพเคลื่อนไ และเ ียงโดยตรง (จากเดิมที่ใช งานผาน Flash) ­ มี Local storage และ Local SQL database ­ รองรับการใชงาน HTML5 เพื่อ ราง Web application ­ รองรับการแ ดงผล 2D/3D ในรูปแบบ 2D Canvas, WebGL, SVG และ 3D CSS แม าในปจจุบัน HTML5 ยังอยูในขั้นตอนการราง (มีแผนในการเปดใ ใชงานจริงในป 2014) และใน บางฟเจอรยังไมเ ถียรแตก็มีการใชงานที่แพร ลายในปจจุบันเนื่องจากคุณ มบัติที่กลา ไปขางตน แต ถึงอยางไรก็ตามบางฟเจอรอาจโดนตัดออกไดตลอดเ ลา Installation guide : กอนที่เราจะเริ่มใชงาน PhoneGap เราตองทำการติดตั้งเครื่องมือที่ใชในการ พัฒนาไ กอนและเนื่องจากการพัฒนาใน ระบบปฏิบัติการ Mac OS X รือ Linux กับ ระบบปฏิบัติการ Windows นั้นมีค ามแตก ตางกันเล็กนอยใน นที่เปน Version ของเครื่องมือ และการตั้งคา Developement Environment

นา 9 ของแตละระบบปฏิบัติการ ดังนั้งจึงจะแยกอธิบายการตั้งคาในบาง นที่จำเปน ซึ่งเครื่องมือที่ใชก็มี ดังนี้ 1) Java Development Kit(JDK) การเขียน Application บนระบบปฏิบัติการ Android นั้นจำเปนตองมีเครื่องมือที่ เรียก า Java Developement Kit(JDK) ซึ่งเปนเครื่องมือที่ร มเอา Compiler และ Interpreter ภา า Java ไ ซึ่งมันจะตางกับ Java Runtime Environment(JRE) ปกติที่มีแค Interpleter ที่ใช Run จาก Byte code ภา า Java ใ ทำงานไดเทานั้น Mac OS X การติดตั้ง JDK ใน Mac OS X เราตองทำการ Download ตั JDK จากเ ็บไซตของ Oracle http://www.oracle.com แล ไปที่เมนู Download > ใน ั ขอ Popular Download เลือก Java for Developer > ใน ั ขอ Java SE Downloads เลือก Java Platform(JDK) แล กด Download > เลือก Accept License Agreement > จากนั้นเลือกรุนที่เ มาะกับเครื่องเราแล กดที่ Link ดาน ลังเพื่อ Download

นา 10 ลังจากที่ได Download มาเรียบรอยแล ก็ทำการติดตั้ง JDK ลงไป ลังจากทำการติดตั้งแล ก็จะทำการตั้งคา Evironment เพื่อใ ระบบปฏิบัติการ ามารถเรียกใช JDK ไดผาน Command­line โดยใน Mac OS X เรากำ นดคาของ $JAVA_HOME ตามขั้นตอนนี้

นา 11 1) า า JDK ที่ติดตั้งไปเปน Version อะไร โดยจะ าโดยใชคำ ั่ง ls ­la /Library/Java/JavaVirtualMachines/ ซึ่งกรณีนี้จะใช jdk1.8.0_05.jdk 2) เปด Terminal ขึ้นมา จากนั้นใช คำ ั่ง nano ~/.bash_profile 3) ทำการเพิ่มคา export JAVA_HOME="/Library/Java/JavaVirtualMachines/jdk1.8.0_05.jdk/Contents/Home" เ ร็จแล บันทึก และออกจากโปรแกรม Nano ที่ใชแกไขไฟล 4) Restart terminal แล ทด อบการใชงานและ Version ของ JDK โดยใชคำ ั่ง java ­version

นา 12 Windows Download ตั JDK จากเ ็บไซตของ Oracle http://www.oracle.com แล ไปที่เมนู Download > ใน ั ขอ Popular Download เลือก Java for Developer > ใน ั ขอ Java SE Downloads เลือก Java Platform(JDK) แล กด Download > เลือก Accept License Agreement > จากนั้นเลือกรุนที่เ มาะกับเครื่องเราแล กดที่ Link ดาน ลังเพื่อ Download

นา 13 ลังจากที่ได Download มาเรียบรอยแล ก็ทำการติดตั้ง JDK ลงไป ลังจากทำการติดตั้งแล ก็จะทำการตั้งคา Evironment เพื่อใ ระบบปฏิบัติการ ามารถเรียกใช JDK ไดผาน Command­line โดยในระบบปฏิบัติการ Windows ตองทำงานตั้งคาตั แปร PATH 1) Start menu > คน าคำ า “environment” > เลือก Edit the system evironment variables

นา 14 2) ไปที่ Tab Advance > เลือก Environment Variables 3) ตั้งคา System Variables > เลือก Variable ช่ือ Path > กด Edit > เพิ่มคาตำแ นงของ JDK เขาไปโดยใช ; คั่น (ในตั อยางคือ C:Program FilesJavajdk.1.8.0_05bin) > กดปุม OK

นา 15 4) ทดลองใชไปที่ Start menu > cmd > javac ­version 2) Software Development Kit(SDK) ในการพัฒนา Application ของเอก ารนี้เกือบทั้ง มดจะเปนการใชงานอุปกรณที่ ทำงานบนระบบปฏิบัติการ Android เพราะ ะด กตอการพัฒนา Application ำ รับผูเริ่มตน เนื่องจากการติดตั้ง Application ลงไปในอุปกรณจริงนั้น ามารถทำไดโดยไมตองขออนุญาตกอนเชน ใน iPhone รืออุปกรณที่ทำงานบน iOS ของ Apple ที่ตองมีบัญชีผูใชชนิดพิเ ที่เปน iOS developer certificate ซึ่งมีคาใชจายในการดำเนินการ การท่ีเราจะ ามารถ ราง Application โดยการ Build จากเครื่องเราเองไดเลยนั้น ตองอา ัย Software Development Kit(SDK) ในภา าที่เปน Native Language นั้นๆ เชนกรณีนี้ เราจึงตองการ Android SDK ซึ่ง ามารถ Donwload ไดจาก http://developer.android.com/sdk/index.html แล Click ปุม Download the SDK จากนั้น กดยอมรับกฏการใชงาน และกด Download

นา 16 Mac OS X โดยในตั ไฟลที่ Donwload มาจะมี Android SDK และ Eclipse IDE ซึ่งถูกดัดแปลงมาใ มีเครื่องมือพื้น ฐานในการพัฒนา Application บนระบบปฏิบัติการ Android เชน Android Developer Tools(ADT), Android Emulator มาใ แล ลังจากที่ Download มาก็ตองทำการ Unzip รือแตกไฟลใ เรียบรอย และก็ตองทำการตั้งคา Evironment เพื่อใ ระบบเรียกใชไดใน Command­line โดยจะตั้งคาผาน ตั แปร $PATH ดังนี้ export PATH=/Users/dekcom/Downloads/ADT/sdk/tools:$PATH export PATH=/Users/dekcom/Downloads/ADT/sdk/platform­tools:$PATH

นา 17 Windows Download ตั Zip Android SDK ไดจาก http://developer.android.com/sdk/index.html เมื่อ Download เรียบรอยแล ใ Unzip ออกมาไ แล นำเอาตำแ นงเก็บ platform­tools ไปเพิ่มในตั แปร Path โดย มีขั้นตอนดังนี้ 1) Start menu > คน าคำ า “environment” > เลือก Edit the system evironment variables

นา 18 2) ไปที่ Tab Advance > เลือก Environment Variables 3) ตั้งคา System Variables > เลือก Variable ช่ือ Path > กด Edit > เพิ่มคาตำแ นงของ SDK เขาไปโดยใช ; คั่น (ในตั อยางคือ C:androidandroid­sdk­windowsplatform­tools) > OK

นา 19 3) Node.js ามารถ Donwload ไดที่เ ็บไซต http://www.nodejs.org แล กดไปที่ปุม Install ระบบก็จะทำการเลือกไฟลติดตั้งที่เ มาะ มกับเคร่ืองของผูติดตั้ง และทำการ Donwload ใ ลังจากนั้นก็ทำการติดตั้ง Node.js ที่ถูก Download มาแล ติดตั้งลงในเครื่อง

นา 20 4) Cordova command­line interface ขั้นตอนนี้เปนการติดตั้งคำ ั่ง Cordova ซึ่งเปนคำ ั่งในการจัดการระบบของ PhoneGap เชนการ ั่ง Run Application การติดตั้ง Plug­in ทำใ ามารถถูกเรียกใชไดใน Command­line ตอไป และดังที่อธิบายไปตั้งแตตอนตน าคำ ั่ง phonegap กับ cordova เปนคำ ั่ง ที่คลายกัน ามารถใชเทียบเคียงกันไดแตไมทั้ง มด (ที่ตองแยกกันเพราะเรื่องทรัพย ินทางปญญา) โดยใชคำ ั่งติดตั้งคือ sudo npm install ­g cordova sudo เปนการทำงานโดยใช ิทธิ์ Super User ของระบบปฏิบัติการ Mac OS X (Windows ไมมี) npm คือ NodeJS package manager เปนตั ติดตั้งโดยอา ัยการทำงานของ Node.js install เปนคำ ั่งที่ใชในการติดตั้ง Package ใดๆก็ตาม ­g เปน Parameter ที่บอก าคำ ั่งที่ทำนั้นจะมีผลกับระบบ ลัก เชนกรณีนี้เปนการติดตั้ง codova ไ ในระบบ npm ลัก (โดยปกติจะติดตั้งไ เฉพาะแตละ Project ของ Node.js ากโปรเจกอื่นตองการ ใชอาจจะตองติดตั้งอีกครั้ง) cordova เปนชื่อ Package ที่จะทำการติดตั้ง

นา 21 Restart Terminal/Command Prompt แล ลองใชงาน cordova 5) PhoneGap command­line interface คำ ั่ง phonegap และคำ ั่ง cordova นั้นแมมีค ามใกลเคียงกันมากในรูปแบบการ ใช แตในบางคำ ั่งค าม ะด กของการใชงานแตกตางกันไป เชนคำ ั่ง phonegap serve นั้นมีระบบ autoreload เพื่อตร จ อบการเปลี่ยนแปลงของไฟลแล ทำการเรียกซ้ำคำ ั่ง phonegap serve ใ ใ มโดยที่เราไมตองทำเอง เพราะในคำ ั่ง cordova serve นั้นไม ามารถทำได ซึ่ง ิธีการติดตั้งก็ คลายกัน และแนะนำใ ลงทั้ง องคำ ั่งค บคูกัน

นา 22 6) Ripple Emulator (PhoneGap Emulator) Emulator รือตั จำลองอุปกรณถูกใชในการพัฒนา Mobile Application อยาง แพร ลาย เนื่องจาก ากเราตองการทดลองกับอุปกรณเคลื่อนที่ก็ ามารถ รางจำลองโดยไมตองซื้อ อุปกรณจริง รือ ากไมตองการเชื่อมตอกับอุปกรณจริงก็ ามารถเลือกใชการจำลองอุปกรณเพื่อ ทด อบไดโดย ราง Emulator ของแตละอุปกรณที่ตองการเชน iPhone, Nexus โดยอุปกรณจำลองที่ รางมานั้นจะมีคุณ มบัติคลายกับอุปกรณจริงแตถูกจำลองขึ้นโดย Software ทำใ ลดงบประมาณลง ไป ร มทั้งการพัฒนา Application ใน Emulator ยังไมจำเปนตองขออนุญาตเพื่อติดตั้ง Application ลงในอุปกรณซึ่งก็ทำใ ะด กมากขึ้นไปอีก ตั Emulator เองก็มีใ เลือกได ลาก ลายคาย ขึ้นอยูกับค ามถนัดและเ มาะ มกับ งาน ซึ่งในเอก ารนี้เลือกใชงาน Ripple Emulator ซึ่งเปน Emulator ที่ถูกพัฒนามาจาก TinyHippos ที่ตอนนี้เปน น นึ่งของ BlackBerry WebWorks SDK โดยมีผู นับ นุนการทำงานคือ BlackBerry’s Ripple Emulator[7] ตั Emulator นี้ ใชและ ามารถจำลองขอมูลเชน จำลองตำแ นง GPS ได, จำลอง Accelerometer ได และการทำงานของ Ripple Emulator เปน Extension ของ Google Chrome ซึ่งติดตั้งไดงาย แตตองการติดตั้ง Google Chrome และ Ripple Extension รือติดตั้ง Plug­in ของ Node.js ที่ชื่อ ripple­emulator จึงจะใชงานได ซึ่ง ามารถติดตั้งไดโดยไปที่ http://emulate.phonegap.com และทำตามขั้น ตอนดานข ามือนี้

นา 23 ิธีการใชก็ทำไดโดย การไปที่ นา Website ที่เรา ตองการ > คลิ๊กเมา ดานข า > Emulator > Enable > เลือก Apache Cordova (2.0.0)

นา 24 แตเพื่อค าม ะด กในการเรียกใชงานไดจาก Command­line ไดเลย ตองทำการติดตั้ง Node.js Package ที่ชื่อ า Ripple­emulator โดยใชคำ ั่ง sudo npm install ­g ripple­emulator จากนั้นทด อบโดยเขาไปในโฟลเดอรที่มีโปรเจกของ Cordova อยูจากนั้นใชคำ ั่ง ripple emulate (ตองมีโปรเจก และมี platform อยูกอนแล จึงจะลองได) 7) PhoneGap Developer Application เปน Application ที่ รางขึ้นมาเพื่อลดอาการป ด ั เมื่อทดลองใชงาน Ripple Emulator (PhoneGap Emulator) และ Remote Debugging ในอุปกรณที่ทำงานบนระบบปฏิบัติการ iOS, Android และ Windows Phone แล ปรากฏ าตองขออนุญาตในการติดตั้ง Application กอนซึ่ง เราก็มักจะไมมี Certificate ของ iOS รือไม ะด กที่จะติดตั้ง Application บนอุปกรณจริงบอยๆ ดังนั้นทีมงานของ PhoneGap จึงออก Application นี้มาช ย โดยเรา ามารถที่จะติดตั้งแค

นา 25 Application กลางตั เดีย กันแล เปลี่ยนแคใ ในเปน Application ตั อื่นที่เรากำลังพัฒนาอยู (ตั โคดเขียนด ย HTML+JS+CSS อยูแล ) การทำงานก็จะคลายกับ Ripple Emulator แตเปนการ ทำงานบนอุปกรณจริง และมีขอเ ียก็คือในปจจุบันนี้ (PhoneGap 3.5.0­0.20.4 | Cordova 3.5.0­0.2.4) ระบบ Autoreload (ระบบที่ทำใ เราแกไขไฟลแล ตั Application ถูกแกไขตามไป ด ยอัตโนมัติ) มีแคในโปรเจก PhoneGap นในโปรเจก Cordova ยังตองรันคำ ั่งใ มทุกครั้ง จึงไม คอยเ มาะกับโปรเจก Cordova ดังนั้นขอแนะนำใ รางโปรเจก PhoneGap เพราะ ามารถใชงาน ไดทั้ง PhoneGap CLI และ Cordova CLI (CLI ­> Command­Line interface) ิธีการใชงานใ ั่ง phonegap serve ในโฟลเดอรของโปรเจก PhoneGap จากนั้น Download application ตามระบบที่จะใชทด อบซึ่ง ามารถดูไดที่ http://app.phonegap.com แล ทำการ ติดตั้ง และเรียกใชงาน โดยใ URL ที่ไดจากการใชงานคำ ั่ง phonegap serve ลงไป จากนั้นก็ ทำการกดปุม Connect ระบบจะเชื่อมตอมาที่ IP Address ของเครื่องที่เราใชรันคำ ั่ง phonegap serve จากนั้นก็จะเรียกใชขอมูลที่อยูใน Application ที่เรา เขียน ซึ่ง ากเราใชคำ ั่ง phonegap serve ากเรา แกไขไฟลเชน index.html แล เรา Save ระบบ autoreload จะเปลี่ยนแปลงในโทร ัพทของเราใ อัตโนมัติ แต ากใช cordova serve ตองกด ctrl + c เพื่อปด Process ของ cordova แล ใชคำ ั่ง cordova serve อีกครั้ง แล ยังตอง refresh ตั application ในโทร ัพทใ มอีกด ย

นา 26 Basic knowledge : ถึงแม าการตั้งคา Environment ในการพัฒนาบางอยางจะแตกตางกันไปในแตละระบบ ปฏิบัติการ แตในการพัฒนา Application นั้น ามารถทำไดโดย Source code ชุดเดีย กันเพราะ ภา า HTML, CSS และ JavaScript นั้นเปนภา าที่ไมขึ้นอยูกับ Platform ของผูพัฒนาจึงทำใ ะด กตอการพัฒนา Application < Basic command > NodeJS package manager npm install <PackageName> ใชติดตั้ง Package npm uninstall <PackageName> ใชลบ Package Cordova CLI (Command­Line interface) cordova help ใชเปดคำแนะนำการใชคำ ั่ง cordova cordova ­­version ใชตร จ อบ Verison ของ cordova cordova create <App_name> ใชในการ รางโปรเจก Mobile Application cordova info ใช รางไฟล info.txt ที่ร มขอมูลของโปรเจก cordova platforms ใชแ ดง Platform ทุกตั ที่ติดตั้งมาในโปรเจก cordova platform add <PlatformName> ใชเพิ่ม Platform ในโปรเจก cordova platform remove <PlatformName> ใชลบ Platform ในโปรเจก cordova plugin ใชแ ดง Plug­in ทั้ง มดในโปรเจก cordova plugin add <Repository> ใชเพิ่ม Plug­in ในโปรเจก

นา 27 cordova plugin remove <PluginPackageName> ใชลบ Plug­in ในโปรเจก cordova prepare ใช Copy ไฟลขอมูลใ พรอมในการ Compile แตละ Platform cordova compile ใช Compile ขอมูลใ เปน Mobile Application cordova build ใชเปนคำ ั่งลัดในการ prepare และ compile cordova run <PlatformName> ใชรัน Mobile Application cordova emulate ใชในการเรียกใช Emulator พ ก Android Virtual Device cordova serve <Port> ใชเปด Web Server ใน Localhost ของโปรเจก Ripple Emulator ripple emulate ใชเปดตั Emulator ของโปรเจก < Hello, PhoneGap > ถึงตอนนี้เราก็มีเครื่องมือเพียงพอที่จะ รางโปรเจก Cordova แล และในขั้นตอนนี้ เราก็จะลอง รางโปรเจกงายๆ ที่ชื่อ า hello ขึ้นมาซึ่งภายในโปรเจกนี้จะมีแคไฟล ลักที่คำ ั่ง cordova รางมาใ เพื่อทด อบการใชงานคำ ั่งและการตั้งคาโปรเจกแบบงายๆ ขั้นตอนแรก ทำการ รางโปรเจกชื่อ hello โดยใชคำ ั่ง cordova create hello ขั้นตอนที่ 2 เชาไปในโฟลเดอร hello โดยใชคำ ั่ง cd hello จากนั้นตร จ อบ ามี Platform ถูกติด ตั้ง รือยัง และมี Platform ไ นที่ใชไดบาง

นา 28 กรณีไมมีคาอยูใน Installed platforms แบบในตั อยางนี้เราตองทำการ เพิ่ม Platform เขาไปโดยเราตองทำตร จ อบกอน าในโฟลเดอร platforms ที่อยูใน ADT ­> sdk ­> platforms มีโฟลเดอรยอยของ Platform อยูจริงๆ จึงจะ ามารถเพิ่มเขาไปได โดยการเพิ่ม Platform เขาไปก็ ามารถทำไดโดยใชคำ ั่ง cordova platform add android ขั้นตอนที่ 3 ทด อบการใชงาน ซึ่ง ามารถทด อบได ลายรูปแบบ คือ 1) เปด Web server แล เขาผาน http://localhost:8000 ผานคำ ั่ง cordova serve

นา 29 2) ใช Ripple Emulator ผานคำ ั่ง ripple emulate

นา 30 3) ใชกับอุปกรณจริง ผานคำ ั่ง cordova run android < Config.xml > ไฟล Config.xml เปนไฟล ลักที่ใชในการตั้งคา โดยตั มันจะถูกตั้งคา ลักๆใ กับระบบของ Application ในแตละ platform เอาไ เชนตั้งคา Application ใ ทำงานแบบแน นอนเทานั้น ( บรรทัดที่ 13)

นา 31 Plug­in : Cordova นั้นมี นที่แยกออกจากกันเปน นเ ริมเล็กๆที่เรียก า Plug­in เพื่อค าม ะด ก ในการเพิ่ม รือลดค าม ามารถของแตละ Application ดังนั้นการเรียกใชงานโมดูลของอุปกรณ เคลื่อนที่ก็ ามารถทำไดผานทาง Plug­in เชนเดีย กัน โดย ามารถ าดู Plug­in ที่ ามารถใชชื่อ Package ในการติดตั้งไดเลย เนื่องจาก Plug­in ลงทะเบียนไ แล ไดจากเ ็บไซต http://plugins.cordova.io < Install Plug­in > การติดตั้ง Plug­in ทำไดโดยใชคำ ั่ง cordova plugin add <PluginPackageName รือ Repository> เชน cordova plugin add org.apache.cordova.battery­status < Uninstall Plug­in > ิธีถอนการติดตั้ง Plug­in ทำไดโดยใชคำ ั่ง cordova plugin remove <PluginPackageName> เชน cordova plugin remove org.apache.cordova.battery­status Documentation : นักพัฒนา ามารถเขาไปดูเอก ารการพัฒนาไดที่เ ็บไซต http://cordova.apache.org/docs/en/ จากนั้นเลือก Version ของ Cordova ที่ใช โดยจะดูจาก Version ลักในการพัฒนา เนื่องจากบาง Version ใชคำ ั่งไมเ มือนกัน แมตองการผลลัพทแบบ เดีย กัน โดยในเอก ารนี้จะบอก ิธีการใชงาน และคำ ั่งพื้นฐานไดเปนอยางดี

นา 32 Adobe® PhoneGap™ Build : ลังจากที่ทดลอง ราง Application แล ก็ถึงขั้นตอนที่จะ ทดลองใชงาน Adobe® PhoneGap™ Build ซึ่งเปนเครื่องมือที่ช ย Build Mobile Application แบบ cross­platform ที่ทำงานบน ระบบที่เรียก า Cloud­computing โดยเราจะ Upload ไฟล Zip ของโปรเจกขึ้นไป รือใช Git ซึ่งเปน Version Control เพื่อ Push ไปที่ Repository ของ Github.com แล ใ PhoneGap™ Build ไปเรียกใชไฟล ซึ่งตั PhoneGap™ Build ามารถ Build ใน platform iOS, Android™, Windows® Phone, Blackberry® 5/6/7 และ webOS ไดโดยใช Source Code ชุดเดีย กัน เรา ามารถ Build Application จาก PhoneGap™ Build ไดโดยมีเงื่อนไขคือ Application ที่ รางมานั้น ากเปน Public Application รือ Open Source ที่ถูกเก็บไ ใน Repository ของ Github นั้นจะไมจำกัดจำน นของ Application ที่จะ Build แต ากเปน Private Application และ ใชงาน Free plan จะ Build ได 1 Application แตถาเปน Private Application และใช Paid Plan รือเปน มาชิกของ Adobe Creative Cloud จะ ามารถ Build ไดถึง 25 Applications (มีคาใช จายเดือนละ $9.99) โดยทุกรายการจะไมจำกัด Collabolator ที่จะใ ทดลองใช รือพัฒนาร มกัน ผานทางเ ็บไซต https://build.phonegap.com

นา 33 < Signing keys > ระบบ Signing key เปนการรัก าค ามปลอดภัยใ กับ Application แบบ นึ่ง โดยระบบนี้ใช ตร จ อบ าผูพัฒนามี ิทธิ์การพัฒนา รือไม และ Application ที่พัฒนามานั้นเปนมาจากตั นัก พัฒนาจริงๆ ไมไดถูกผูไม ังดีแอบเปลี่ยนแปลง Application ทำใ มีค ามไมปลอดภัย จึงตองมีการ Signed เพื่อรับรอง Application โดย ิธีการ Signing key คือ ากมี Account ของ AdobeID รือ Github อยูแล ก็ ามารถลงชื่อเขาใช PhoneGap™ Build ไดเลย แต ากไมมีก็ทำการ มัคร มาชิก AdobeID กอนจึงลงชื่อเขาใช ลังจากลงชื่อเขาใชแล ใ คลิ๊กที่รูปคน จากนั้นไปที่ Edit account

นา 34 ­ iOS iOS appliction ตองการใช Developer certificate เพื่อยืนยันตั ตนของ Developer ตั้งแตในขั้นตอนการ Build โดยที่ตองการเปนนักพัฒนา Application ใน iOS ตอง มัคร มาชิกแบบ iOS Developer ไ กับ Apple แล ทาง Apple จะออกใบอนุญาตใ โดยใบอนุญาตนี้มีคาธรรมเนียม ในการ มัคร มาชิกปละ $99 การเพิ่ม key นั้นตองนำใบอนุญาตออกมาจากบัญชีผูใชของ Apple iOS Developer โดยใชไฟลที่ เรียก า certificate (.p12), profile (.mobileprovision) และร ั ผานที่เขาร ั certificate ไ โดยไปที่ iOS > add a key > เลือกไฟล cerificate และ profile > กดที่รูปกุญแจ > ใ ร ั ผาน

นา 35 ­ Android การ Build Android Application นั้นไมไดบังคับการ Signing key แตอาจจะเกิด ปญ าในกรณีที่ตองการจะทำ Application ใน ลาย Version ซึ่งจำเปนตองใช Signing key เพื่อ ยืนยัน า Application ที่ถูกแกไขเกิดขึ้นจากตั ผูพัฒนา Application จริงๆ และไมไดถูกดักแกไข โดยผูไม ังดี และการนำ Application ขึ้นไปบน Google Play Store มีคาธรรมเนียม ำ รับนัก พัฒนาอยูที่ $25 ชำระเพียงครั้งเดีย โดยมี ิธีการทำใบรับรองดังนี้

นา 36 < How to Build > Source Code ที่จะใชในการ Build ากเปน Public Application ตองเปนโปรเจกที่อยูใน Repository ของ Github เทานั้น แต ากในกรณีที่เปน Private Application ามารถเลือกได าจะ Upload ผาน Zip ไฟล รือผาน Repository ของ Github (แตแบบ Private มีขอจำกัดเรื่องจำน น Application)

นา 37 ากตองการใชขอมูลจาก Repository ใน Github ก็ ามารถกดปุมรูปตั v เพื่อ า Repository ที่อยูใน Account ที่ลงชื่อเขา ใช รือใ URL ของ Repository ไดเลย แต ากตองการใช Zip ไฟลก็ใ ไปที่ไฟลเด อรโปรเจกของ Cordova จากนั้นก็เลือก ไฟลทั้ง มดแล ทำการ Zip ทดลองโดยกด Enable debugging และ Enable Hydration จากนั้นกดปุม Ready to build

นา 38 iOS ากไมมี Key จะไม ามารถ Build ได ดังนั้นจึงตองเลือก Key ใ กับ iOS Compiler แตตั อื่น นั้นจะยังคงทำงานไดแมไมมีการ Signing key ลังจากเลือกเ ร็จแล ก็กด Rebuild

นา 39 < Remote Debugging > ค ามเจงอีกอยางของ PhoneGap™ Build คือ ามารถทำ Remote Debugging ซึ่งก็ คือการ Debug โดยไมตองเ ียบอุปกรณเขากับ เครื่องนักพัฒนา แตเพียงแคติดตั้ง Debug Application ลงไปแล เชื่อมตอเขากับระบบ อินเทอรเน็ต ก็ ามารถ Debug ไดแล โดยผาน ทาง Web Application ที่เรียก า Weinre โดย การใช Application อานคา QR code จากนั้นติดตั้ง Application ลงไปบนอุปกรณเคลื่อนที่ แล เขาใชการ debug จากเ ็บไซต https://build.phonegap.com

นา 40 ทดลองใชคำ ั่ง Alert ขอค ามขึ้นมาแ ดง

นา 41 Workshop : < เกมเปา ยิง ฉุบ > เกมเปลา ยิง ฉุบมีกติกางายๆคือ กระดา ชนะ คอน, คอน ชนะ กรรไกร, กรรไกร ชนะ กระดา เรา จะมาลองเขียนเกมนี้ขึ้นมา 1. ั่ง phonegap create Pao­Ying­Chup เพื่อ รางโปรเจกของ PhoneGap ขึ้นมา 2. ั่ง cd Pao­Ying­Chup เพื่อเขาไปในโฟลเดอรของโปรเจก 3. ั่ง cordova platform add android เพื่อเพิ่ม Platform android เขาไปในโปรเจก 4. ั่ง ripple emulate เพื่อจะลองอุปกรณ จากนั้นระบบจะเดง Web browser ของอุปกรณเ มือนใ เอง 5. ในโฟลเดอร www เราจะทำการพัฒนา Application ที่นี่ 6. ในโฟลเดอรยอยของ www เตรียมไฟลภาพไปไ ในโฟลเดอร img 7. เราจะแกไขไฟล index.html (เพื่อค าม ะด กจะเขียนโคดทั้ง มดที่ใชในไฟลนี้)

นา 42 ลอจิกของ Pao­Ying­Chup Game เอาคาที่เปนไปไดเก็บไ ในตั แปร result จากนั้นทำการ ุมแล เอามาเทียบกับที่ผูใชเลือก ามารถดู SourceCode ไดที่ https://github.com/Aorjoa/Pao­Ying­Chup เปลี่ยน Logo : ขนาดของภาพที่จะถูกใชในอุปกรณเคลื่อนที่มี ลายขนาด เพื่อค าม ะด กเราจะทำแคขนาด เดีย แล ใชเ ็บ http://makeappicon.com ในการแปลงใ เปน ลายขนาดโดยเลือกไฟลตนฉบับลง ไป จากนั้นรอใ ระบบประม ลผล

นา 43 ไปที่ Tab Android จากนั้นก็ Download ไฟลภาพขนาดตางๆมา แล แกไขไฟล ic_launcher.png เปน icon.png แล เอาไฟลไปเปลี่ยนไดโดยไปที่ Pao­Ying­Chup ▸ platforms ▸ android ▸ res ▸ ดูจากขนาดไฟลที่ Download มา าจะอยูในโฟลเดอรไ น (กรอบ ี ม) เปลี่ยนชื่อ Application : ามารถทำการเปลี่ยนชื่อ Application ไดโดยไปที่ Pao­Ying­Chup ▸ www ▸ config.xml จากนั้นเปลี่ยนคาตามที่ตองการ

นา 44 Deploy to Store : < Google Play Store > กอนจะนำ Application ขึ้น Store เราตอง Signing key กอน ซึ่ง ิธีแบบเดิม ก็ไมเ มาะ เพราะตองใชงาน Command­Line ที่ซับซอน เราจึงจะเปลี่ยนมาใช Eclipse IDE รุนดัดแปลงมาใช งาน Android รือ Android Developer Tool(ADT) มาใชงานเพื่อค าม ะด ก และลดโอกา เกิด ขอผิดพลาด (นั่นเปน าเ ตุที่ในตอนแรกเราจึงไมโ ลดเฉพาะตั SDK ของ Android มา) จากนั้นกด Finish เพื่อ import โปรเจกเขามา แล คลิ๊กข าที่โปรเจก แล ทำการ Signing key APK โดย รางร ั ในการเปดใช Signing Key

นา 45 จากนั้นตั้ง Allais และร ั ผานของ Signing key (ตองจำร ั ผานที่ใชไ ด ย) ลังจากที่กด Finish จะไดไฟลใน Target ที่เราตั้งไ คือไฟล Signing key เพื่อยืนยันตั ตน และไฟล APK เพื่อใช Upload ไปที่ Store

นา 46 จากนั้นไปที่ https://play.google.com/apps/publish แล ลงชื่อเขาใชงาน Play Store ในระบบ ของผูพัฒนา (ตองเปนบัญชีผูใชที่ มัครเปนผูพัฒนาและมีการจายคาธรรมเนียมเพื่อยืนยัน ิทธิ์แล ) เพิ่ม Application ลงใน Play Store 1) กดปุม + Add new application 2) เลือกภา า และเพิ่มชื่อที่จะใชเรียก Application แล กด Upload APK 3) ใน Tab APK และ Tab ยอย Production ใ เลือก Upload your first APK to production

นา 47 4) เลือกไฟล APK 5) ใน Tab Store Listing ใ กำ นดคำบรรยายของ Application

นา 48 เพิ่มรูป Screen Shot (ใน นของ Phone ตองมีอยางนอย 2 รูป) รูป icon แบบ hi­resolution ขนาด 512 x 512

นา 49 กำ นด Category าเปน Application แบบไ น และ Rating บอก าผูใชงานค รเปนใคร ขอมูลนักพัฒนา นโยบายการใชงาน (ถายังไมมีก็เลือก Not submitting a privacy) เมื่อมีการเปลี่ยนแปลงขอมูลใ กด Save 6) ใน Tab Pricing & Distribution กำ นดการกระจาย Application และราคา

นา 50 เลือก ามารถโ ลดไดทุกประเท อานขอตกลงและยินยอม 7) ตร จ อบค ามเรียบรอยของ Application เมื่อมีการเปลี่ยนแปลงตองกดปุม Save ทุกครั้งเพราะ ระบบจะตร จ อบขอมูลที่ยังไมเ ร็จ มบูรณใ เราไดด ย ากปุมที่มุมบนซายเปน Draft ใ คลิ๊กปุม Draft จากนั้นเลือก Why can’t I publish? ระบบจะบอก าเรายังขาดขอมูลอะไรที่จำเปนไปบาง และ ากมุมบนข าขึ้นเปน Ready to publish ใ กด Publish this app ลังจากนั้นรอประมาณ 4­5 ชั่ โมง Application ที่ งขึ้นไปก็จะปรากฏ ถานะ Published และพรอมโ ลดใน Play Store https://play.google.com/store/apps/details?id=com.iaor.app.paoyingchup

นา 51 Update Application ใน Play Store การเปลี่ยนแปลง Application นั้นเราจำเปนตองมี Signing key เพื่อยืนยัน ิทธิ์เรา ซึ่งไดมาจากขั้น ตอนการ ราง Signing key ซึ่งเราตองเก็บไ ใ ดี และตองจำร ั ผานที่ใชไ ด ย 1) แกไขไฟล Application 2) ในโฟลเดอร platforms ­> android แกไขไฟล AndroidManifest.xml แล เปลี่ยนรุนของโคด และรุนของ Application

นา 52 3) เปด Eclipse IDE ขึ้นมา ากยังไมมีโปรเจกอยูก็

Add a comment

Related presentations

Speaker: Matt Stine Developing for the Cloud Track Marc Andressen has famou...

This presentation explains how to develop a Web API in Java using (JAX-RS or Restl...

1 App,

1 App,

November 10, 2014

How to bring innovation to your organization by streamlining the deployment proces...

Cisco Call-control solutions can handle voice, video and data

Nathan Sharp of Siemens Energy recently spoke at the SAP Project Management in Atl...

Related pages

PhoneGap Books

This book covers the necessary concepts you’ll need to build useful, rich, secure enterprise apps for mobile devices, and also explains portions of an ...
Read more

Amazon.com: phonegap: Books

PhoneGap Beginner's Guide Third Edition Create, develop, debug, ... 5 Mobile App Development with PhoneGap Books from LearnToProgram, Inc ...
Read more

PhoneGap eBooks - Free Download IT eBooks

PhoneGap eBooks - IT eBook free library ... Mastering PhoneGap Mobile Application Development PhoneGap is a useful and flexible tool that enables you to ...
Read more

Beginning PhoneGap - Free Download eBook - pdf

PhoneGap is a growing and leading open-source mobile web apps development framework that lets developers build JavaScript and HTML5-based web applications ...
Read more

Home - Apache Cordova 4 Programming

Apache Cordova 4 Programming book' s web site. ... This book started many years ago as a book called PhoneGap Essentials (www.phonegapessentials.com); ...
Read more

PhoneGap Mobile Application Development Cookbook eBook ...

As more and more of our online life and daily activities evolve into the mobile landscape it has never been of more importance to start venturing into the ...
Read more

PhoneGap 3, Beginner's Guide, 2nd Edition: Giorgio Natili ...

PhoneGap 3, Beginner's Guide, 2nd Edition [Giorgio Natili] on Amazon.com. *FREE* shipping on qualifying offers. PhoneGap opens up mobile application ...
Read more

PhoneGap -simpleNeasyBook (English Edition) eBook: WAGmob ...

Amazon.de: eBook - PhoneGap -simpleNeasyBook (English Edition) WAGmob. Sofort auf Ihrem Kindle, PC, Tablet oder Smartphone verfügbar. Jetzt entdecken!
Read more

PhoneGap

PhoneGap Build takes the pain out of compiling PhoneGap apps. ... Books; Plugin Library; We're Everywhere. GitHub; IRC; Twitter; Facebook; Google+; YouTube ...
Read more

PhoneGap - Facebook

PhoneGap. 43,460 likes · 135 talking about this. PhoneGap is an open source solution for building cross-platform mobile apps with modern, standards-based...
Read more