Aprende a Publicar Con Apache Cordova Hacia Android

download Aprende a Publicar Con Apache Cordova Hacia Android

of 50

Transcript of Aprende a Publicar Con Apache Cordova Hacia Android

  • Aprende a publicar con Apache Cordova

    hacia Android, Windows 8 RT y otros Posted on 09/09/2013 by profesorAntonio Posted in Personal 1 Comment Hola, haca tiempo que no escriba un tutorial. Pero estbamos en un proceso de transicin

    informtica, que aun no termina, pero ya casi rompemos el cascaron. (aparte tambin mis problemas

    existenciales y legales, etc).

    Ahora vamos aprender a transportar un proyecto web (HTML 5, JavaScript, CSS 3), mediante

    Apache Cordova a distintos entornos, como pueden ser: Una aplicacin para dispositivos mviles,

    una aplicacin para escritorio en Windows 8 y as.

    Apache Cordova

    La pgina oficial de Apache Cordova, es:

    http://cordova.apache.org/

    Tambin tiene un hijo mal parido, tipo cloncito y de la onda de quien fue primero, si el huevo o la

    gallina, que se llama PhoneGap, cuya pgina oficial es:

    http://phonegap.com/

    Lo primero por hacer ser descargar el archivo de Apache Cordova, pero si lo descargamos de la

    pgina oficial, solo traer los .java, que habr que pasar por ANT y cosas as de la onda de yaba Pero si lo hacemos desde la pagina de PhoneGap, traer los archivos JAR y dems mas ad-hoc, para

    los flojos como yo.

  • El link para descargar la versin 2.9 directo es este:

    https://github.com/phonegap/phonegap/archive/2.9.0.zip

    Pero si ya lees este tutorial en un futuro post apocalptico, pues visita la pgina oficial para

    encontrar una versin ms reciente:

    http://phonegap.com/install/

    Entonces, proceders a tener lista tu aplicacin web, funcionando. Yo aqu el ejemplo lo dar con

    un simple hola mundo. Pero el procedimiento para crear aplicaciones nativas para dispositivos mviles o de escritorio, es igual.

    Empecemos con un hijo mal parido de UNIX: Android.

    Despus debers descargar el Eclipse ADT (aka: Android Developers Tools), el cual servir para

    poder crear los archivos APK, desde ah, con una facilidad suavecita, que hasta la sobrina tal vez, tuviera una nano-oportunidad de lograr hacer uno (y a lo mejor el to, asistido por alguien tambin lo logre).

    Aqui el link para descargarlo:

    http://developer.android.com/sdk/index.html#download

    Una vez descargado(lo instalaremos -si como no-, (eso ni que fueran frijoles en red: Net Beans).

    bueno simplemente lo ejecutaremos el programa.

    Eclipse ADT

    Despus nos pedir el espacio de trabajo para trabajar, -obvio, no-.

  • Seleccionar Workspace

    Entonces nos marcara un error, este error, se produce porque no encuentra el directorio con los archivos con el SDK necesarios para programar en Android.

    Error de SDK no encontrado

    Si lo hiciramos de la manera tradicional y yabaera, tendramos que descargar los SDKs, mediante

    el SDK Manager.exe y escoger una de las 15 opciones de Android lo cual si esta de web@ Cuando trabaja con Apache Flex, no era necesario ms que descargar la 2.x.x y listo pero bueno, los yabaeros, les gusta complicarse la vida.

    La mejor parte? Al descargarte el Eclipse ADT, ya te descargaste todo lo necesario, as que solo

    necesitaremos indicarle a Eclipse ADT, donde esta lo que no encuentra:

    Seleccionar SDKs

    No es otra ms que la carpeta SDK que est en el archivo zip del Eclipse ADT, que ya

    descomprimiste, si no, no te lo pedira

  • Seleccionar Carpeta

    Una vez hecho esto, Eclipse ADT se pone contento y procede a abrir el workspace, si la pantalla no

    se parece, solo cierra la de Welcome:

    Espacio de Trabajo

    Ahora, vamos a indicarle que los archivos los guarde en formato UTF-8, para asegurar ver bien

    estos caracteres: A . Por lo que hay que ir al men Window y ah a Preferences:

  • Preferencias de Eclipse ADT

    Nos abrir una ventana de preferencias:

    Ventana de Preferencias

    Dentro de esa ventana, escogeremos la opcin de General y luego Workspace, dentro de esa

    ventana escogeremos en la parte que dice: Text File Encoding: Other -> UTF-8

    Archivos con UTF-8

    Le daremos clic en Ok hasta cerrar la ventana de prefencias.

  • Ahora continuaremos con la creacin del proyecto, por lo cual nos iremos al men de New y luego

    Android Application Project.

    Crear Proyecto de Android

    Nos pedir un Application Name, yo para este ejemplo escog: holaCordova, los otros input se

    llenan en automtico, y los combos, pondremos esos por el momento. Daremos clic en Next:

    Nombrar proyecto

    Luego nos preguntara si creara algunos archivos por default, lo mejor es que si, as que veremos que

    todo este como en la imagen y daremos clic en Next:

  • Configuracin de Proyecto

    Luego nos pregunta si le ponemos un iconito a la aplicacin, por default, trae los de casa:

    Icono por default

    Nosotros daremos clic en BROWSE para buscar uno ms ad-hoc a nuestra aplicacin (recomiendo

    usar una imagen PNG de 512 x 512 pixeles transparente:

  • Icono Personalizado

    Luego nos pregunta el tipo de Activity (Android, nombra as las vistas que se muestran en el dispositivo, si vienes de Apache Flex, es el smil a las views). Yo aqu escoger la de Blank, porque no me importa el tipo de vista, pues esta estar regida por mi HTML. Damos clic en NEXT:

    Tipo de Activity de Android

    Nos preguntara como se llama nuestra Activity principal, es decir la que ser invocada al abrir la aplicacin. Yo le puse por nombre PrincipalActivity y Android, llena el segundo nombre en

    automtico, daremos clic en FINISH:

  • Nombre de la Actividad Principal

    Comenzara a realizar mucho ruido, generar un montn de archivos, por aqu y por all (ya saben es

    yaba style), y al final nos dejara desplegada nuestra Activity:

    Proyecto de Android listo

    Ahora vamos a crear unas carpetas necesarias para TRAER nuestra aplicacin web As que en la carpeta de assets daremos clic derecho y escogeremos: New -> Folder.

  • Creacin de Carpeta

    Crearemos una carpeta de nombre www y daremos clic en FINISH:

    Carpeta www

    Entonces quedara ahora la estructura de carpetas de nuestro proyecto:

  • Estructura de Carpetas

    Ahora tendremos que copy pastear el archivo JAR del que hablamos antes, de la carpeta que nos

    descargamos, veremos que este el archivo cordova-2.9.0.jar (o la versin que exista cuando ests

    leyendo este tutorial en el futuro).

    Archivo JAR de Cordova

    As que en Eclipse daremos clic derecho sobre la carpeta de libs y escogeremos PASTE:

  • Pegar archivo JAR

    Entonces quedara ahora la estructura de carpetas de nuestro proyecto:

    Estructura de Carpetas

    Como es una librera externa a la creacin original del proyecto, tendremos que indicarle a Eclipse

    ADT, que la incluya en la generacin de la aplicacin, entonces daremos clic derecho sobre el

    archivo, y escogeremos Build Path -> Add to Build Path:

  • Agregar al Build Path

    Y ahora aparecer en la libreras referenciadas:

    Estructura de Carpetas

    Ahora vamos agregar un archivo con parametros de configuracin: config.xml

    Este se encuentra en la carpeta xml del archivo zip, entonces nos copiaremos dicho carpeta:

  • Archivo XML de configuracin

    La pegaremos en la carpeta xml que esta dentro de la carpeta res de nuestro proyecto, con clic derecho y Paste:

    Pegar en carpeta xml dentro de res

    Entonces quedara ahora la estructura de carpetas de nuestro proyecto:

    Estructura de Carpetas

    Ahora crearemos un par de carpetas dentro de www para importar los archivos js de Apache

    Cordova, as que sobre ella seguiremos el procedimiento empleado con anterioridad:

    Creacin de carpetas js

    Crearemos una carpeta js y luego una libs dentro de ella (aunque la de libs no es muy necesaria,

    solo es recomendacin).

    Entonces quedara ahora la estructura de carpetas de nuestro proyecto:

  • Estructura de Carpetas

    Buscaremos el archivo cordova.js dentro de la carpeta zip, y lo copiaremos para pegarlo en donde

    dijimos:

    Archivo cordova.js

    Entonces con un clic derecho sobre libs, escogeremos Paste:

  • Pegado en carpeta js

    Entonces quedara ahora la estructura de carpetas de nuestro proyecto:

    Estructura de Carpetas

    Ahora en la carpeta www, yo creare un archivo HTML con un clic derecho y escoger New ->

    Other Si tu estas trayendo tu proyecto web terminado, es aqu donde lo vas a pegar (Si pegas archivos php,

    asp o jsp aqu, entonces ests haciendo algo mal, porque esos van del lado del servidor, no del lado

    del cliente, en una aplicacin web).

    La recomendacion seria, dejar este proyecto con un hola mundo primero, y luego ya que funcione, copy pastear todo tu proyecto:

    Creacin de archivo de prueba

    Escoger General -> File y dar clic en NEXT:

  • Creacin de archivo Nuevo

    Me preguntara por el nombre, le dar el de:

    index.html Ese si es innamovible e inmutable, en el nombre. Dare clic en FINISH:

    Archivo index.html

    En el caso de trabajar con el Eclipse ADT, no tendra las WTP de Eclipse entonces, me abre el

    explorador al crear el archivo:

  • Archivo abierto en el Web Browser

    As que la cerrare la pestaa y simplemente dar clic derecho y Open With text editor. Para que me

    abra el cdigo fuente, y a continuacin teclearemos lo siguiente:

    Codigo fuente de index.html

    Guardamos el archivo y ahora hay que modificar un archivo que se llama:

    PrincipalActivity.java

    (si has seguido las indicaciones al pie de la letra, de otra forma, el archivo tendr el nombre que le

    diste a la actividad principal).

  • Archivo PrincipalActivity.java

    Modificaremos el extends, para que ahora diga:

    extends DroidGap

    Con esto tambin nos importara la librera:

    org.apache.cordova.DroidGap;

    Extendiendo DroidGap

    Luego comentaremos la lnea que dice:

    //setContentView(R.layout.activity_principal);

    Y agregaremos esta:

  • super.loadUrl(file://android_asset/www/index.html);

    Con eso, no cargaremos el activity, si no la pagina index.html al iniciar la aplicacion.

    Indicando cargar index.html

    Ahora el mtodo onCreate, le cambiaremos la visibilidad a public para que el HTML, pueda ser invocado sin problemas:

    Cambiando visibilidad a public

    Luego comentaremos la lnea de:

    //import android.app.Activity

    Pues ya no la necesitaremos:

  • Comentareando android.app.Activity

    Ahora vamos a modificar el AndroidManifest.xml dando clic derecho sobre l, escoger Open With -

    > Android Common XML Editor:

    Abriendo AndroidManifest.xml

    Con lo cual tendremos el archivo XML:

  • Archivo AndroidManifest.xml

    Agregaremos la etiqueta de :

  • android:configChanges = orientation|keyboardHidden

    Para tener mostrar/ocultar el teclado de manera adecuada:

    Modificando etiqutea activity

    Ahora vamos a crear una configuracin para hacer el debbug a nuestra aplicacin, asi que sobre el

    bug (bicho verde), escogeremos Debug Configurations:

    Preparando el debbuger

    En las opciones que tenemos para debugear, escogeremos la de Android Application y con clic

    derecho escogeremos New:

  • Crear nueva configuracin para el Debuger

    Nos permitir escoger un nombre para ese perfil de Debugeo, as como el nombre del proyecto y

    tambin si queremos escoger lanzar la Activity por default o alguna otra Activity para lanzar (e

    inclusive no hacer nada, no pregunten). Damos clic en DEBUG:

    Configurando el Debuger

    Como no tenemos un AVD (Android Virtual Device), o sea un emulador de un dispositivo Android, habra que definir uno, damos clic en YES:

    Sin un AVD (Android Virtual Device)

    Ahora tendremos una venta para escoger un AVD, o incluso un dispositivo mvil conectado va

    USB a nuestra computadora, vamos a intentarlo primero con uno Virtual. Daremos clic en:

    Launch a new Android Virtual Device:

  • Escoger un AVD (Android Virtual Device)

    Y luego daremos clic en Manager, para crear uno (o escoger entre los perfiles existentes):

    Crear un AVD (Android Virtual Device)

    Hay dos pestaas, la que dice:

    Device Definitions

    Nos lista una serie de dispositivos mviles que funcionan con el SO Android:

    Lista de AVD predefinidos

  • En la pestaa que dice:

    Android Virtual Devices

    Nos lista la serie de dispositivos mviles que tenemos definidos dentro de nuestro Workspace de

    Eclipse ADT, daremos clic en NEW:

    Creando un AVD personalizado

    Nos abrira una ventana, le pondremos un sobrenombre a nuestro Android Virtual Device (AVD), escogeremos uno base del primer combo, los demas valores se los pone por default (lo cual es recomendable, pues es la configuracion de fabrica del dispositivo, sin tunearlo), daremos clic en

    OK:

    Personalizando un AVD (Android Virtual Device)

    Ahora tendremos un AVD listado, solo lo seleccionaremos de la lista y daremos clic en START:

  • Iniciar un AVD (Android Virtual Device)

    Nos preguntara si re escalamos la densidad de los pixeles o simplemente lo dejamos tal cual va,

    dependiendo de la densidad del monitor de tu computadora, podras o no optar modificar estas

    opciones, por lo mientras, la primera vez, es dejarlo asi (y solo despues jugar a prueba y error con

    estos valores), daremos clic en LAUNCH:

    Personalizar lanzamiento de un AVD (Android Virtual Device)

    Nos mostrar el progreso de crear el emulador para el AVD

    Por qu un emulador, para un emulador?

    Yo este ejemplo lo hice en un Windows a 64 bits, y Android es un Sistema Operativo hijo mal

    parido de Unix. Entonces, primero tiene que crear un Sistema Operativo Virtual de Unix:

  • Lanzamiento del AVD (Android Virtual Device)

    Y despus de que este quede listo, entonces lanzara el emulador del AVD sobre este:

    AVD iniciando

    La primera vez que lo hace, se tarda desde un buen, hasta horrores, dependiendo de que tal ande tu

    RAM, Disco Duro, Procesador y duendes informticos en tu PC:

  • La primera vez del AVD, es lenta su iniciacin

    Al terminar nos dejara el SO Android, listo para recibir la aplicacin, lo cual estar bien:

    AVD (Android Virtual Device) listo para usarse

    As que terminaremos cargando nuestra aplicacin sobre este AVD, recin creado, lo escogeremos

    sobre la primera lista, y daremos clic en OK:

  • Escoger el AVD para lanzar nuestra aplicacin en el

    Si vas a debugear mucho, recuerda, que el AVD, puede quedar en segundo plano trabajando (para ahorrarte todo ese tiempo que tardo en levantar).

    Si vas a debugear y tienes rutas a servicios web del tipo:

    http://localhost/

    http://127.0.0.1/ debes cambiarlas a

    http://10.0.2.2/ Porque el localhost no sirve directamente en el AVD.

    Al principio que nuestra aplicacin se monta sobre el AVD, mostrara una aviso de que est

    esperando por el debbuger.

    Esto no debe tardar mucho en cerrarse solo:

    Esperando por el Debuger

  • Luego remover solito ese aviso, y si no tienes splash screen, mostrara la clsica pantalla blanca:

    Aplicacin sin splash screen iniciada

    Por ltimo, tenemos nuestra aplicacin web, corriendo con ayuda de Apache Cordova, desde el SO

    Android:

    Nuestra aplicacin, lista y ejecutandose en el AVD

    Felicidades, ya la hicimos! En la parte del Eclipse ADT, habr una vista que se llama:

    LogCat

  • Esa pestaita, es importante tenerle un ojo encima, pues nos mostrara TODO lo que acontece dentro

    de nuestro AVD y de nuestra aplicacin adentro del AVD, todo lo que marque de amarillo, sern

    Warnings, y lo de rojo Horrores:

    El importantisimo LogCat

    Es importante distinguir entre los Errores del AVD y de nuestra aplicacin, as que atentos a ello:

    Si llega a ocurrir un error grave en nuestra aplicacin, el Eclipse ADT, mostrara el aviso para

    cambiar a la Perspectiva de Debug, daremos clic en YES

    Aviso de Error en nuestra aplicacin

    Y nos mostrara la pantalla con el debbug con los errores de nuestra aplicacin:

    Perspectiva del Debuger

    La aplicacin tambin puede caerse como cualquier otra aplicacin dentro de Android:

  • La aplicacin se puede caer como cualquier otra aplicacin

    No te preocupes es normal, para eso es el debbug.

    Bueno, hasta aqu vamos bien, que sucede si queremos realizar un debbug en un telfono con

    Android

    Hay que seguir una serie de pasos:

    1. Cierra el Eclipse ADT, un ratito. 2. Tu telfono en la opcin de desarrollador, deber tener activa esa opcin. 3. Una vez activa la opcin, debers conectarlo al puerto USB, como normalmente lo haces.

    Si reconoce Windows el dispositivo y marca la tarjeta SD del telfono como una unidad de

    Windows extrable, vamos bien, desconecta el telfono, un ratito en lo que hacemos el 4 y

    5:

    4. Ahora con el SDK Manager.exe bajaras en la parte de Extras la opcin de:

    Google USB Driver 5. Y en la parte de Tools, bajaras TODAS las de ah. Esto va a ser un proceso lento 6. Cuando termines, vuelve a conectar el telfono, ahora tu telfono, lo debe reconocer

    Windows y tu telfono reconocer a Windows, en tu telfono aparecer un android chiquito en la barra de notificaciones, avisando que est en modo debbug, listo para la accin.

    (El mismo procedimiento aplica para una tableta con Android, algunos telfonos chinos o tabletas

    chinas, no funcionan para el debugeo, lamentablemente).

  • Entonces volveremos a abrir el Eclipse ADT, nuestro proyecto y lanzaremos el debuger, entonces

    en la lista de dispositivos, aparecer el telfono o tableta configurada en modo desarrollador, la

    escogeremos y daremos clic en OK:

    Dispositivo movil conectado via USB y reconocido

    Nos aparecer todo lo anterior que vimos hasta llegar a la pantalla de nuestra aplicacin, inclusive

    aqu podremos ver el iconito chiquito de android que mencionbamos antes:

    Nuestra aplicacin en un dispositivo fisico y real

    Felicidades, ya la debugeaste en un dispositivo fsico! Si vas a debugear y tienes rutas a servicios web del tipo:

    http://localhost/

    http://127.0.0.1/ debes cambiarlas a

    http://www.algunDominioVerdadero.com/

  • Porque el localhost, ni 127.0.0.1 ni 10.0.2.2 nos sirve en un dispositivo fsico en Android.

    Ahora, yo tengo una tableta china, no me la reconoce el USB con la opcin de debbuger Qu podemos hacer?

    Bueno, crearemos un APK Daremos clic derecho en la carpeta raiz de nuestro proyecto, y escogeremos la opcion de Android

    Tools -> Exported Signed Application Package:

    Creando un APK firmado digitalmente

    Por qu no la de Export Unsigned Application Package?

    Te marca error al querer instalarla, porque no est firmado el paquete. Tambin tu dispositivo Android debe estar activa la opcin dentro de aplicaciones, para aceptar

    aplicaciones que no vengan de la tienda de Android.

    Nos pide seleccionar un proyecto para crear el APK, damos clic en NEXT:

    Escoger proyecto para realizar APK

  • Ahora, nos dara a escoger si usamos una firma digital ya creada o creamos una, daremos crear, le

    asignaremos una ruta y la extension p12, asi como una contrasea y confirmaremos, damos clic en

    NEXT:

    Creando una nueva firma digital

    Nos preguntara nuevamente la contrasea y otros datos, que llevan las firmas regularmente,

    llenaremos todos y daremos clic en NEXT:

    Detallar firma digital nueva

    Nos pedir la ruta a donde guardar el APK que se creara, daremos clic en FINISH:

  • Escoger carpeta destino para el APK

    Dicho archivo APK, no es ms que un archivo ZIP firmado digitalmente con todo lo que nuestro

    proyecto contenga, dicho archivo ya lo puedo colocar va USB a la SD de mi tableta china:

    Archivo APK

    Y de ah instalarlo como cualquier otra APK piratona:

    Despus podremos ejecutarla para hacer las pruebas de debbugeo en una pantallota:

    Aplicacin ejecutandose desde la APK creada

  • Nuestro archivo APK, no es muy pesado, solo genero 1.82 MB, despus de ser descomprimido,

    comparndolo con un ejemplo de AppCelerator que generaba un archivo de 12 MB, Pues es mejor

    usar Apache Cordova, no creen?

    APK generada es ligera de tamao

    Hasta ah est muy bonito el asunto, Pero qu hay de crear una Aplicacin para escritorio? Yo

    utilizo Windows 8 al momento de crear este tutorial, as que me descargue el Visual Studio Express

    2012, lo instalare y ejecutare:

    IMAGEN 81

  • Visual Studio Express 2012

    La primera vez que lo ejecuto, me pide una clave de producto, como todo producto Microsoft, dar

    clic en Registrar en Lnea:

    Solicitud de KEY

    Lo cual nos llevara a un navegador para llenar una pgina con mis datos personales:

    Primera pagina para obtencin de KEY

    Lo cual nos lleva a otra pgina, donde colocare mis datos como estudiante o docente, para que no

    tenga coste la licencia:

  • Segunda pagina para obtencin de KEY

    Y listo, me dar mi clave del producto (tambin te la enva a tu correo):

    KEY obtenido..

    Con lo cual lo colocare en donde me la peda. Y con esto se habilitara el botn de SIGUIENTE:

  • Introduccin del KEY

    Me mostrara que la clave del producto esta correcta, la validara y daremos clic en CERRAR:

    Aceptacin del KEY

    Ahora, pedir una licencia de desarrollador, esta aplica solo cuando queremos publicar una

    Aplicacin en la Windows Store, as que daremos clic en ACEPTO:

  • Obtener licencia de Desarrollador

    Pedir el mismo correo y contrasea que para la Clave del producto, los anotaremos y daremos clic

    en INICIAR SESIN:

    Login para obtener licencia de Desarrollador

    Despus de validar nuestro correo, nos permitir tener una licencia de desarrollador por 30 dias.

    Esta solo sirve para el Windows Store, despus de este tiempo, podremos seguir probando y

    debugeando el proyecto en nuestra PC, pero no subir el mismo al Windows Store:

  • Licencia de Desarrollador obtenida

    Cuando este el Visual Studio abierto, daremos clic en Nuevo Proyecto

    Nuevo proyecto en Visual Estudio

    En la parte de Instalado -> Plantillas -> JavaScript escogeremos la que dice:

    Aplicacin Vaca

    Le pondremos un nombre y una ubicacin, daremos clic en ACEPTAR:

  • Creando proyecto JS

    Ahora nos abrira la aplicacion por default:

    default.js

    Archivo default.js

    Del lado derecho debemos encontrar:

    default.html Y dndole doble clic tendremos que cambiarle el nombre, a:

    index.html

    Cambiando nombre a index.html

    Ahora, debemos encontrar el archivo del lado derecho que dice:

    package.appxmanifiest

    Y cambiarle donde decia default.html por index.html, tambien ahi podemos poner algunas cosas

    para el splash screen y configuraciones para tablets o hibridos (este mismo tutorial, sirve para

    Windows RT):

  • Modificando archivo package.appxmanifiest

    Localizamos el archivo

    cordova.js Que est adentro del archivo zip de cordova, en la carpeta de Windows 8:

    Archivo cordova.js para Windows 8

    Ahora en la carpeta de js, con clic derecho escogeremos la opcion de Agregar -> Elemento

    existente

    Y agregaremos el archivo de cordova.js

  • Agregando archivo cordova.js

    As quedara agregada a nuestro proyecto y podremos utilizarla:

    Archivo cordova.js aadido

    Agregaremos la lnea de script para invocar el archivo cordova.js a nuestra pgina principal:

    index.html

  • Invocacin de archivo cordova.js

    Luego, yo agregue cdigo dentro del body, un h1 para el titulo y un js para agregar un chismoso

    cuando este lista la aplicacin y muestre una alerta:

    Aadiendo codigo JS

    Ahora localizaremos un icono triangular verde con un letrero de Equipo Local al lado,

    Le daremos clic y con eso comenzara a hacer el debug (si se fijan hay opcin para debbug y el tipo

    de CPU x86 o ARM):

  • Lanzando debbuger para Windows 8

    Nos lanzara la aplicacin al tipo metro style y el respectivo Alert que configuramos via js. Damos clic en OK:

    Aplicacin con estilo Windows 8 Metro

    Y nos mostrara la aplicacin principal:

    Aplicacin de Apache Cordova en Windows 8 Metro

    Felicidades, ya la debugeaste en Windows 8 Metro Style! El proceso para realizar la publicacin, no lo tocare aqu, pues en la pgina de Microsoft ya hay un

    buen tutorial para eso

  • http://msdn.microsoft.com/es-MX/windows/apps/jj682079

    Genial, no?

    Comenzamos con una aplicacin web, luego la llevamos a Android, y luego a una aplicacion metro

    para windows 8.

    De la misma manera, podremos llevarla a iOS, a OS X, a BlackBerry, etc Hay muchos tutoriales en la pgina de Apache Cordova para lograr esos objetivos:

    http://cordova.apache.org/docs/en/3.0.0/guide_platforms_index.md.html#Platform%20Guides

    Yo no lo hice aqu, porque no tengo esos hardwares para realizar las pruebas.

    Y abusados con los nombres de sus aplicaciones y los iconos, que pueden no llegar a lucir muy bien

    que digamos:

    La importancia de Iconos y Nombres adecuados

    Espero que sea de utilidad, es para los muy polluelos, por eso, creo que resulto muy largo, y es que

    como lo estoy utilizando en mis clases, es difcil estar platicando todo esto, pero es necesario para

    realizar los jutsus ms avanzados de Apache Cordova.

    Para estar al pendientes de nuevos tutoriales, pues ah tienen mi cuenta de

    twitter:http://twitter.com/profesorAntonio y para quejas, pues a otro lado, porque nadie te obligo a

    leer este blog, feliz cdigo y gracias.

    (Todas las imgenes mostradas aqu son con FINES EDUCATIVOS, cualquier otro uso pdanle un

    chance a Apache Cordova, Google o Microsoft, o cualquier empresa mencionada o aludida en este

    tutorial).