Uso del GPS en Android con Cordova

phonegap
En esta guía se pretende explicar la manera de obtener la posición actual del dispositivo Android (coordenadas latitud, longitud), haciendo uso de la API del GPS de cordova (phonegap).

Contenido
Introducción ........................................................................................................................................ 2 Requisitos ............................................................................................................................................ 2 Creando la Aplicación: ......................................................................................................................... 3 Obtener información GPS ................................................................................................................... 5 Permisos Android: ........................................................................................................................... 5 Probar Aplicación ................................................................................................................................ 7 Bibliografía ........................................................................................................................................ 10 Anexos ............................................................................................................................................... 11 Abrir proyecto de Android desde Eclipse ...................................................................................... 11

Introducción
En esta guía se pretende explicar la manera de obtener la posición actual del dispositivo Android (coordenadas latitud, longitud) , haciendo uso de la API del GPS de cordova (phonegap).

Requisitos
   Tener Instalado y configurado NodeJs (NodeJs.org). Tener instalado y configurado Cordova (Apache Cordova) Tener instalado y configurados Android (SDK) (Android SDK, Guía Instalación Android).

Creando la Aplicación:
En este paso se procede a crear la aplicación por medio de comandos en la terminal (por opciones de “pereza”, las siguiente imágenes fueron tomadas de un tutorial anterior, por ende las imágenes no reflejan lo escrito).  Abril la terminal, para eso vamos al menú inicio y en el cuadro buscar digitamos CMD, luego abrimos el programa encontrado

Creamos la aplicación con los comandos de cordova:

En este caso se creó una aplicación llamada GpsCordova (cambiar LectorQr por GpsCordova en la imagen).  Cambiamos de carpeta, dirigiéndonos a la anteriormente creada (cambiar LectorQr por GpsCordova en la imagen).

Agregamos la plataforma de Android al proyecto

Compilamos la aplicación

Obtener información GPS
Para obtener los datos de latitud y longitud en Cordova, nos basta con llamar a una función JavaScript llamada getCurrentPosition (existen otras alternativas que pueden consultar en la documentación oficial (PhoneGap)) <script type="text/javascript"> function probarGps() { navigator.geolocation.getCurrentPosition(probarGpsonSuccess, probarGpsonError); } function probarGpsonSuccess(position) { alert('Latitude: ' + position.coords.latitude + '\n' +'Longitude: '+ position.coords.longitude + '\n' +'Altitude: ' + position.coords.altitude + '\n' + 'Timestamp: '+ new Date(position.timestamp) + '\n'); } function probarGpsonError(error) { alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n'); } </script> En el código anterior, existen 3 funcion javascript:   probarGps(): Esta función es llamada al momento de dar clic en el botón y se encarga de obtener la posición actual del dispositivo probarGpsonSuccess(position): Esta función es llamada luego de obtener la posición del dispositivo y como parámetro recibe un objeto position, que nos dara luego las coordenadas probarGpsonError(error): Esta función es llamada si existe algún error al intentar obtener la posición del dispositivo

Permisos Android:
Para poder probar la aplicación, debemos colocar en el manifiesto de Android los permisos necesarios para poder acceder al GPS del dispositivo, para ello debemos abrir el proyecto de Cordova en Eclipse (ver anexos). Abrimos el archivo AndroidManifest.xml en eclipse y agregamos un nuevo permiso

Luego de seguir los pasos descritos en la imagen, guardamos todos los cambios

Probar Aplicación
Ahora debemos correr nuestra aplicación para poder probar el código y determinar si funciona. Primero debemos agregar un botón y las funciones javascript al index.html de la carpeta www del proyecto creado con Cordova. Para poder hacer esto, abrimos el archivo anteriormente indicado con nuestro editor de texto favorito (bloc notas, notepad++,etc) y pegamos el siguiente código

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=deviceheight, target-densitydpi=device-dpi" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> <title>Hello World</title> </head> <body> <div class="app"> <h1>Gps Cordova</h1> <div id="deviceready" class="blink"> <p class="event listening">Device is Ready</p> <input name="btnGps" type="button" id="btngps" value="Probar Gps" onClick="probarGps()"> </div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> <script type="text/javascript"> app.initialize(); function probarGps() { navigator.geolocation.getCurrentPosition(probarGpsonSuccess,probar GpsonError); } function probarGpsonSuccess(position) { alert('Latitude: ' + position.coords.latitude + '\n' +'Longitude: '+ position.coords.longitude + '\n' +'Altitude: ' +

position.coords.altitude + '\n' + 'Timestamp: '+ new Date(position.timestamp) + '\n'); } function probarGpsonError(error) { alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n'); } </script> </body> </html>

Ahora compilamos el proyecto desde la consola

Ejecutamos el código en Android

Aquí pueden ver imágenes de la aplicación corriendo en un Samsung Galaxy Nexus.

Bibliografía
PhoneGap. (s.f.). PhoneGap Documentation-Geolocation. Recuperado el 7 de 10 de 2013, de http://docs.phonegap.com/en/1.2.0/phonegap_geolocation_geolocation.md.html

Anexos
Abrir proyecto de Android desde Eclipse
Abrimos Eclipse, y luego creamos un nuevo proyecto, para eso damos clic en File -> New -> Project…

Creamos un nuevo proyecto de Android desde código existente

Damos clic en Browse… y nos dirigimos a la carpeta donde está el proyecto, una vez ubicados hay vamos a la carpeta platforms y damos clic en Aceptar

Escogemos el proyecto y damos clic en finalizar