linuxday2012 - android, phonegap and jquery mobile
Post on 13-May-2015
246 Views
Preview:
TRANSCRIPT
jQuery Mobile e Cordova/PhoneGapin applicazioni Android
Salvatore Carotenuto, StartUp Solutions
LinuxDay 2012 – 26/10/2012, Teatro Carlo Gesualdo, Avellino
1. scarichiamo l'Android SDK
2. aggiorniamo i pacchetti dell'Android SDK
2. aggiorniamo i pacchetti dell'Android SDK
3. apriamo NetBeans e installiamo il plugin per lo sviluppo Android
3b. aggiungiamo la sorgente da dove scaricare il plugin per lo sviluppo Android
3b. aggiungiamo la sorgente da dove scaricare il plugin per lo sviluppo Android
3c. selezioniamo i pacchetti “Android” e “Android Test Runner” dalla lista dei plugin disponibili, e clicchiamo su “Install”
4. ora siamo pronti per creare un nuovo progetto Android:
4b. visto che non è ancora stato assegnato l'Android SDK all'ambiente, clicchiamo sul bottone “Manage Android SDK”
4c. si aprirà una finestra di opzioni, nella quale inseriremo il path dove abbiamo scompattato l'Android SDK
4d. selezioniamo la target platform, definiamo gli altri campi (nome progetto, package...) e procediamo cliccando su “Finish”
4e. a questo punto il nostro progetto è (quasi) pronto
5. (opzionale) creiamo un Android Virtual Device
5b. (opzionale) creiamo un Android Virtual Device
5c. (opzionale) creiamo un Android Virtual Device
6. lanciamo “Run” da NetBeans (se avete scelto di usare l'emulazione, si aprirà il Virtual Device)
6. ...e verrà eseguita la vostra applicazione
Cordova? PhoneGap????
Nel 2011, Adobe/Nitobi ha donato il codice basedi PhoneGap alla Apache Software Foundation.
Inizialmente il nuovo progetto doveva chiamarsiApache Callback, poi è stato scelto Apache Cordova
in onore di Nitobi, la cui sede era in Cordova Street, Vancouver
“PhoneGap is a distribution of Apache Cordova.You can think of Apache Cordova as the engine that
powers PhoneGap, similar to how WebKitis the engine that Powers Chrome or Safari.“
(fonte: http://phonegap.com/2012/03/19/phonegap-cordova-and-what%E2%80%99s-in-a-name/ )
7. scarichiamo PhoneGap
8. scompattiamo PhoneGap, e procediamo ad integrarlo nel nostro progetto
8a. creiamo, nel nostro progetto, due nuove directory: ./assets ./assets/www
8c. dalla sottodirectory android di PhoneGap, ci interessano i files cordova-x.x.x.jar, cordova-x.x.x.js e la directory xml
8d. copiamo il file cordova-x.x.x.js in assets/www, il file cordova-x.x.x.jar in libs, e la directory xml in res
9. riapriamo NetBeans, e apportiamo le piccole modifiche necessarie per utilizzare PhoneGap
9b. settiamo le permissions nel file AndroidManifest.xml
9c. e infine creiamo un nuovo file index.html sotto assets/www
9d. et voilà! PhoneGap è servito
10. jQuery Mobile! Scarichiamo l'ultima versione dal sito jquerymobile.com, e scompattiamola
10a. jQuery Mobile è basata su jQuery, quindi scarichiamo anche l'ultima versione di jQuery da qui: http://code.jquery.com/jquery-1.8.2.min.js
10b. Copiamo nel nostro progetto Android il javascript di jQuery appena scaricato, e dalla directory di jQuery Mobile scaricata in precedenza, i due files jquery.mobile-x.x.x.min.js e jquery.mobile-x.x.x.min.css. Poniamo il tutto sotto la directory assets/www
10c. ora editiamo il file index.html in modo da includere i javascript e il css appena copiati
10d. ed ecco jQuery Mobile in azione!
nota: la struttura html della pagina proviene dalle demo fornite con jQueryMobile. http://jquerymobile.com/demos/1.2.0/docs/pages/multipage-template.html
top related