EL APP INVENTOR

EMMANUEL JARAMILLO JARAMILLO

CONSULTA

ARIEL AUGUSTO TOBON MEJÍAINGENIERO DE SISTEMAS

INSTITUCIÓN EDUCATIVA LA PAZLA CEJA, ANTIOQUIA

2016

EL APP INVENTORGoogle App Inventor es una plataforma de Google Labs para crear aplicaciones de software para el sistema operativo Android. De forma visual y a partir de un conjunto de herramientas básicas, el usuario puede ir enlazando una serie de bloques para crear la aplicación. El sistema es gratuito y se puede descargar fácilmente de la web. Las aplicaciones fruto de App Inventor están limitadas por su simplicidad, aunque permiten cubrir un gran número de necesidades básicas en un dispositivo móvil.

Con Google App Inventor, se espera un incremento importante en el número de aplicaciones para Android debido a dos grandes factores: la simplicidad de uso, que facilitará la aparición de un gran número de nuevas aplicaciones; y Google Play, el centro de distribución de aplicaciones para Android donde cualquier usuario puede distribuir sus creaciones libremente.

Historia

La plataforma se puso a disposición del público el 12 de julio de 2010 y está dirigida a personas que no están familiarizadas con la programación informática. En la creación de App Inventor, Google se basó en investigaciones previas significativas en informática educativa.

Características

El editor de bloques de la plataforma App Inventor, utiliza la librería Open Blocks de Java para crear un lenguaje visual a partir de bloques. Estas librerías están distribuidas por Massachusetts Institute of Technology (MIT) bajo su licencia libre (MIT License). El compilador que traduce el lenguaje visual de los bloques para la aplicación en Android utiliza Kawa como lenguaje de programación, distribuido como parte del sistema operativo GNU de la Free Software Foundation

App Inventor pueden tener su primera aplicación en funcionamiento en una hora o menos, y se pueden programar aplicaciones más

EL APP INVENTORcomplejas en mucho menos tiempo que con los lenguajes más tradicionales, basados en texto. Inicialmente desarrollado por el profesor Hal Abelson y un equipo de Google Educación, mientras que Hal pasaba un año sabático en Google, App Inventor se ejecuta como un servicio Web administrado por personal del Centro del MIT para el aprendizaje móvil –una colaboración de MIT de Ciencia Computacional e Inteligencia Artificial de laboratorio (CSAIL) y el Laboratorio de Medios del MIT–.

Inventor MIT App es compatible con una comunidad mundial de casi dos millones de usuarios que representan a 195 países en todo el mundo. Más de 85 mil usuarios semanales activas de la herramienta han construido más de 4,7 millones de aplicaciones de Android. Una herramienta de código abierto que pretende realizar la programación y la creación de aplicaciones accesibles a una amplia gama de audiencias.

Flujo de ejecución de una aplicación en App InventorEl flujo de cualquier programa en Android se basa en eventos, es decir, tiene que

ocurrir una acción para que la reacción correspondiente se realice, es decir, el

programa “espera” a. Esto ocurre tanto en las aplicaciones generadas con la

programación “tradicional” como las generadas con App Inventor o Protocoder.

Diagrama ejecución Android

En el caso de la programación en otros lenguajes, como Arduino, la programación se

basa en un ciclo en el que de manera lineal se ejecuta el código. Dentro de este ciclo,

EL APP INVENTORtendremos que comprobar si las acciones han ocurrido para entonces ejecutar las

acciones correspondientes.

Diagrama ejecución Arduino

Creando la interfaz de usuarioPara crear la interfaz de usuario, el desarrollador puede hacer uso de distintos

elementos, desde botones y cuadros de texto, a elementos que modifican la manera

en que los elementos visuales se colocan en pantalla.

Para incluir elementos en App Inventor solo tendremos que buscar el que queremos

incluir en la aplicación y arrastrarlo en la pantalla Visor, pero hay ciertos elementos

que nos facilitarán crear una interfaz mejor, como los elementos Disposición.

Disposición

Los elementos de Disposición, o Layout en inglés, permiten modificar la forma en que

se colocan los elementos. Existen varios tipos: Tabular: Ordena los elementos en forma de tabla.

EL APP INVENTOR Vertical: Ordena los elementos colocándolos uno después de otro

en orientación vertical.

Horizontal: Ordena los elementos colocándolos uno después de otro en orientación horizontal.

Pueden incluirse disposiciones dentro de disposiciones, por lo que combinando varias

podemos conseguir un buen diseño de interfaz.

AplicaciónEn esta entrada vamos a hacer una aplicación que utilizará el reloj del dispositivo para

ejecutar la vibración, demostrando así como la aplicación responde a eventos.

Diseño de la UI

Para comenzar, utilizaremos un contenedor vertical ( Disposición Vertical ) en el que

organizaremos el resto de elementos. Fijamos las propiedades Ancho y Alto para que

se ajusten al contenedor:

EL APP INVENTOR

A continuación, dentro del contenedor vertical, incluimos una disposición Horizontal y

una disposición Tabular. Modificamos ambos anchos para que se ajusten al

contenedor:

EL APP INVENTOR

Dentro del contenedor horizontal que hemos incluido en el paso anterior, incluimos dos

botones, que se encargarán de iniciar y parar la ejecución del programa. Modificamos

su nombre y texto por Iniciar y Parar y cambiamos su Ancho para que se ajusten al

contenedor:

EL APP INVENTOR

Entre el contenedor vertical y el contenedor horizontal, incluiremos el elemento Lienzo

(Dibujo y animación), que utilizaremos para cambiar el intervalo entre vibraciones al

arrastrar sobre el eje Y, y cambiar el tiempo de vibración al arrastrar sobre el eje X.

Modificamos su alto y ancho para que se ajusten al contenedor.

EL APP INVENTOR

A continuación, dentro del contenedor tabular, colocamos cuatro etiquetas:

EL APP INVENTOR

Cambiamos el nombre de arriba a abajo y de izquierda a derecha por: Label_vibracion,

tiempo_vibracion_label, Label_intervalo y tiempo_intervalo_label. Estas variables se

encargarán de mostrar la palabra Vibración, el tiempo de vibración, mostrar intervalo y

el tiempo de intervalo entre cada vibración, respectivamente. Modificamos el texto que

muestran las etiquetas de Label_vibracion y label_intervalo por Vibración e Intervalo,

respectivamente. Cambiamos el texto de las variables tiempo_vibracion_label y

tiempo_intervalo_label por los valores con los que incializaremos las variables en la

parte de programación, 100 y 1000 respectivamente.

EL APP INVENTOR

Por último, incluiremos el elemento Reloj, incluido dentro de sensores, que

utilizaremos como temporizador, y el elemento Sonido, incluido dentro de Medios, que

utilizaremos para hacer vibrar el dispositivo. Estos dos elementos no tienen

representación gráfica dentro de la interfaz.

https://www.youtube.com/watch?v=poGKm8N886UProgramación

En el modo Bloques programamos la aplicación. Para comenzar, declaramos las

variables globales intervalo y vibración, para ello, arrastramos el bloque “inicializar

global nombre como” y dentro de Matemáticas, el bloque para incluir números (primero

del listado matemáticas):

EL APP INVENTORUna vez que hemos unido ambos bloques, cambiamos nombre

por intervalo y vibracion, y en el bloque de números asignamos 1000 a intervalo y

100 a vibración:

A continuación, programamos los botones Iniciar y Parar. Para ello utilizaremos la

orden set Reloj1.TemporizadorHabilitado, que se encarga de habilitar o deshabilitar el

temporizador si asignamos el valor cierto o falso respectivamente.

Además, utilizaremos el bloque “poner Reloj1.IntervaloDelTemporizador como”,

uniendolo con el bloque “cuando Iniciar.Clic” para que se asigne el valor de la variable

global intervalo al intervalo del temporizador. Este intervalo será el tiempo que tarde en

“activarse” el temporizador.

Para obtener el bloque “tomar global intervalo”, nos situamos encima del nombre de la

variable en su declaración, aparecerá un desplegable y desde ahí arrastramos el

bloque tomar “global intervalo” al conjunto anterior:

EL APP INVENTOR

Ahora, cada vez que se pulse sobre el botón Iniciar, se modificará el valor de la

frecuencia con la que se activará el temporizador.

Para continuar, programaremos las acciones que se ejecutarán cuando se active el

temporizador, para ello, dentro de Reloj1 arrastramos el bloque “cuando

Reloj1.Temporizador”:

Con el bloque anterior, unimos el bloque “llamar Sonido1.Vibrar” y un bloque “tomar

global vibracion”:

EL APP INVENTOR

Para finalizar, programaremos la respuesta del lienzo al movimiento utilizando el

bloque “cuando Lienzo1.Arrastrado”:

Dentro de este bloque, incluiremos la sentencia de control “si entonces” (if-else) y un

bloque de comparación matemática:

Modificamos la comparación para que sea mayor que y incluimos en los miembros de

la comparación, de izquierda a derecha, tomar YPrevio y tomar YActual:

Esta orden se ejecuta si nos desplazamos dentro del lienzo sobre el eje Y y hacia

arriba, por lo que aumentaremos la variable. Podríamos asignar a la variable un valor

EL APP INVENTORen función de la posición que se haya tocado, pero para hacer la ejecución más

estable e intuitiva, se aumentará el valor de la variable en una cantidad fija. En este

caso, aumentaremos en 100 unidades el valor de la variable intervalo:

Duplicamos el bloque Si-Entonces anterior y lo unimos a éste, modificamos la

comparación para que sea menor que, obteniendo la detección del desplazamiento

contrario al anterior, es decir, vamos a detectar si se esta “bajando” dentro del lienzo.

Al realizar el movimiento contrario, vamos a disminuir el valor de la variable:

Duplicación bloque

Podemos reutilizar todo el bloque menos la operación de suma, que tenemos que

cambiar por una resta:

EL APP INVENTOR

Para modificar el tiempo que vibrará cada vez que se active el temporizador,

utilizaremos el movimiento sobre el eje X del lienzo. Los bloques de programación son

los mismos que los utilizados para el eje Y, modificando los valores Y por X, la variable

intervalo por vibración y la modificación del valor pasa de valer 100 a 10.

EL APP INVENTOR