El documento resume las herramientas y conceptos necesarios para crear aplicaciones multiplataforma, incluyendo HTML, CSS, JavaScript, PhoneGap y el uso de una vista web. Explica cómo configurar el entorno de desarrollo en Eclipse y Android SDK y da un ejemplo simple de una aplicación estática usando jQuery Mobile. Finalmente, cubre temas como depuración en Chrome, uso de Git y firmado de aplicaciones.

1. taller solidario

2. Indice
• Porqué app multi-plataforma
• HMTL, CSS, JavaScript
• Web View
• Arquitectura App estática
• Ejemplo: App sencilla Jquery UI
• Debug Chrome
• PhoneGAP
• Generación del fichero de mi aplicación (PhoneGap)
• Configuración Git

3. Herramientas
• Eclipse
• Eclipse Git View: http://download.eclipse.org/egit/updates
• Google Chrome
• SDK Android
• Eclipse ADT

4. App cross platform
Gratis
* contratando los servicios anteriores
http://www.gartner.com/newsroom/id/2017015

5. App cross platform
http://www.businessinsider.com/mobile-platform-market-share-2012-8

6. App cross platform
The BIG Problem
Objetive-C Java .Net Java ME

7. App cross platform
Costes
Tabla: Salario (€/año) programador junior
Gratis
* contratando los servicios anteriores
http://www.getacoder.com/projects/app_for_android_or_apple_156601.html

8. App cross platform
http://www.youtube.com/watch?v=Yq6RC-pfzwo (6:30-11:57 )

9. HTML, CSS, JS
Estructura Diseño Programación
“vida”
Ej.: Código fuente

10. App cross platform
Web view

11. Arquitectura App estática
HTML CSS JS
Web View
cliente Librerías Nativas

12. Arquitectura App estática
HTML
CSS
JS
servidor
Gratis
* contratando los servicios anteriores
Ficheros relacionados

13. Arquitectura App estática
cliente
Gratis
* contratando los servicios anteriores
servidor

14. Preparando el entorno
Eclipse: compartido en dropbox o bajar página eclipse
SDK : http://developer.android.com/sdk/index.html
• Use an existing IDE
• Install sdk manager
•Desde ECLIPSE obtener el componente ADT
Help > Install New Software.
https://dl-ssl.google.com/android/eclipse/
Indicar dirección de instalación del SDK

15. Phone GAP
Gratis
* contratando los servicios anteriores

16. Phone GAP

17. Phone GAP
Gratis
* contratando los servicios anteriores
http://www.youtube.com/watch?v=u6YBDqIFlvg (15:40-25:00 )

18. Configuraciones
Eclipse & SDK Manager:
1. Crear Android Project
2. App name & package
3. Crear dispositivo virtual
4. Crear config debug/run
5. /res/values/string.xml “primer paso”
6. Run (emulador)

19. Configuraciones
Phone GAP: phoneGAP/download
Getting started  http://docs.phonegap.com/en/1.7.0/
1. Descomprimir carpeta
2. (librerías directorio descomprimido) /libs/android
3. Copiar cordova-2.5.0.jar en /libs
4. Java Build Path: incluir la lib de phoneGAP
5. Crear carpeta assets/www/
6. Crear dentro de /www  /js, /img, /css /html
7. Copiar /js el api de cordova-2.5.0.js

20. Configuraciones
Getting started  http://docs.phonegap.com/en/1.7.0/
8. Incluir /phoneGAP2.5/xml en proyecto /res config.xml (abrir)
9. Permisos PHONEGAP vs HW mobile: AndroidManifest.xml
10. Soportar cambio orientación

21. Configuraciones
Getting started  http://docs.phonegap.com/en/1.7.0/
Programar!
• Crear la página de index de docs.phonegap
Clase DroidGap según guía de phoneGAP
Chrome: file:///C:/mobile/taller/ejemplos/example/assets/www/html/index.html

22. Ejemplo: App estática sencilla

23. Debug Chrome
file:///C:/mobile/taller/ejemplos/com.taller/assets/www/html/index.html
* contratando los servicios anteriores

24. Ejemplo: App estática sencilla
http://jquerymobile.com/demos/1.2.1/
Toolbars >NavBars
http://jquerymobile.com/demos/1.2.1/docs/buttons/buttons-icons.html

25. Ejemplo: App estática sencilla

26. Create keystore to sign the app
Android Tools >
Export signed application package >
Create new keystore millave.keystore
keytool -genkey -v -keystore myKey.keystore -alias mykey -keyalg RSA -validity 10000
http://developer.android.com/tools/publishing/app-signing.html

27. Git
Who is using Git

28. Phone GAP

29. Phone GAP
https://github.com/ccoenraets/EmployeeDirectory
http://employeedirectory.org/app/index.html

30. Phone GAP

31. info@trustparency.es
+34 910 004 784