Instalación Phonegap en Eclipse

Muy buenas, vamos a ver cómo utilizar Phonegap con el IDE Eclipse.

Bien, Phonegap es un framework que nos permite crear apps para dispositivos móviles (Android, iOS…) en html, css y javascript.

Lo primero que debemos hacer es descargarnos el archivo aquí:

A partir de ahora explicaré como instalarlo para Android, si buscas sobre otra plataforma, en su página oficial hay un pequeño manual 😉

Suponemos que tenemos Eclipse y Android sdk instalados, si no es así, una entrada de este mismo blog explica cómo hacerlo ;).

Primero creamos un nuevo proyecto Android como lo hacemos normalmente.
En el directorio del proyecto creado, creamos los siguientes directorios: /libs y assets/www.
Copiar cordova-2.0.0.js de la carpeta descargada anteriormente (Android) a assets/www.
Copiar cordova-2.0.0.jar a /libs.
Copiar el directorio xml (También de la carpeta Android) a la carpeta res de nuestro proyecto.

Ahora añadiremos el archivo .jar (libreria) al proyecto de eclipse, para ello, picamos con el boton derecho sobre el proyecto y damos a propiedades, a continuación, Java build path y añadimos un jar externo (cordova-2.0.0.jar de nuestro directorio phonegap descargado).

Nuestro proyecto debería quedar así (si vemos que en el árbol de directorios no nos aparecen todos los archivos, botón derecho y refrescar)
Proyecto

Sigamos, ahora en AndroidManifest.xml debemos añadir las siguientes lineas entre

<uses-sdk.../> y <application.../>
<supports-screens
    android:largeScreens="true"
    android:normalScreens="true"
    android:smallScreens="true"
    android:resizeable="true"
    android:anyDensity="true" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<uses-permission android:name="android.permission.BROADCAST_STICKY" />

Fijaos en que damos muchos permisos a la aplicación, borremos los que no deseamos antes de subir a Google Play 😉

Ahora, para soportar los cambios de orientación, en la etiqueta

<activity>

pegaremos el siguiente código:

android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale"

Bien, ahora, empecemos a jugar… 😉

En la imagen anterior, en la actividad principal veréis que la actividad, al crearse, carga un archivo index.html, ese archivo es el que utilizaremos 😉

Al principio no existe, pero vamos a crearlo, y simplemente pegamos las siguientes lineas:

<!DOCTYPE HTML>
<html>
<head>
<title>Cordova</title>
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

Ahora corremos la app y voilá, ya tenemos nuestra primera app Android con html 😀

Espero que os haya resultado de ayuda.

HackSaludos!!

Anuncios

Acerca de Darkvidhck

Estudiante de ingeniería informática, haciendo mis pinitos como desarrollador web, programador, gamer y Linuxero. Aficionado a la seguridad. Eterno viciado al conocimiento.
Esta entrada fue publicada en Programación y etiquetada , , , . Guarda el enlace permanente.

Una respuesta a Instalación Phonegap en Eclipse

  1. El penas dijo:

    jejeje, que aparato que estas hecho.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s