Brújula

Diseño

Comenzamos facilitando a nuestro alumnado los archivos que se adjuntan en el apartado Descargables de la actividad y les pedimos que accedan a la web de Bitbloq y seleccionen la herramienta Bitbloq Apps. A continuación, vamos explicando los siguientes pasos:

1. En la pestaña Diseño, pulsar sobre + Añadir recurso y seleccionar las dos imágenes descargadas previamente.

En Bitbloq Apps podemos seleccionar la resolución que necesitemos para visualizar nuestras aplicaciones de forma óptima en nuestro dispositivo.

2. Seleccionar y arrastrar un componente Contenedor libre a la parte superior de la pantalla del dispositivo que aparece en el espacio de trabajo.

3. Configurar el contenedor para darle las dimensiones que se quieran y centrarlo.

4. Añadir en Imagen de fondo la imagen correspondiente a los puntos cardinales y seleccionar la opción Contenedor en la propiedad Modo fondo de su panel de propiedades. Para poder ver esta propiedad, hay que cambiar a Modo avanzado.

En Bitbloq Apps, la diferencia entre el Modo básico y el Modo avanzado, es que en este último, se pueden configurar más propiedades de los componentes.

5. Seleccionar y arrastrar un componente Imagen en el centro del contenedor. Configurar este componente para centrarlo y añadir en Imagen de fondo la imagen correspondiente al indicador.

6. Seleccionar y arrastrar un componente Contenedor vertical a la parte inferior.

7. Configurar el contenedor para centrarlo y para que ocupe el ancho que se quiera.  

8. A continuación, añadir dos componentes Contenedor horizontal en el interior de cada uno de los huecos del contenedor.

9. Seleccionar y arrastrar cuatro componentes Texto en el interior de cada uno de los huecos del contenedor.

10. En los de los huecos superiores, cambiar la propiedad Texto por “Longitud” y “Latitud” respectivamente. En los de los huecos inferiores, borrar los textos.

11. Para finalizar el diseño, seleccionar y arrastrar un componente Orientación y un componente Localización de la categoría Sensores. Estos tipos de componente se añaden como no visibles en el listado de la izquierda de la pantalla.

Programación

Una vez realizado el diseño, explicamos cómo programar su funcionamiento:

1. En la pestaña Bloques, programar que cuando el dispositivo detecte un cambio en la orientación, la imagen del indicador rote los grados correspondientes al Azimuth, el ángulo que el dispositivo se desvía respecto al norte magnético.

Azimut es el ángulo de rotación respecto al eje perpendicular a la superficie terrestre, considerándose el norte magnético como cero.

2. Programar que cuando el dispositivo detecte un cambio en la ubicación, el componente Texto correspondiente muestre el valor de la latitud y el otro el valor de la longitud.

3. Programar que al abrir la aplicación, ya muestre la imagen señalando el norte y la latitud y longitud, sin necesidad de que haya un cambio para que se muestre.

Recomendamos a nuestro alumnado ir probando el funcionamiento de la programación cada poco tiempo utilizando el modo En tu dispositivo móvi. Para ello, deben tener instalada en su dispositivo la aplicación Bitbloq Pocket, disponible para Android o iOS, y seguir los pasos que se indican.

Es posible que el sensor de orientación de nuestro dispositivo esté descalibrado, por lo que es aconsejable girar el dispositivo varias veces hasta que observemos que se orienta mejor. 

Generalmente, funciona mejor con el dispositivo en posición horizontal.

A continuación te proponemos algunas ideas de aplicaciones similares para seguir practicando:

• Aplicación que permite conocer el valor de los los ángulos de navegación (Alabeo, Azimuth y Cabeceo) mostrando los valores en tres componentes Texto tras girar el dispositivo.

• Aplicación que muestra información sobre un lugar concreto (como por ejemplo, un museo) cuando detecta que se está en su ubicación (latitud y longitud).

Accede al proyecto:

Haz clic en la imagen para abrir la página del proyecto en Bitbloq Apps.