Introducción
El
Interface de usuario es el medio a través del cual el usuario se
comunica con tu aplicación y esta a su vez con el usuario. En este
taller vamos a aprender a usar AppInventor para pedir al usuario unos
datos usando distintos componentes y también a comunicarnos con el
usuario utilizando el sintetizador de voz y la vibración del teléfono.
Empieza creando un nuevo proyecto.
Llámalo por ejemplo: "entrada_datos"
Llámalo por ejemplo: "entrada_datos"
La pantalla principal de nuestra aplicación
Todos los programas tienen una pantalla principal que se llama por defecto Screen1 y que aparece como un componente más aquí:
Cambiando sus propiedades, puedes alinear todos los componentes de la pantalla a derecha, izquierda o centrados.
También puedes cambiar el color de fondo de la aplicación, añadir una imagen de fondo, cambiar el icono de la aplicación, cambiar la orientación de la aplicación, cambiar el título, etcétera.
Prueba a cambiar alguna de estas propiedades, por ejemplo, deja los componentes centrados en la pantalla aquí
y cambia el color de fondo aquí:
1 En primer lugar coge un componente HorizontalArrangement de la categoría Layout y colócalo justo debajo del componente ListPicker hombre/mujer.
2 Ahora coloca dentro dos componentes label. Asegúrate de que el componente label1 queda a la izquierda y el componente label2 a la derecha.
3 Puedes dejar el nombre del primer componente label1 tal y como está pero en sus propiedades cambia la propiedad Text y escribe "Tu edad: "
4 Al segundo componente le vamos a cambiar el nombre por: "mensaje_edad" y en su propiedad Text borra lo que hay para dejarlo en blanco.
5 Ahora usa el componente Slider dentro de la Paleta - User Interface y sitúalo debajo de las etiquetas que acabamos de crear, pero fuera del cuadrado HorizontalArrangement y encima del botón.
6 Cambia el nombre de este componente y llámalo "edad".
7 En sus propiedades cambia el valor de MaxValue (valor máximo) a "100" y el de MinValue (valor mínimo) a "1".
8 Puedes cambiar también los colores en las propiedades ColorLeft (color a la izquierda) y ColorRight (color a la derecha)
9 El valor ThumbPosition será el valor por defecto; pon el que quieras. El valor de la propiedad Width (ancho) puede ser "Fill Parent" pero puedes jugar hasta encontrar la mejor configuración. Tu diseñador debe ir quedando así:
10 Ahora vamos al editor de bloques.
11 En Screen1 selecciona el componente edad que acabamos de crear.
12 Verás que tiene un bloque marrón (evento) llamado "when edad.PositionChanged" (cuando el componente edad cambie de posición). Este bloque se activa cada vez que mueves este control. Vamos a usarlo en primer lugar para actualizar la etiqueta mensaje_edad y así mostrar la edad que estamos seleccionando. Cógelo y ponlo en cualquier parte de la pantalla.
13 Dentro de Screen1 / HorrizontalArrangement1 / mensaje_edad coge el bloque "set mensaje_edad.Text to" y colócalo dentro del bloque "when edad.PositionChanged" anterior.
14 Dentro de Built-in / Math coge un bloque "abs" y añádelo al bloque anterior.
15 Cuando lo hayas hecho, pincha sobre el texto "abs" de este último bloque y cambia el valor a "round". Esto nos permite redondear el valor de la edad para quitar los decimales.
16 Por último necesitamos el valor de la edad seleccionada por el usuario que corresponderá a la posición del cursor del componente. Este valor lo tenemos en Screen1 / edad en la propiedad "edad.thumbPosition". Úsalo y añádelo al componente "round" anterior". Debe de quedar así:
Lo vas a entender mejor cuando lo veas funcionar. Si todo va bien, deberías de ver cómo cambia la edad en la pantalla al mover el control slider. Pruébalo.
Ya hemos visto que la edad (correspondiente a la posición del cursor en el slider) se guarda en la propiedad edad.ThumbPosition. Ahora vamos a usarla para completar la frase que estamos componiendo en nuestro programa.
17 Crea un bloque de texto " " nuevo desde Built-in / Text y pégalo al bloque "join" donde estamos componiendo nuestra frase dentro del evento mi_boton.Click.
18 Cambia el texto de este último bloque por: " y tienes ". Respeta los espacios en el texto.
19 Añade otro bloque "abs" a la frase desde Built-in / Maths y cambialo por "round" tal y como hicimos antes.
20 A este último bloque le tienes que pegar también otro bloque con la propiedad "edad.ThumbPosition" tal y como hemos hecho antes.
21 Crea otro bloque de texto " " desde Built-in / Text y añádelo también a la frase.
22 Por último cambia el texto de este último bloque por:" años.".
Te tiene que quedar así:
¿Funciona? ¡Enhorabuena!
1 En el diseñador usa el control CheckBox dentro de la categoría User Interface y ponlo al final justo antes del botón OK.
2 Cambia el nombre del componente y llámalo "color_rojo".
3 Cambia su propiedad Text y escribe "¿en rojo?"
4 Ahora vamos al editor de bloques.
Queremos que el mensaje aparezca en rojo si el usuario ha marcado el checkbox color_rojo, en caso contrario queremos que el mensaje aparezca en negro. Para saberlo tenemos que comprobar el valor del bloque (la propiedad) color_rojo.Checked. Si el usuario ha marcado esta opción la propiedad será cierta, si no, será falsa. Para conseguir esto vamos a usar un tipo especial de bloques llamados Condicionales, que nos permiten tomar decisiones dentro de nuestros programas para cambiar su funcionamiento. Más adelante lo vamos a ver en detalle con más ejemplos.
Por el momento vamos a usar un bloque condicional que se encuentra dentro de la categoría Control en Built-in y que se llama "if-then-else" (si...entonces).
Para ello, tienes que arrastrar al lienzo el bloque “if-then” y luego añadir el bloque “else” haciendo click sobre el recuadro azul, de esta forma:
Este bloque nos permite comprobar si algo es cierto o no y, en función del resultado, hacer una cosa u otra dentro de nuestro programa. En este caso, cambiar el color del texto.
5 Coloca el bloque "if-then-else" dentro del bloque marrón (evento) mi_boton.Click justo debajo del bloque "set mi_etiqueta.Text to". Así:
6 Ahora busca dentro de Screen1 / color_rojo el bloque verde claro (propiedad) color_rojo.Checked y añádelo al bloque "if-then-else" porque esta es la propiedad que queremos comprobar.
7 Si el usuario ha marcado la opción de mostrar el texto en rojo, el resultado será cierto y por lo tanto se activarán los bloques dentro de "then" (entonces... haz esto).
Como queremos cambiar el color del texto del mensaje usa el bloque "set mi_etiqueta.TextColor to" y ponlo dentro del bloque "if-then".
8 Por último añade el bloque de color rojo que se encuentra dentro de la categoría Built-in/Colors.
Si el resultado es falso, es decir, el usuario no ha seleccionado esta opción, entonces se activarán los bloques dentro de "else" (entonces... haz esto otro). En este caso queremos que el mensaje aparezca en negro.
9 Coge el mismo bloque "set mi_etiqueta.TextColor to" anterior esta vez usando el color negro y colócalo en el bloque "if-then-else"
TRUCO
Puedes copiar cualquier bloque para no tener que volver a buscarlo haciendo CONTROL+C CONTROL+V o Command+C Command +V en Mac.
Tiene que quedar así:
¿Funciona?
Cambiando sus propiedades, puedes alinear todos los componentes de la pantalla a derecha, izquierda o centrados.
También puedes cambiar el color de fondo de la aplicación, añadir una imagen de fondo, cambiar el icono de la aplicación, cambiar la orientación de la aplicación, cambiar el título, etcétera.
Prueba a cambiar alguna de estas propiedades, por ejemplo, deja los componentes centrados en la pantalla aquí
y cambia el color de fondo aquí:
Componentes para pedir información
Vamos
a aprender a usar los componentes de App Inventor que nos permiten
pedir información al usuario. Están dentro de la categoría User
Interface y son el Textbox, Listpicker, Slider y Checkbox:
TEXTBOX
Este componente te permite crear un campo de texto donde
el usuario puede escribir un texto o un número que se guardará dentro de
la propiedad del componente llamada ".Text".
Vamos a verlo con un ejemplo:
1 Añade un componente "TextBox" a tu aplicación y cambia su nombre a "mi_textbox" pulsando en "rename" aquí:
2 También puedes agregar un
pequeño texto a modo de ayuda al usuario en el campo "Hint" de sus
propiedades. Por ejemplo, cambia el texto por: "pon aquí tu nombre".
3 Ahora añade un botón debajo y dale el nombre "mi_boton".
4 El componente botón (button) también tiene un campo llamado Text. Cambia el texto y escribe p. ej.: "ok".
Recuerda que una cosa es el nombre del componente (que
usaremos luego en el editor de bloques para identificarlo) y otra es la
propiedad "text" que será el texto con el que aparecerá el componente en
la pantalla.
5 Por último añade debajo un componente etiqueta (label) y cambia su nombre a "mi_etiqueta".
6 Puedes borrar el texto que aparece en el campo "Text" de sus propiedades para que aparezca en blanco.
Tu programa tiene que quedarte así:
7 Vamos ahora al editor de bloques.
8 Lo primero que tenemos que
hacer es buscar nuestro botón mi_boton dentro de "Screen1" y
seleccionar el bloque marrón (evento) mi_boton.Click. Arrástralo a tu
área de trabajo.
9 Para que aparezca el
mensaje que queremos en la etiqueta "mi_etiqueta" tenemos que cambiar su
propiedad .Text. Dentro de "Screen1" busca el componente mi_etiqueta,
coge el bloque "set mi_etiqueta.Text to" y colócalo dentro del bloque
anterior.
Este bloque cambia el texto del componente mi_etiqueta por
el texto que le pasemos a continuación. Sólo nos falta recuperar el
texto que ha introducido el usuario y que se encuentra guardado en el
bloque (propiedad) mi_textbox.Text.
10 Dentro de "Screen1" busca
el componente mi_textbox, coge el bloque (propiedad) mi_textbox.Text y
añádelo a la derecha del bloque verde oscuro "set mi_etiqueta.Text to"
así:
11 Prueba tu programa.
UNIR DOS TEXTOS
12 De momento nuestro
programa devuelve el texto que pongamos en el componente mi_textbox.Text
pero lo que queremos es que nos devuelva la frase "Tu nombre es " y el
texto que ponga el usuario. Para hacer esto tenemos que unir dos textos.
Por una parte la frase "Mi nombre es " y por otra la propiedad
mi_textbox.Text que es donde está guardado el texto metido por el
usuario. Para unir dos textos tenemos que usar el componente "join" que
se encuentra en la categoría "Built-In" dentro de Texto (Text). Búscalo y
ponlo en cualquier lugar de la pantalla.
13 Ahora vamos a añadirle la
primera frase. Busca el bloque " " dentro de la categoría Built-in /
Text y pégalo al bloque anterior "join".
14 Pincha sobre el hueco que
hay entre las comillas de este último bloque que acabas de usar y
cambia el texto por "Tu nombre es " dejando un espacio al final.
15 Ahora separa el bloque
"mi_textbox.Text" que habíamos pegado antes dentro del bloque
"mi_boton.Click" y añádelo al bloque "join" así:
16 Por último coge todo el
bloque "join" y vuelve a pegarlo al bloque "set mi_etiqueta.Text to"
dentro del bloque "mi_boton.Click". Tiene que quedar así:
¿Funciona? ¡Muy bien !
LISTPICKER
Este componente te permite mostrar una lista de opciones
para que el usuario de la aplicación escoja la que quiera. Vuelve al
Diseñador, selecciona este componente y añádelo a la pantalla de tu
programa entre el componente mi_textbox y mi_boton.
1 Cambia el nombre del componente por "genero" y en la propiedad "ElementsFromString" pon lo siguiente: "mujer,hombre".
2 Cambia la propiedad Text y escribe "género".
3 Vuelve al editor de bloques.
4 Dentro de la categoría
Built-in / Text coge un nuevo bloque de texto " ". Como ya tenemos
dos elementos en el bloque “join”, tenemos que añadir hueco para poder
pegarle más puzles. Para ello, haz click en el cuadrado azul del bloque
“join” y, en la nueva ventana, arrastra un bloque String dentro de la
estructura “join” de la derecha.
Ahora ya podemos añadir el bloque " " al final del bloque "join".
NOTA: Haz esto cada vez que necesites añadir más puzles.
5 Cambia el texto de este bloque y pon: ". Eres ".
Ahora vamos a usar la propiedad genero.Selection que está
dentro del componente genero en Screen1 y que guarda la opción que
hayamos elegido de la lista.
6 Selecciona el bloque (propiedad) genero.Selection y añádelo al final del bloque "join".
7 Prueba tu programa.
TRUCO
En el Diseñador, dentro de las propiedades del componente
genero que acabamos de crear, existe un campo llamado Selection. Aquí
puedes escribir cuál quieres que sea la respuesta por defecto en el caso
de que el usuario no haya elegido ninguna de la lista. En nuestro caso
podrías poner "desconocido". Pruébalo.
SLIDER
Este componente permite que el usuario seleccione un valor deslizando un deslizador gráfico entre los extremos de una pista que corresponde a un rango de valores. En nuestro ejemplo vamos a usarlo para introducir la edad. Vuelve al Diseñador.1 En primer lugar coge un componente HorizontalArrangement de la categoría Layout y colócalo justo debajo del componente ListPicker hombre/mujer.
2 Ahora coloca dentro dos componentes label. Asegúrate de que el componente label1 queda a la izquierda y el componente label2 a la derecha.
3 Puedes dejar el nombre del primer componente label1 tal y como está pero en sus propiedades cambia la propiedad Text y escribe "Tu edad: "
4 Al segundo componente le vamos a cambiar el nombre por: "mensaje_edad" y en su propiedad Text borra lo que hay para dejarlo en blanco.
5 Ahora usa el componente Slider dentro de la Paleta - User Interface y sitúalo debajo de las etiquetas que acabamos de crear, pero fuera del cuadrado HorizontalArrangement y encima del botón.
6 Cambia el nombre de este componente y llámalo "edad".
7 En sus propiedades cambia el valor de MaxValue (valor máximo) a "100" y el de MinValue (valor mínimo) a "1".
8 Puedes cambiar también los colores en las propiedades ColorLeft (color a la izquierda) y ColorRight (color a la derecha)
9 El valor ThumbPosition será el valor por defecto; pon el que quieras. El valor de la propiedad Width (ancho) puede ser "Fill Parent" pero puedes jugar hasta encontrar la mejor configuración. Tu diseñador debe ir quedando así:
10 Ahora vamos al editor de bloques.
11 En Screen1 selecciona el componente edad que acabamos de crear.
12 Verás que tiene un bloque marrón (evento) llamado "when edad.PositionChanged" (cuando el componente edad cambie de posición). Este bloque se activa cada vez que mueves este control. Vamos a usarlo en primer lugar para actualizar la etiqueta mensaje_edad y así mostrar la edad que estamos seleccionando. Cógelo y ponlo en cualquier parte de la pantalla.
13 Dentro de Screen1 / HorrizontalArrangement1 / mensaje_edad coge el bloque "set mensaje_edad.Text to" y colócalo dentro del bloque "when edad.PositionChanged" anterior.
14 Dentro de Built-in / Math coge un bloque "abs" y añádelo al bloque anterior.
15 Cuando lo hayas hecho, pincha sobre el texto "abs" de este último bloque y cambia el valor a "round". Esto nos permite redondear el valor de la edad para quitar los decimales.
16 Por último necesitamos el valor de la edad seleccionada por el usuario que corresponderá a la posición del cursor del componente. Este valor lo tenemos en Screen1 / edad en la propiedad "edad.thumbPosition". Úsalo y añádelo al componente "round" anterior". Debe de quedar así:
Lo vas a entender mejor cuando lo veas funcionar. Si todo va bien, deberías de ver cómo cambia la edad en la pantalla al mover el control slider. Pruébalo.
Ya hemos visto que la edad (correspondiente a la posición del cursor en el slider) se guarda en la propiedad edad.ThumbPosition. Ahora vamos a usarla para completar la frase que estamos componiendo en nuestro programa.
17 Crea un bloque de texto " " nuevo desde Built-in / Text y pégalo al bloque "join" donde estamos componiendo nuestra frase dentro del evento mi_boton.Click.
18 Cambia el texto de este último bloque por: " y tienes ". Respeta los espacios en el texto.
19 Añade otro bloque "abs" a la frase desde Built-in / Maths y cambialo por "round" tal y como hicimos antes.
20 A este último bloque le tienes que pegar también otro bloque con la propiedad "edad.ThumbPosition" tal y como hemos hecho antes.
21 Crea otro bloque de texto " " desde Built-in / Text y añádelo también a la frase.
22 Por último cambia el texto de este último bloque por:" años.".
Te tiene que quedar así:
¿Funciona? ¡Enhorabuena!
CHECKBOX
El componente Checkbox se usa para permitir al usuario elegir una opción que puede estar activada o no. Vamos a usarlo para cambiar el color del texto de nuestra frase si el usuario quiere resaltar el resultado.1 En el diseñador usa el control CheckBox dentro de la categoría User Interface y ponlo al final justo antes del botón OK.
2 Cambia el nombre del componente y llámalo "color_rojo".
3 Cambia su propiedad Text y escribe "¿en rojo?"
4 Ahora vamos al editor de bloques.
Queremos que el mensaje aparezca en rojo si el usuario ha marcado el checkbox color_rojo, en caso contrario queremos que el mensaje aparezca en negro. Para saberlo tenemos que comprobar el valor del bloque (la propiedad) color_rojo.Checked. Si el usuario ha marcado esta opción la propiedad será cierta, si no, será falsa. Para conseguir esto vamos a usar un tipo especial de bloques llamados Condicionales, que nos permiten tomar decisiones dentro de nuestros programas para cambiar su funcionamiento. Más adelante lo vamos a ver en detalle con más ejemplos.
Por el momento vamos a usar un bloque condicional que se encuentra dentro de la categoría Control en Built-in y que se llama "if-then-else" (si...entonces).
Para ello, tienes que arrastrar al lienzo el bloque “if-then” y luego añadir el bloque “else” haciendo click sobre el recuadro azul, de esta forma:
Este bloque nos permite comprobar si algo es cierto o no y, en función del resultado, hacer una cosa u otra dentro de nuestro programa. En este caso, cambiar el color del texto.
5 Coloca el bloque "if-then-else" dentro del bloque marrón (evento) mi_boton.Click justo debajo del bloque "set mi_etiqueta.Text to". Así:
6 Ahora busca dentro de Screen1 / color_rojo el bloque verde claro (propiedad) color_rojo.Checked y añádelo al bloque "if-then-else" porque esta es la propiedad que queremos comprobar.
7 Si el usuario ha marcado la opción de mostrar el texto en rojo, el resultado será cierto y por lo tanto se activarán los bloques dentro de "then" (entonces... haz esto).
Como queremos cambiar el color del texto del mensaje usa el bloque "set mi_etiqueta.TextColor to" y ponlo dentro del bloque "if-then".
8 Por último añade el bloque de color rojo que se encuentra dentro de la categoría Built-in/Colors.
Si el resultado es falso, es decir, el usuario no ha seleccionado esta opción, entonces se activarán los bloques dentro de "else" (entonces... haz esto otro). En este caso queremos que el mensaje aparezca en negro.
9 Coge el mismo bloque "set mi_etiqueta.TextColor to" anterior esta vez usando el color negro y colócalo en el bloque "if-then-else"
TRUCO
Puedes copiar cualquier bloque para no tener que volver a buscarlo haciendo CONTROL+C CONTROL+V o Command+C Command +V en Mac.
Tiene que quedar así:
¿Funciona?
El sintetizador de voz
Ya
hemos aprendido a usar varios componentes para pedir información al
usuario. También hemos aprendido a usar la información de esos
componentes para crear una frase completa y sacarla en pantalla. Ahora
vamos a aprender a usar el sintetizador de voz de Android para que
nuestra aplicación nos lea la frase en voz alta.
1 Vuelve al Diseñador.
2 El componente necesario lo encontrarás dentro de la categoría Media y se llama Text-to-Speech. Arrástralo a la ventana de tu programa y seguidamente vamos a cambiar en sus propiedades el valor de país y de lenguaje.
3 En el campo Country (país) introduce ESP y en el campo Language (lenguaje) escribe SPA.
4 Vuelve al editor de bloques.
5 Selecciona el nuevo componente TextToSpeech1 dentro de Screen1 para ver sus propiedades y acciones.
6 Verás un bloque morado llamado "call TextToSpeech.Speak". Este bloque es el que activa el sintetizador de voz, para lo cual tenemos que pasarle el texto que queremos que hable en voz alta. Arrastra este bloque y ponlo dentro del bloque marrón mi_boton.Click en último lugar.
Ahora sólo queda pasarle a este bloque el texto que queremos que diga en voz alta.
Fíjate en nuestro programa. Al principio hemos usado un bloque "set mi_etiqueta.Text" y le hemos pegado la frase. Es decir, hemos asignado a la propiedad mi_etiqueta.Text la frase, por lo tanto, la propiedad mi_etiqueta.Text ya contiene la frase que necesitamos usar. Recuerda que esta propiedad está dentro de Screen1 / mi_etiqueta.
7 Busca el bloque (propiedad) mi_etiqueta.Text y pégala al bloque "call TextToSpeech.Speak". Te tiene que quedar así:
Sube el volumen de tu móvil y pruébalo.
1 Vuelve al Diseñador.
2 El componente necesario lo encontrarás dentro de la categoría Media y se llama Text-to-Speech. Arrástralo a la ventana de tu programa y seguidamente vamos a cambiar en sus propiedades el valor de país y de lenguaje.
3 En el campo Country (país) introduce ESP y en el campo Language (lenguaje) escribe SPA.
4 Vuelve al editor de bloques.
5 Selecciona el nuevo componente TextToSpeech1 dentro de Screen1 para ver sus propiedades y acciones.
6 Verás un bloque morado llamado "call TextToSpeech.Speak". Este bloque es el que activa el sintetizador de voz, para lo cual tenemos que pasarle el texto que queremos que hable en voz alta. Arrastra este bloque y ponlo dentro del bloque marrón mi_boton.Click en último lugar.
Ahora sólo queda pasarle a este bloque el texto que queremos que diga en voz alta.
Fíjate en nuestro programa. Al principio hemos usado un bloque "set mi_etiqueta.Text" y le hemos pegado la frase. Es decir, hemos asignado a la propiedad mi_etiqueta.Text la frase, por lo tanto, la propiedad mi_etiqueta.Text ya contiene la frase que necesitamos usar. Recuerda que esta propiedad está dentro de Screen1 / mi_etiqueta.
7 Busca el bloque (propiedad) mi_etiqueta.Text y pégala al bloque "call TextToSpeech.Speak". Te tiene que quedar así:
Sube el volumen de tu móvil y pruébalo.
Activando la vibración
Para
activar la vibración de nuestro teléfono con App Inventor tenemos que
usar el componente Sound (sonido). Vuelve al Diseñador y busca este
componente en la categoría Media. Arrástralo a tu aplicación.
1 Vuelve al Editor de bloques y selecciona este nuevo componente dentro de Screen1. Aparecerá como Sound1 si no has cambiado su nombre.
2 Vamos ahora al Editor de Bloques y, dentro de Screen1, seleccionamos Sound1. Dentro de sus propiedades verás un bloque morado "call Sound1.Vibrate". Cógelo y ponlo dentro del bloque mi_boton.Click al final del todo.
Este bloque inicia la vibración del teléfono durante el tiempo que le digamos. Así que tenemos que decirle durante cuánto tiempo queremos que lo haga.
3 Selecciona la categoría Math dentro de Built-In y arrastra el primer bloque llamado "0".
4 Este bloque lo utilizamos para pasarle un número a otro bloque. En este caso lo vamos a usar para decirle al bloque "call Sound1.Vibrate" cuánto tiempo queremos que vibre el móvil. Si pinchas encima del número “0” podrás cambiar el valor. Pon 500.
5 Por último arrastra este bloque que acabas de crear y pégalo al bloque "call Sound1.Vibrate".
¿Funciona? ¡Enhorabuena!
1 Vuelve al Editor de bloques y selecciona este nuevo componente dentro de Screen1. Aparecerá como Sound1 si no has cambiado su nombre.
2 Vamos ahora al Editor de Bloques y, dentro de Screen1, seleccionamos Sound1. Dentro de sus propiedades verás un bloque morado "call Sound1.Vibrate". Cógelo y ponlo dentro del bloque mi_boton.Click al final del todo.
Este bloque inicia la vibración del teléfono durante el tiempo que le digamos. Así que tenemos que decirle durante cuánto tiempo queremos que lo haga.
3 Selecciona la categoría Math dentro de Built-In y arrastra el primer bloque llamado "0".
4 Este bloque lo utilizamos para pasarle un número a otro bloque. En este caso lo vamos a usar para decirle al bloque "call Sound1.Vibrate" cuánto tiempo queremos que vibre el móvil. Si pinchas encima del número “0” podrás cambiar el valor. Pon 500.
5 Por último arrastra este bloque que acabas de crear y pégalo al bloque "call Sound1.Vibrate".
¿Funciona? ¡Enhorabuena!
Usando el acelerómetro
Nuestro
teléfono tiene también un sensor que detecta si lo estamos moviendo.
Vamos a hacer que nuestra aplicación borre los datos que hemos metido
anteriormente si agitamos el teléfono.
1 En el Diseñador dentro de la categoría Sensors (sensores) verás el componente AccelerometerSensor (Sensor acelerómetro). Cógelo y arrástralo a tu aplicación.
2 Vuelve al Editor de bloques. Verás el nuevo componente "AccelerometerSensor1" en Screen1. Si lo seleccionas verás un evento llamado "when AccelerometerSensor1.Shaking do". Este evento se activa cuando el teléfono se agita bruscamente así que vamos a usarlo. Arrástralo y ponlo donde quieras.
Ya hemos visto que este bloque se activará cuando agitemos el teléfono, ahora tenemos que decidir qué queremos que pase cuando esto ocurra. En este caso queremos que se borre el nombre que ha metido el usuario, que se borre la frase de la pantalla, que se desactive el checkbox "en_rojo" y que nos avise con el sintetizador de voz.
3 Primero vamos a borrar el nombre que está guardado en el componente mi_textbox. Para ello coge un bloque "set mi_textbox.Text to" y mételo dentro del bloque marrón "when AccelerometerSensor1.Shaking".
4 Selecciona la categoría Text (texto) y de la lista que aparece, selecciona el primero " ". Ahora mismo no hay nada escrito entre las comillas, por lo que ya tenemos un espacio en blanco, es decir, un texto borrado.
5 Ahora únelo al bloque anterior "set mi_textbox.Text to". De esta manera borramos el nombre que el usuario había metido antes.
6 Ahora vamos a borrar el checkbox en_rojo. Coge un bloque "set color_rojo.Checked to" y ponlo también dentro del bloque marrón. Selecciona ahora la categoría Logic (lógica) y coge el segundo bloque "false" (falso).
7 Pega este bloque al anterior "set color_rojo.Checked to" así volvemos a dejar este componente limpio.
8 Para borrar la frase que está en el componente mi_etiqueta, coge un bloque "set mi_etiqueta.Text to" y ponlo junto a los anteriores.
9 Vuelve a coger un bloque " " de la categoría Text y pégalo al anterior bloque "set mi_etiqueta.Text to". Con esto limpiamos la frase de la pantalla.
10 Por último coge un bloque "call TextToSpeech1.Speak" y ponlo al final de los anteriores bloques.
11 Crea otro bloque de texto nuevo y escribe "borrando".
12 Pégalo al bloque "call TextToSpeech.Speak" anterior.
Tu programa tiene que quedar así:.
¿Funciona?
1 En el Diseñador dentro de la categoría Sensors (sensores) verás el componente AccelerometerSensor (Sensor acelerómetro). Cógelo y arrástralo a tu aplicación.
2 Vuelve al Editor de bloques. Verás el nuevo componente "AccelerometerSensor1" en Screen1. Si lo seleccionas verás un evento llamado "when AccelerometerSensor1.Shaking do". Este evento se activa cuando el teléfono se agita bruscamente así que vamos a usarlo. Arrástralo y ponlo donde quieras.
Ya hemos visto que este bloque se activará cuando agitemos el teléfono, ahora tenemos que decidir qué queremos que pase cuando esto ocurra. En este caso queremos que se borre el nombre que ha metido el usuario, que se borre la frase de la pantalla, que se desactive el checkbox "en_rojo" y que nos avise con el sintetizador de voz.
3 Primero vamos a borrar el nombre que está guardado en el componente mi_textbox. Para ello coge un bloque "set mi_textbox.Text to" y mételo dentro del bloque marrón "when AccelerometerSensor1.Shaking".
4 Selecciona la categoría Text (texto) y de la lista que aparece, selecciona el primero " ". Ahora mismo no hay nada escrito entre las comillas, por lo que ya tenemos un espacio en blanco, es decir, un texto borrado.
5 Ahora únelo al bloque anterior "set mi_textbox.Text to". De esta manera borramos el nombre que el usuario había metido antes.
6 Ahora vamos a borrar el checkbox en_rojo. Coge un bloque "set color_rojo.Checked to" y ponlo también dentro del bloque marrón. Selecciona ahora la categoría Logic (lógica) y coge el segundo bloque "false" (falso).
7 Pega este bloque al anterior "set color_rojo.Checked to" así volvemos a dejar este componente limpio.
8 Para borrar la frase que está en el componente mi_etiqueta, coge un bloque "set mi_etiqueta.Text to" y ponlo junto a los anteriores.
9 Vuelve a coger un bloque " " de la categoría Text y pégalo al anterior bloque "set mi_etiqueta.Text to". Con esto limpiamos la frase de la pantalla.
10 Por último coge un bloque "call TextToSpeech1.Speak" y ponlo al final de los anteriores bloques.
11 Crea otro bloque de texto nuevo y escribe "borrando".
12 Pégalo al bloque "call TextToSpeech.Speak" anterior.
Tu programa tiene que quedar así:.
¿Funciona?
