PhoneGap/Cordova & Windows Phone
Sponsor
Chi sono?
• Co-fondatore di Neologics –
sviluppo e consulting
• http://sviluppomobile.blogspot.it
/
• Twitter: @danardelean
•
agenda
• Introduzione a PhoneGap/Cordova
• API per Windows Phone
• Plugins
• Tips and tricks Marketplace
Perché usare PhoneGap
• Svilupare applicazioni cross-platform:
Windows Phone, iOS, Android, Bada
• Usare HTML5, Javascript e CSS3
PhoneGap o Cordova?
• Cordova è il progetto Open Source
gestito da Apache Foundation
• PhoneGap è il «brand» comprato da
Adobe
• Cordova è per PhoneGap come WebKit è
per Chrome/Safari
• Cordova non è una libreria per interfaccia utente
• Il livello di compatibilità HTML5/CSS3 varia da
piattaforma a piattaforma http://
www.mobilehtml5.org
• Cordova non è un compilatore – ogni piattaforma a
bisogno del suo compilatore
• Cordova non è un browser o un motore di rendering
Cordova non è:
• Una piattaforma per creare applicazioni mobile native
usando tecnologie Web (HTML5, CSS 3)
• Una libreria Javascript
• Una libreria nativa per ogni piattaforma
• Compilation helpers
Cordova è:
Cordova e Windows Phone
• JS ->Codice nativo• Javascript chiama
window.external.Notify(string)• Il codice C# ascolta per l’evento
ScriptNotify
• Codice nativo -> JS• this.WebBrowser.InvokeScript(scriptName,
string[] args);
Applicazioni web nativeD
ata
Logic
Devic
eU
I
.web workers.touch events
.web storage.sql storage.indexeddb.web sockets
.file api
.contacts api
.canvas
.elements
.svg
.basic & adv
.transforms
.transitions
.animations
.notifications
.events
.geolocation
.motion
.multimedia
.accelerometer
.compass
.camera
.network info
.PhoneGap plugins
Deploy
• Windows Phone SDK
http://create.msdn.com
• PhoneGap/Cordova 1.6 .1
http://www.phonegap.com
• jQuery Mobile 1.1
http://www.jquerymobile.com
Iniziamo da zero
demo
Hello Cordova
Compatibilità
• Metodi• accelerometer.getCurrentAcceleration• accelerometer.watchAcceleration• accelerometer.clearWatch
• Parametri• accelerometerSuccess• accelerometerError• accelerometerOptions
• Ogetti• acceleration : x, y, z, timestamp
Accelerometro
demo
Accelerometro
• Metodi• compass.getCurrentHeading• compass.watchHeading• compass.clearWatch
• Parametri• compassSuccess• compassError• compassOptions• compassHeading: magneticHeading,
trueHeading,headingAccuracy, timestamp
Compass
• Metodi• geolocation.getCurrentPosition• geolocation.watchPosition• geolocation.clearWatch
• Parametri• geolocationSuccess• geolocationError• geolocationOptions
• Ogetti• Position• PositionError• Coordinates
Geolocalizzazione
demo
Geolocalizzazione
• Metodi• camera.getPicture• navigator.camera.getPicture(, [ cameraOptions ] );
• Parametri• cameraSuccess• cameraError• cameraOptions
• Oggetti• imageURI
Camera
demo
Camera
• Metodi• capture.captureAudio• capture.captureImage• capture.captureVideo• MediaFile.getFormatData
• Oggetti• Capture• CaptureAudioOptions• CaptureImageOptions• CaptureVideoOptions• CaptureCB• CaptureErrorCB• ConfigurationData• MediaFile• MediaFileData
Capture
demo
Capture
• Metodi• media.getCurrentPosition• media.getDuration• media.play• media.pause• media.release• media.seekTo• media.startRecord• media.stopRecord• media.stop
• Parametri• src -URI• mediaSuccess: (Optional) • mediaError: (Optional)• mediaStatus: (Optional)
Media
demo
Media
• Metodi• contacts.create• contacts.find
• Parametri• contactFields• contactSuccess• contactError• contactFindOptions
• Ogetti• Contact• ContactName• ContactField• ContactAddress• ContactOrganization• ContactFindOptions• ContactError
Contatti
demo
Contatti
• Proprietà• device.name• device.cordova• device.platform• device.uuid• device.version• connection.type
• Enum• Connection.UNKNOWN• Connection.ETHERNET• Connection.WIFI• Connection.CELL_2G• Connection.CELL_3G• Connection.CELL_4G• Connection.NONE
Device & Connection
• deviceready
• pause
• resume
• online
• offline
• backbutton
• batterystatus – per Windows Phone solo isPlugged
Eventi
• Metodi• notification.alert• notification.confirm• notification.beep• notification.vibrate
Notification
demo
Notification
Cordova Plugins
• Integrare altre funzionalità native• Live Tiles• Navigazione• Integrazione con Facebook tramite
ShareLinkTask and ShareLinkStatus• …
demo
Live Tile Plugin
• Per la pubblicazione sul
Marketplace partite dal
progetto custom di
PhoneGap togliendo le
funzionalità non usate
Tips and tricks Marketplace:
• Se usate la geolocalizzazione
chiedete permesso al utente di usare
la sua posizione e spiegate come sarà
usata questa informazione.
• Inserire anche l’opzione per inibire
questa funzionalità
Tips and tricks Marketplace:
• Fate attenzione al pulsante Back
Tips and tricks Marketplace:
Anteprima v1.7 per Windows Phone
Valutazione – Codice WP4
www.dotnetcampus.it/eval -> WP4
• $(document).ready(function () { $
("#btnCall").click(function () { $.support.cors =
true; $.getJSON("http://baconipsum.com/api/?
type=meat-and-filler&callback=?", function
(data) { $.each(data, function (index, element) {
$("#result").append(element); }); }); }); });
Notification