En este primer ejemplo, trataremos de familiarizarnos con la interfaz de APP inventor. Deberemos realizar las siguientes tareas:
- Examinar las distintas formas de trabajo que ofrece la web, tanto en modo diseñador como en modo programación.
- Instalar en el dispositivo móvil la APP MIT AI2 Companion, que utilizaremos para conectar la aplicación realizada en la web con nuestro móvil.
- Se deberá realizar la programación necesaria para que al girar el móvil cambie de color el fondo de la pantalla.
- Localizaremos 2 imágenes en la web y la subiremos a nuestro proyecto.
- Deberemos añadir un nuevo componente "Botón", al que le modificaremos determinadas propiedades relacionadas con el aspecto.
- Añadiremos también un componente "Imagen" que ajustaremos al contenedor, tanto a lo ancho como a lo alto de la pantalla.
- Programaremos el componente "Botón" de manera que, al pulsar sobre él, conmute entre una u otra foto.
EJEMPLO2: MOVIMIENTO DE IMÁGENES
En este segundo ejemplo, veremos cómo disponer de una forma apropiada los distintos componentes de una app, así como dotarle de movimientos y otros efectos interesantes:
- Insertar una "Disposición vertical" con un alto del 50% e incluir un "Lienzo" que se ajustará a todo el contenedor. Finalmente, incluiremos una "Pelota" dentro del lienzo, con un radio de 20.
- Insertar una "Disposición horizontal" con un alto y ancho que se ajustará al contenedor. Insertar un "Botón" que usaremos para desplazar la pelota hacia arriba. Se usará una imagen apropiada para el botón.
- Insertar una "Disposición horizontal" con un alto y ancho que se ajustará al contenedor. Insertar tres "Botones" que usaremos para desplazar la pelota hacia la izquierda, derecha y para volver a su posición inicial. Se usará una imagen apropiada para cada botón.
- Insertar una "Disposición horizontal" con un alto y ancho que se ajustará al contenedor. Insertar un "Botón" que usaremos para desplazar la pelota hacia abajo. Se usará una imagen apropiada para el botón.
- Al pulsar sobre cada uno de las botones de desplazamiento, la pelota se moverá por la pantalla con una velocidad determinada, hasta llegar a un borde que rebotará y se moverá en sentido contrario. El botón central, se utilizará para devolver la pelota a su posición inicial y sin ningún movimiento.
- Cuando la pelota toque un borde, se le asignará un color de fondo aleatorio.
- Finalmente, al presionar sobre la pelota, cambiará a una posición aleatoria en la pantalla.
EJEMPLO3: ATRAPA LA CARITA FELIZ
En este tercer ejemplo, jugaremos a intentar atrapar la carita sonriente que se moverá de forma aleatoria en la pantalla, de manera que cada vez que lo consigamos emita un ruido "gracioso" y aumente su velocidad de movimiento. Para ello:
- Insertar un "Lienzo" que se ajustará a todo el contenedor. Seguidamente, incluiremos una "Carita feliz" dentro del lienzo, que previamente buscaremos en Internet, la descargaremos a nuestro equipo y la subiremos a AppInventor.
- Insertar un "Temporizador" que estará habilitado inicialmente con un intervalo de 1000 ms
- Cada vez que pulsemos sobre la "Carita feliz":
- Se incrementará un contador de aciertos que iremos mostrando junto al título de la aplicación.
- Se aumentará la velocidad de la "Carita feliz", para ello se decrementará el valor asociado al temporizador.
- Se emitirá un pequeño sonido, que podrás descargar pulsando aquí.
- Cuando la pantalla del móvil cambie de orientación:
- Se reiniciará la velocidad a la que se mueve la "Carita feliz".
- El contador de aciertos se establecerá en 0.
