jueves, 26 de junio de 2014

Primera app con phonegap

Voy a explicar a continuación, como comenzar a trabajar con phonegap:

- Lo primero, es descargarse el paquete para eclipse.


- Seguidamente, en eclipse, creamos una aplicación android convencional, añadimos el icono de la app, nombre, nombre del paquete (atención: no dejar com.example porque te va a dar problemas para colgarlo en el market).

- Después, en el paquete phonegap descargado previamente, accedemos a /phonegap-2.7.0/lib/android. En la carpeta "Android" encontraremos el fichero "cordova-2.7.0.js", pulsaremos con el botón derecho del ratón sobre él y seleccionamos "Copiar":



- Desde nuestro proyecto Android en Eclipse, abrimos la carpeta "assets" y pegaremos el fichero en la subcarpeta "www".

-Ahora volveremos a la carpeta descomprimida de la descarga de PhoneGap, desde lib/android, pulsamos con el botón derecho del ratón sobre el fichero "cordova-2.7.0.jar", seleccionamos "Copiar".

-Desde Eclipse, abriremos la carpeta "libs" en "Project Explorer", pulsaremos con el botón derecho sobre "libs" y seleccionaremos "Paste".

-Volvemos otra vez a phonegap -> xml y la copiamos en res.


-Añadimos la librería .jar de PhoneGap (cordova-2.7.0.jar) al proyecto, para ello pulsamos sobre la carpeta "libs" en "Project Explorer" con el botón derecho, seleccionamos "Build Path" - "Configure Build Path":



-Seleccionamos "Java Build Path", en la parte derecha abrimos la pestaña "Libraries" y pulsamos el botón "Add JARs":


-Desplegamos la carpeta "libs", seleccionamos "cordova-2.7.0.jar" y pulsamos "OK".

-Ahora para hacer una pequeña app de prueba, modificamos el .java por el siguiente, para que la aplicación no inicie el activity anterior sino que lance un fichero HTML correspondiente al proyecto PhoneGap. Para ello añadimos el siguiente código:
package com.prueba.phonegap;

import android.os.Bundle;
import org.apache.cordova.*;

public class MainActivity extends DroidGap 
{
 @Override
 public void onCreate(Bundle savedInstanceState) 
 {
  super.onCreate(savedInstanceState);
  super.loadUrl("file://android_asset/www/index.html");
 }
}

- Crearemos el fichero "index.html" que será el que lanzará la aplicación, con formato HTML, para ello, desde la carpeta "assets/www".

- Y el resultado es:




OJO: Con PhoneGap no se puede usar PHP, sólo lenguajes que se ejecutan en el cliente.

No hay comentarios:

Publicar un comentario