Centro de Estudios Tecnológicos Industrial y de

Servicios N° 53
“Vicente Ramón Guerrero Saldaña”
 

CUADERNO DE TRABAJO
Establece comunicación mediante el uso de dispositivos móviles
Profesora: M en [Link] Lilia Cuevas Garcia
 
Elaborado por:
 Acosta Salinas Ingrid Fernanda
 Murguia Luciano Ivonne
 Cortes Bucio Martha Anaid
 Vazquez Avalos Dan Angel
 ¿QUÉ ES APP INVENTOR?
AppInventor es un entorno de desarrollo de software creado por Google para la elaboración de
aplicaciones destinadas al sistema operativo de Android. El lenguaje es gratuito y se puede acceder
fácilmente de la web. Las aplicaciones creadas con AppInventor están limitadas por su simplicidad,
aunque permiten cubrir un gran número de necesidades básicas en un dispositivo móvil.
Con AppInventor, 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.
 VENTAJAS E INCONVENIENTES DE APPINVENTOR
•Se pueden crear aplicaciones por medio de bloques de
manera intuitiva y grafica, sin necesidad de saber
código de programación.
•Se puede acceder en cualquier momento y cualquier
lugar siempre que estemos conectados a internet.
•Nos ofrece varias formas de conectivad: directa, o wi fi
o por medio del emulador.
•Nos permite descargar la aplicación mediante el .apk a
nuestro pc.

Sin embargo, son varios los inconvenientes que encuentra un usuario de nivel medio
o avanzado:

• No genera código Java para desarrollos más profundo

• Solo se puede desarrollar para Android.
ACCEDE A LA PLATAFORMA DE APPINVENTOR

FUNCIONAMIENTO DE LA PLATAFORMA DE APPINVENTOR Y CÓMO ESTÁ DIVIDIDA. AL SER UN PROGRAMA GRATUITO DE GOOGLE PODRÁS ACCEDER CON TU CUENTA DE GMAIL. PARA ELLO DEBERÁS ACCEDER A LA WEB DEL PROYECTO DE APPINVENTOR  Y LOGUEARTE INTRODUCIENDO TU CORREO ELECTRÓNICO.
PARA CONSTRUIR APLICACIONES SE TRABAJA CON:
EL DISEÑADOR DE APP INVENTOR (APP INVENTOR DESIGNER), DONDE PODRÁS SELECCIONAR LOS COMPONENTES PARA TU APLICACIÓN.
EL EDITOR DE BLOQUES DE APP INVENTOR (APP INVENTOR BLOCKS EDITOR) , DONDE SE ENSAMBLAN LOS BLOQUES DEL PROGRAMA PARA ESPECIFICAR CÓMO DEBEN COMPORTARSE SUS COMPONENTES. LOS PROGRAMAS SE DESARROLLAN VISUALMENTE, ENSAMBLANDO PIEZAS QUE SE JUNTAN ENCAJANDO COMO LAS DE UN ROMPECABEZAS.
Añadir una pelota a nuestra pantalla, pero antes
tenemos que añadirle el canvas ya que dicha pelota
solamente obtiene las propiedades o coordenadas
dentro del canvas..
A continuación animamos la pelota mediante
programación. Para ello, nos desplazamos a la pestaña
de bloques y le vamos a indicar que cuando se haga
click sobre la pelota cambie el fondo de color.

Configurar tu móvil, ordenador y aplicación para que

puedas testear las aplicaciones.
Aunque no se disponga de un teléfono con Android,
siempre se pueden construir aplicaciones utilizando el
emulador de Android, el software que se ejecuta en el
ordenador y se comporta igual que el teléfono
respecto a la misma.
En video te explicamos las 3 formas que tienes para
probar tus aplicaciones antes de instalarlas en tu
dispositivo móvil.
 COMPONENTES BÁSICOS
TABLA DE CONTENIDOS
 Screen
 Botón
 Lienzo Componentes y herramientas de appinventor
 CheckBox En esta página se describen los componentes que se
 Clock pueden utilizar en App Inventor para crear sus
 Image aplicaciones.
 Label En este apartado hay ejemplos de utilización de los
 Slider componentes de App Inventor que solo los podrás ver
 Spinner en esta web.
 ListPicker Poco a poco voy a ir poniendo todos los componentes
 ListView con ejemplos de utilización en videotutoriales.
 PassWordTextbox
 TextBox
 TinyDb
Button (Botón)

Los botones son los componentes que los usuarios tocan para realizar alguna acción en su aplicación.

Los botones detectan cuando el usuario lo pulsa. Muchos aspectos de la apariencia de un botón se puede cambiar. Con
la propiedad Enabled podemos elegir si el botón está activo en la aplicación

Canvas (Lienzo)

Es un panel bidimensional sensible al tacto, en el cual podemos dibujar y mover objetos animados, como bolas
o sprites.

El BackgroundColor (color del fondo), PaintColor (color del objeto que pintamos) , BackgroundImage (imagen
de fondo), Width (ancho) y Height (alto) del lienzo se puede establecer en el Diseñador o en el Editor de
bloques. La anchura y la altura se miden en píxeles y deben ser positivas.

Cualquier posición en el lienzo se puede especificar como un par de coordenadas (X, Y), donde

X es el número de píxeles de distancia desde el borde izquierdo del lienzo

Y es el número de píxeles de distancia desde el borde superior de la lona
Hay eventos que son llamados cuándo el lienzo ha sido tocado o una animación ( Sprite de imagen o Bola ) ha
sido arrastrada. También hay métodos para pintar puntos, líneas y círculos.
CheckBox (casilla de verificación)
El componente CheckBox puede detectar que el usuario lo ha marcado la casilla y puede cambiar su estado en respuesta
booleana.
Un componente CheckBox provoca un evento cuando el usuario lo toca. Muchas de propiedades que afectan a su
aspecto se pueden establecer en el Diseñador o el Editor de bloques.

Clock(Reloj)
Se puede utilizar un componente del reloj para crear un contador de tiempo que señala los acontecimientos a intervalos
regulares. El componente de reloj también hace varias conversiones y manipulaciones con unidades de tiempo.
El formato interno usado por el reloj se llama instante. Un instante es un paquete de datos de tiempo diversos, que
contiene, entre otros datos, los milisegundos que han pasado desde el inicio de 1970 en el calendario Gregoriano, la zona
horaria, el día del año, el día de la semana, el día del mes, el periodo AM o PM, la hora del día, el minuto de la hora, el
segundo del minuto, o el milisegundo del segundo.
Uno de los usos de la componente de reloj es el de temporizador: permite configurar un intervalo de tiempo al final de
cada uno de los cuales se disparará el evento de temporizador.
Un segundo uso del componente de reloj es el de manipular el tiempo, y expresar el tiempo en varias unidades. . El
método Now devuelve el momento actual como un instante. El reloj proporciona diversos métodos para manipular
instantes, por ejemplo, devolver el instante correspondiente a varios segundos, meses o años desde un instante dado.
También proporciona métodos para mostrar el día, hora, minuto y segundo, ..., de un instante dado.
Image (Imagen)

Se usa el componente de imagen para representar imágenes que los usuarios seleccionan y manipulan.
Un componente de la imagen muestra una imagen. Se puede especificar la imagen para mostrar y otros aspectos
de la apariencia de la imagen en el diseñador o en el Editor de bloques.

Label (Etiqueta)

Las etiquetas son componentes que se utilizan para mostrar texto.

Una etiqueta muestra el texto especificado en la propiedad Text. Otras propiedades, que se pueden establecer
tanto en el diseñador como en el editor de bloques, controlan la apariencia y la colocación de ese texto.

ListPicker (Lista de selección)

Los usuarios pueden tocar un componente de lista de selección para elegir un elemento de una lista de cadenas
de texto.
Cuando un usuario toca el botón selector, se muestra una lista de elementos de texto para que el usuario pueda
elegir. Los elementos de texto se puede especificar a través del diseñador o el Editor de bloques mediante el
establecimiento de la propiedad ElementsFromString mediante la concatenación de los valores separados por
comas (por ejemplo, selección1, selección2, selección3 ) o mediante el establecimiento de la propiedad
Elements de una List (Lista) en el editor de bloques.
Screen (Pantalla)
La pantalla no aparece en la paleta igual que los restantes componentes, pero aparece automáticamente en el
proyecto. Cada proyecto tiene una pantalla, llamada Screen1. Este nombre no puede ser cambiado.

PasswordTextBox (cuadro de texto para contraseña)

Los usuarios introducen las contraseñas en un componente de cuadro de texto para contraseña, que oculta el
texto que se ha escrito en él.

Un cuadro de texto para contraseña es el mismo que el componente TextBox ordinario, excepto en que no
muestra los caracteres tecleados por el usuario.

Se puede obtener o establecer el valor del texto en la caja con la propiedad Text. Si Text está en blanco, puede
utilizar la propiedad Hint para proporcionar al usuario una sugerencia de lo que puede escribir. La Hint aparece
como texto débil en el cuadro.

El componente de cuadro de texto para contraseña se utiliza generalmente con un componente de botón. El
usuario pulsa el botón después de la introducción de texto.
TextBox

Los usuarios pueden introducir texto en un componente de cuadro de texto.

El valor del texto inicial o el que el usuario haya introducido en un componente de cuadro de texto está en la
propiedad Text. Si Text está en blanco, puede utilizar la propiedad Hint para proporcionar al usuario una
sugerencia de lo que escribir. La sugerencia aparece como texto débil en el cuadro.

La propiedadl MultiLine determina si el texto puede tener más de una línea. Para una caja de una única línea de
texto, el teclado se cerrará automáticamente cuando el usuario presiona la tecla Listo. Para cerrar el teclado para
cuadros de texto de varias líneas, la aplicación debe utilizar el método HideKeyboard o confiar en que el usuario
pulse la tecla Atrás.

La propiedad NumbersOnly restringe al teclado numérico, de modo que sólo puedan introducirse números.

Otras propiedades afectan a la apariencia del cuadro de texto ( TextAlignment , BackgroundColor , etc) y si se
puede utilizar ( Enabled ).

Los cuadros de texto se suelen utilizar con el componente Button , para que el usuario haga clic en el botón
cuando se haya completado la entrada del texto.

Si el texto introducido por el usuario no se debe mostrar, usar PasswordTextBox en su lugar.

TinyDB
Se puede utilizar un componente TinyDB para almacenar los datos que estarán disponibles cada vez que la aplicación se
ejecuta.

TinyDB es un componente no visible.

Las aplicaciones creadas con App Inventor se inicializan cada vez que se ejecutan. Si una aplicación establece el valor de una
variable y el usuario cierra la aplicación, el valor de esa variable no será recordado la próxima vez que se ejecuta la
aplicación. TinyDB es un almacén de datos persistente para la aplicación, es decir, los datos almacenados estarán disponibles
cada vez que se ejecute la aplicación. Un ejemplo podría ser un juego que guarda la puntuación más alta, y la recuperaa cada
vez que se juega el juego.

Los elementos de datos se almacenan en las etiquetas. Para guardar un elemento de datos, se debe especificar la etiqueta bajo
la que debe ser almacenado bajo. Posteriormente, se puede recuperar el elemento de datos que se almacena en una etiqueta
determinada. Si no hay ningún valor almacenado en una etiqueta, entonces el valor devuelto es el texto vacío. En
consecuencia, para ver si una variable tiene un valor almacenado en ella, comprobar si el valor de retorno es igual a la de
texto vacío (es decir, un cuadro de texto sin texto, en blanco).

Sólo hay un almacén de datos por aplicación. Si usted tiene múltiples componentes TinyDB, se utilizará el mismo almacén
de datos. Para obtener el efecto de almacenes separados, utilice claves diferentes. Además, cada aplicación tiene su propio
almacén de datos. No se puede utilizar TinyDB para pasar los datos entre dos aplicaciones diferentes en el teléfono.