Date post: | 22-Jan-2015 |
Category: |
Technology |
Upload: | mauro-parra-miranda |
View: | 2,850 times |
Download: | 4 times |
Agenda● Introducción● Windows Phone● Phonegap● Interacción Phonegap con Windows Phone● Ejemplos● Conclusiones
Introducción● Lo de hoy es la programación de apps móviles● Al ser una nueva tecnología, carecemos de
recursos humanos expertos en el tema.● Pero hay mucha gente que hace web, gracias
al dotcom y post dotcom. ● Phonegap nace como un puente que acerca el
desarrollo de apps móviles a la gente de web.● Phonegap permite crear apps móviles en
diversas plataformas, incluyendo iOS, Android y Windows Phone.
Windows Phone● Microsoft ha ido evolucionando desde diversas
versiones de Windows CE, Windows Mobile y ahora con Window Phone (Mango).
● Microsoft se asoció con Nokia, lo que generó un bella línea llamada Lumia, que cubre las gamas baja, media y alta de telefonía celular.
● Windows Phone tiene la ventaja de no querer imitar ni a iOS (como en su principio Android), sino generar una interfaz fresca, nueva, ligera y limpia.
Windows Phone● Windows Phone sigue evolucionando, el
siguiente paso será Windows 8, en el cual se busca integrar un windows “unificado” entre la computadora personal, la tablet y el móvil.
● Es una evolución interesante porque con Microsoft Azure se podrá mantener el estado de las apps entre diversos devices, ya sea computadora, tablet y móvil.
● Las posiblidades son geniales: poder ver todo tal como esta pasando en todos tus devices, en todos lados
Windows Phone● Existe un parteaguas interesante aqui, porque
existen dos versiones de Windows 8:● Windows 8 – Que contiene el soporte de
compatiblidad hacia atras que muchas compañias buscan (ese viejo wordstar seguirá funcionando).
● Windows 8 RT – Que elimina el soporte de compatiblidad, por lo que es más ligero y estable, y que estará corriendo en devices “ligeros” como tabletas y móviles.
Windows Phone● Jugando a predecir el futuro:
● Todos deberían esta navidad estar programando para Windows Phone, ya sea en modalidad Mango (WP 7.5) o en modalidad Windows 8.
● Windows Phone tiene la ventaja de que es “accesible” economicamente a las masas – Los devices gratis de las compañias de celulares serán Windows Phone, por lo que tendrá un gran alcance.
● Windows Phone ganará el mercado de Android, que es el que mas crece hoy en día.
Phonegap● Phonegap es un wrapper: Te permite crear una
interfaz con el usuario a través de HTML5/CSS, lo que te permite tener efectos agradables, con la programación que ya conoces.
● Una app de phonegap es un conjunto de tecnologías:● Core – Proporciona servicios de UI, a través de
HTML5/CSS● Conectores – Módulos que interactuan con el core,
para proporcionar acceso a las bondades del móvil, tales como GPS, camara, etc.
Phonegap
API común entre plataformasnavigator.cam era.getPicture( onSuccess, onFail );
Blackberry
Diferentes implementaciones:
iOS
Funcionalidades soportadas● Acelerometro● Camara/Captura● Compass● Connection● Contactos● Device● Eventos
● Archivos● GPS● Multimedia● Notificaciones● Storage (key/value,
sql)
Ventajas de Phonegap● La tecnología es abierta – Se desarrolla en la
Apache Foundation.● Existe soporte para varias plataformas – Tiene
soporte para iOS, Android, Windows Phone, Symbian y otros mounstros.
● Existen herramientas que ayudan a la creación de apps móviles, como actualmente podría ser el Adobe Dreamweaver que tiene un plugin para generar apps con phonegap.
Desventajas de Phonegap● El código HTML5/CSS es incluido en la app
que se distribuye. Si tienes acceso al IPA, APK o similar, podrias desempacarlo y literalmente CLONAR la aplicación.
● Compatibilidad del API distinta entre plataformas.
● La aplicación no es exactamente nativa, por lo que tienes una sobrecarga de una Webview completa, que puede ocupar bastante espacio.
● Las apps “no se ven nativas” - esto depende.
Phonegap Builder● Adobe compró a Nitobi hace tiempo, y la razón
de la compra fue una tecnología bellisima llamada “Phonegap Builder”.
● Phonegap builder es un servicio web de compilado de apps. Tu subes tu código fuente al sitio web, y el sitio web compilará tus apps para las plataformas que le indiques, con CERO setup de tu parte.
● Eso se traduce a que puedes generar apps de iOS desde tu máquina windows.
Phonegap Builder● O que, cómo diseñador, no tienes que instalar y
configurar una máquina virtual windows para poder compilar para Blackberry.
● En realidad, es la panacea, te ahorra un mes o mas de configuración o mas para todas las herramientas de programación.
● Puedes hacer deployment directo para muchas de las plataformas desde la misma página del Phonegap builder: perfecto para el testing o incluso para publicar algunas apps en OS que soporten instalaciones OTA.
Phonegap + Windows Phone● El proyecto Cordova implemento el core y los
conectores de Phonegap a la plataforma Windows Phone.
● Puedes ir directamente a google y buscar “cordova phonegap” para bajar el código.
● En tu máquina windows, bajas las herramientas de programación de Windows Phone: ● Visual Studio Express para Windows Phone● Cordova como un plugin● Emulador de Windows Phone
Creando una app nueva
Click en “New project”-> Cordova Starter
Veras algo como esto
Internals
La magía de www● Todo tu código HTML/CSS estará en el
directorio www de la aplicación.● Nota que existe un archivo llamado “cordova-
1.7.0.js” que es el javascript que esta enlazando tu HTML con los “conectores” nativos de cada plataforma.
● Ten cuidado: no todos los conectores funcionan en todas las plataformas, ni todos los conectores podrían funcionar igual. Si quieres darle soporte a múltiples plataformas, tienes que probar en cada una.
WP tutorial● Acelerometro● Notificaciones● Camara● Contactos ● GPS● Archivos● Multimedia
Acelerometro
function watchAccel(){
if(timer == null){
timer = navigator.accelerometer.watchAcceleration(onAccellUpdate,onAccelError,{frequency:50});
}
}
● Se exponen funcionalidades propias del device a través de llamadas de Javascript 'incrustradas' en el código HTML5.
● La magía la hace código nativo.
GPSfunction onDeviceReady()
{
var funk = function(position){
callback(position.coords.latitude, position.coords.longitude);
};
var fail = function(error){
alert("error :: " + error);
}
intervalID = navigator.geolocation.watchPosition(funk,fail);
window.addEventListener("unload",onWindowUnload,false);
}
● Puedes “cargar” código a la ventana actual, reaccionando a eventos del device correctamente (incluso en caso de fallo).
● El acceso al GPS es a través de un módulo nativo que reporta a través de js
Jugando con Phonegap● Phonegap puede usar
bibliotecas varias de JS, por lo que es relativamente sencillo integrarlo con cosas como Sencha y otros.
● ProcessingJS es un sistema de creación de arte multimedia basado en HTML5 y JS.
● Puedes combinar ProcessingJS con Phonegap y terminar con una app altamente interactiva, sin tanto dolor.
● Processingjs.com● Ejemplo:
https://gist.github.com/2731560
Conclusiones● Phonegap es un
framework que nos permite tener acceso a varias plataformas basandonos en el mismo conocimiento común: HTML5, CSS, Javascript.
● Es rápido de desarrollar para los expertos en web.
● Te ayuda a generar apps relativamente sencillas, ilustrativas, informativas; normalmente, no lo usaras para la creación de apps que requieran alto rendimiento.
● Útil para la creación de prototipos.
Preguntas – Gracias - Contacto● Mauro Parra-Miranda● @mauropm● [email protected]● Gracias por escuchar,
y un millón de gracias por preguntar. :-)