Aprende App Inventor

Buscar en este sitio

Tutoriales >

¿Dónde está mi coche?

Con esta aplicación podremos localizar nuestro coche (o cualquier otra cosa) si de regreso, puede que con una
copichuela de más, no conseguimos recordar dónde lo aparcamos. Esto se consigue mediante el registro de su
ubicación, obtenida con el componente sensor de posición, que utiliza el GPS de nuestro dispositivo y la presentación
de la ruta de regreso al vehículo mediante Google Maps. Lanzaremos Maps mediante ActivityStarter y almacenaremos
la posición usando TinyDB.

¡Advertencia! El sensor de posición sólo da la ubicación real con aplicaciones App Inventor cuando éstas corren ya
empaquetadas en el móvil. Por este motivo, la parte relacionada con la ubicación actual de esta aplcación sólo funciona
de forma efectiva en esas condiciones, y no ni con el emulador, ni con el móvil corriendo la aplicación cargada en el
servidor y con el móvil conectado por cable USB.

Inicialmente, en el diseñador, deberemos colocar los componentes, que se pueden ver en las imágenes
siguientes. Como no se muestran en una sola pantalla, adjunto 2 pantallazos con la barra de desplazamiento del panel
de componentes en posición opuesta, a fin de que se aprecien todos los componentes necesarios. Estos componentes
son:

1. La Screen1, a la que podemos modificar su texto a ¿Dónde está mi coche?

2. Todas las etiquetas que se observan en el Panel de componentes (components) del diseñador. Usaremos esas
etiquetas para presentar la dirección, latitud y longitud, así como textos y el símbolo de grados. A dichas
etiquetas os recomiendo modificarles el nombre como se observa, así os resultará más fácil la fase de
ensamblado de bloques. Como aclaración, aquéllas que terminan con AC hacen referencia a la posición actual
(por ejemplo, LBlatAC se refiere a la Label (etiqueta) donde mostraremos la latitud de la ubicación actual). Por el
contrario, las que terminan con ME se refieren a los elementos memorizados por el dispositivo  (por ejemplo,
LBlongME se refiere a la Label (etiqueta) donde mostraremos la longitud de la ubicación memorizada).
3. Las etiquetas necesarias las alinearemos con los HorizontalArrangement  (del 1 al 6) necesarios, que también se
aprecian en las imágenes. 
4. Necesitamos colocar 2 botones, que renombro a BTmemAC (botón para memorizar la posición actual) y
BTrutME (botón que devuelve la posición memorizada previamente). Su posición se puede ver en la primera
imagen, pero finalmente desmarcaremos la propiedad Visible de ambos, de modo que inicialmente no podrán
observarse, tal como se aprecia en la segunda imagen.
5. También necesitamos un componente LocationSensor (Sensor de posición) que renombramos a SensorGPS, y
que se encargará de darnos la ubicación al activar la aplicación.
6. Un componente ActivityStarter1, con el que lanzaremos GoogleMaps. Para conseguirlo es indispensable
establecer las siguientes propiedades (en rojo) como se indica:
Action: android.intent.action.VIEW
 ActivityClass: com.google.android.maps.MapsActivity
ActivityPackage: com.google.android.apps.maps
7. Un componente TinyDB1, donde almacenaremos (memorizaremos) la posición del coche.

En el par de imágenes siguiente podréis encontrar lo indicado anteriormente.

Una vez colocados y configurados todos los componentes que necesitamos, vamos a programar su comportamiento en
el editor de bloques.
Empezamos con los siguientes bloques:

Definimos la variable verifBD, con la que posteriormente, una vez iniciada la aplicación, vamos a verificar que la base de
datos TinyDB1 contiene datos memorizados previos. De ser así (longitud > 0), extraemos los datos memorizados y los
mostramos a través de las etiquetas LBdirME (dirección), LBlatME (latitud) y LBlongME (longitud memorizada).
Además, hacemos visible el botón BTrutME, para que el usuario pueda pulsarlo para ver la ruta de retorno al coche,
ofrecida por Google Maps. No olvidemos activar el sensor GPS,

Para cuando el GPS detecta cualquier pequeño cambio de localización, programaremos los siguientes
comportamientos:

Mostraremos la ubicación que nos devuelve el sensor mediante las etiquetas LBdirAC (dirección), LBlatAC (latitud) y
LBlongAC (longitud). Adicionalmente, convertiremos en visible el botón BTmemAC, para que el usuario pueda
almacenar en TinyDB1 los datos presentados.
Para la eventualidad que el usuario pulse el botón BTmemAC, grafiado con Memorizar la posición, programaremos un
comportamiento determinado por los siguientes bloques:

 
Se ve que ental caso, pasamos todos los datos de las etiquetas AC, relativas a la posición actual, a las etiquetas ME,
referentes a la posición memorizada. Seguidamente, escribimos el contenido de las etiquetas ME, que contienen en
este momento la posición actual (están igual que las AC), a la base de datos TinyDB1. Adicionalmente, hacemos visible
el botón para mostrar la ruta de regreso al coche, por si el usuario desea verla.

Por último, programamos qué debe ocurrir cuando el usuario pulsa el botón BTrutME, grafiado con Mostrar la ruta hasta
la posición recordada, bien cuando se acaba de abrir el programa y ya había algún dato memorizado, o bien cuando lo
acabamos de memorizar.
Aquí estableceremos la propiedad ActivitySarter1.DataUri, a la que le pasaremos una cadena de texto que contendrá,
anexados, los siguientes parámetros:

La URL de Google Maps con el siguiente inicio de consulta: http://maps.google.com/maps/?saddr=

La latitud actual (en LBlatAC) seguida de una coma (,)
La longitud actual (en LBlongAC)
&daddr=
La latitud memorizada (en LBlatME) seguida de una coma (,)
La longitud memorizada (en LBlongME)

Existe un problema con la parte decimal de las variables presentadas mediante etiquetas, ya que en un móvil
configurado en español Android sustituirá el punto decimal anglosajón por la coma decimal que usamos en España. Si
finalmente pasáramos a Maps estas coordenadas con coma decimal se generaría un error. Este error es equivalente al
que ya explicamos para los TextBox en el tutorial  Enviar factura, y podemos resolverlo como explicamos allí, o bien con
la estrategia que hemos aplicado aquí, que consiste en sustituir de nuevo las comas decimales por puntos al pasar los
datos al ActivityStarter1.DataUri, mediante llamadas a Replace all.

Por último, no olvidemos lanzar la actividad con ActivityStarter.StartActivity, que llamará a Google Maps y mostrará la
ruta de regreso al coche.

Comments
 You do not have permission to add comments.

Contenidos bajo licencia de Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0.

Buena parte de los contenidos son traducciones y adaptaciones de Learn, publicados bajo licencia de Creative Commons Attribution 3.0 Unported License.

View as Desktop My Sites

Powered By Google Sites