Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Devfest Lima2012

2,113 views

Published on

https://github.com/ykro/devfestlima2012-phonegap

Published in: Technology

Devfest Lima2012

  1. 1. Aplicaciones multiplataforma conPhoneGap y jQuery Mobile Adrián Catalán adriancatalan@elementalgeeks.com @ykro
  2. 2. ¿quénecesitamos?
  3. 3. Código enhttps://github.com/ykro/devfestlima2 012-phonegap
  4. 4. • Eclipse Classic 4.2.1 –http://www.eclipse.org/downloads /• Android SDK –http://developer.android.com/sdk/ installing/index.html• ADT Plugin –http://developer.android.com/sdk/ installing/installing-adt.html
  5. 5. • PhoneGap –http://phonegap.com/download
  6. 6. Creamos un nuevoproyecto de Android dentro de Eclipse
  7. 7. Podemos agregar unícono personalizado y editarlo con algunas opciones
  8. 8. Creamos una actividad nueva ydependiendo de laversión puede ser más complejo
  9. 9. Colocamos los valores deseadospara los datos de laactividad y el layout
  10. 10. Dentro de la estructura delproyecto debenexistir 2 carpetas
  11. 11. /assets/www /libs
  12. 12. Si no existe alguna de ellas es necesario crearla
  13. 13. De la carpeta descargada deCordova buscamos la carpeta /lib/android
  14. 14. Copiamos el archio cordova-2.1.0.js a /assets/www
  15. 15. Repetir el proceso para el archivocordova-2.1.0.jar a /libs
  16. 16. Y también para lacarpeta /xml con destino a /res dentro del proyecto
  17. 17. Es necesariomodificar el archivo de la actividad dentro de la carpeta /src
  18. 18. En vez de heredarde Activity se hará de DroidGap(requiere import)
  19. 19. ReemplazarsetContentView(R.layo ut.main); porsuper.loadUrl("file:///android_asset/www/i ndex.html");
  20. 20. Si Eclipse muestra algún error de referencias esnecesario limpiar el proyecto
  21. 21. Si el errorpermanece agregar la librería (.jar) al Build Path
  22. 22. Click derecho en el proyecto y luego “Configure Build Path”
  23. 23. De la pantalla de configuracióntomar la opción “Add JARs”
  24. 24. Y luego elegir elJAR de Cordova
  25. 25. Luego editar el archivoAndroidManifest.x ml
  26. 26. Haga click derecho sobre elarchivo, seleccione “Open With” yluego “Text Editor”
  27. 27. En la parte que dice <!-- agregar permisos -->agregar el siguiente contenido
  28. 28. En el mismo archivo modificar la actividad creada y agregue una nueva actividad comose indica a continuación
  29. 29. En la carpeta/assets/www agregar un archivo nuevollamado index.html ycolocar contenido de prueba
  30. 30. <html> <body><h1>Hello World</h1> </body> </html>
  31. 31. Ejecutar y ver elresultado en el emulador
  32. 32. Usando el API de Instagram http://instagram.com/developer/
  33. 33. Usando jQuerymobile y mapas http://code.google.com/p/jquery-ui-map/
  34. 34. Código enhttps://github.com/ykro/devfestlima2 012-phonegap
  35. 35. ¿preguntas?
  36. 36. Aplicaciones multiplataforma conPhoneGap y jQuery Mobile Adrián Catalán adriancatalan@elementalgeeks.com @ykro

×