En este artículo vamos a explicar cómo diseñar una aplicación sencilla para el sistema Android que controle el coche 2WD que hemos construído en entradas anteriores.

En primer lugar entramos en la web de APP Inventor y pulsamos en el boton Create Apps! de la esquina superior derecha. Nos pide que nos identifiquemos con nuestra cuenta de Google.

A continuación podemos cambiar el idioma si así lo deseamos a español utilizando el desplegable que hay arriba a la derecha:

Comenzamos nuestro proyecto pulsando en el botón Comenzar un nuevo proyecto en la barra superior izquierda. Le vamos a dar el nombre de Control2WD. El nombre no admite espacios ni caracteres especiales.

En la parte central tenemos la pantalla donde vamos a diseñar la aplicación. A la izquierda tenemos los elementos que podemos incluir en la misma y a la derecha la lista de componentes que vamos incluyendo y más a la derecha los parámetros de configuración de cada uno de ellos.

Vamos a comenzar por cambiar el nombre a nuestra pantalla. A la derecha dentro de las opciones vamos a cambiar el título y vamos a sustituir el que viene por defecto Screen1 por Control Bluetooth 2WD. Vamos a cambiar también la orientación de la pantalla por horizontal y el color de la imagen de fondo por gris.

 

Nos quedará así la pantalla:

Insertamos ahora un componente llamado Selector de Lista. Le cambiamos las propiedades de disposición horizontal a centro , el tamaño de letra a 18 y el texto por defecto lo cambiamos por Conectar. Nos quedará con este aspecto:

Vamos ahora a posicionar los botones que nos van a permitir dirigir nuestro coche. Para ello vamos a necesitar distribuir cuatro botones de manera que sea luego cómodo pulsarlos. Utilizamos una disposición tabular, que podemos encontrarla a la izquierda en el apartado Disposición. Cambiamos en las propiedades el apartado columnas a 7 y el registros a 5.

Vamos a utilizar esta tabla que hemos creado para insertar un componente llamado Botón. Insertamos uno en la casilla central de la primera fila de la tabla.

Vamos a cambiarle el nombre el botón por uno que sea más descriptivo de la función que va a realizar. Le vamos a llamar BotonAdelante. Para cambiarle el nombre pulsamos en él en la lista de componentes y pulsamos el botón Cambiar Nombre que hay abajo.

Vamos ahora a cambiar la imagen de fondo del botón por una flecha que señale hacia arriba. Podemos descargar las imágenes de las flechas que vamos a utilizar a continuación:

 

En el botón que hemos insertado vamos a cambiar la propiedad imagen por la flecha correspondiente. Para ello se nos abre una ventana en la que podemos subir el archivo que hemos descargado en nuestro ordenador con la flecha:

Repetimos la operación con los otros botones hasta que nos queda una disposición parecida a la siguiente:

Nos queda por incluir un elemento que es el cliente Bluetooth que va a establecer la comunicación con nuestro proyecto. Lo encontramos a la izquierda en el apartado comunicaciones. Al ser un elemento no visible al arrastarlo a nuestro diseño se muestra debajo de la pantalla.

Una vez finalizado el diseño debemos pasar ahora a programar las acciones que se ejecutarán cuando utilicemos los componentes que hemos incluido en el diseño de la aplicación. Para ello pulsamos en el botón Bloques arriba a la derecha, que nos permitirá pasar a la ventana de programación con bloques.

Comenzamos por programar el selector de lista que colocamos en nuestro diseño y que nos permitirá conectar a través de Bluetooth el dispositivo móvil con el vamos a manejar el coche. Seleccionamos a la izquierda el selector de lista y dentro de las opciones que nos aparecen arrastramos el bloque Cuando...antes de la selección.

Seleccionamos dentro del apartado control un bloque Si...entonces y lo arrastramos y conectamos con el bloque anterior

 

Desde el componente Bluetooth seleccionamos el bloque Bluetooth...disponible y lo conectamos con la condición del condicional Si. En el conector entonces conectamos el seleccionador de elementos de la lista de dispositivos disponibles y lo relacionamos con las direcciones y nombres de los dispositivos Bluetooth encontrados en la búsqueda.

Ahora vamos a programar las acciones que se desencadenan una vez que realizamos la selección del dispositivo Bluetooth de la lista. Arrastramos el bloque Cuando...DespuésDeSelección y le introducimos desde el apartado control un condicional si...entonces.

En el condicional si conectamos un bloque que comprueba si está disponible el cliente Bluetooth y en entonces conectamos un bloque que va a conectar nuestro cliente Bluetooth con la dirección seleccionada en la lista de selección.

Ya tenemos conectado nuestro dispositivo móvil y el módulo HC-06 de nuestro coche. Ahora vamos a programar qué sucede cuando se pulsan los botones con las flechas que colocamos en nuestro diseño.

Para cada botón tenemos que programar las acciones que se desencadenan tanto cuando pulsamos el botón como cuando dejamos de pulsarlo. Lo haremos con un botón, los otros se programan de forma similar. Empezaremos por el botón que moverá el coche hacia adelante. Para ello arrastramos un bloque del botón Adelante antes de pulsar y otro para después de pulsar y en cada uno de ellos conectamos un condicional Si...entonces.

Al pulsar el botón comprobamos primero que el dispositivo Bluetooth está disponible y si es así le enviamos el texto "F" que era el que hacía que se ejecutase la función Adelante() en nuestro Arduino.

Cuando soltamos el botón el coche debe pararse, por lo que debemos enviarle el texto "S" que es el que hace que se ejecute la función Parar() en nuestro programa de Arduino.

Haremos lo mismo con los otros tres botones. Para el botón Atrás enviaremos el texto "B", para el botón Izquierda el texto a enviar será "L" y para el botón Derecha enviaremos el texto "R".

La programación completa quedaría así:

A continuación realizamos la compilación de la aplicación y tenemos la opción de descargar el fichero con la extensión apk en nuestro ordenador o enviarla directamente a nuestro dispositivo móvil utilizando un código QR. Recordamos que para instalarla en nuestro dispositivo debemos permitir en él que se instalen aplicaciones de fuentes desconocidas. Para ello en el menú superior seleccionamos la opción Generar y seleccionamos la opción que más nos convenga de las dos explicadas anteriormente.

Se producirá ahora la compilación de la aplicación y la generación del fichero apk correspondiente a la misma.

Para hacer funcionar nuestro coche bastará con pulsar el botón Conectar y seleccionar nuestro dispositivo HC-06. Si aún no se ha emparejado habrá que introducir la contraseña por defecto 1234. Cuando pulsemos los botones de dirección el coche se moverá en la dirección indicada.