Estructuras de control (if-else) en AppInventor
En esta entrada se aborda el tema de la estructura de control, particularmente el de if-else (si – entonces) en el appinventor para una aplicación en android. El ejercicio es que la aplicación pueda identificar si un número dado es par o impar. Esto se hará de la siguiente manera:
Descripción
La actividad consiste en que el usuario escriba un número en un cuadro de texto, al pulsar el botón, se muestre en una etiqueta la leyenda: “El número es par” o “El número es impar” y posteriormente se escuche mediante un texto a voz, lo que tiene escrito la etiqueta. Para ello se va a necesitar los siguiente:
Requisitos
Para poder llevar acabo esta práctica se requiere de lo siguiente:
- Una cuenta en el appinventor.
- Crear un nuevo proyecto en el appinventor.
- Un cuadro de texto.
- Un botón.
- Un texto a voz.
Partiendo de que ya se tiene creado el proyecto nuevo en el appInventor, y que se tiene una interfaz de usuario similar a la que se muestra en la imagen 1. Se ira a la sección de bloques. Si no recuerdas como hacer un nuevo proyecto puedes ir al menú “proyecto” hacer clic en la opción “comenzar un nuevo proyecto” se mostrará una ventana donde se solicita el nombre del nuevo proyecto, para este ejercicio se escribió el nombre de “parImpar” se puede escribir el que quieras. Luego pulsas en aceptar o en enter (en el teclado) y después arrastras los objetos Cuadro de texto, botón, etiqueta y texto a voz, y lo se suelta en el lienzo de trabajo.
Creación de bloques
Lo primero que se va a realizar es la declaración de las variables que se van a utilizar, para esta práctica se requiere dos variables una que va a contener el valor numérico que introduce el usuario y la que va a guardar el valor de la operación que determina si un número es par o impar. Para determinar si un número es par o impar se utilizará el siguiente proceso:
- El número dado se dividirá entre dos
- El residuo se evaluara si es cero, el número que se dividió es par, sino es impar
Para crear las dos variables se va a los componentes integrados se pulsara sobre la opción “integrados” y se va a elegir el bloque que dice “Inicializar global como nombre ” se debe de tener dos bloques (ya que, son dos variables que se van a utilizar). Después se debe de ir al componente de “mátematicas” donde se elija el bloque que tiene un cero. Vea imagen 2.
Ahora sigue el procesamiento de ese número dado para identificar si es par o impar. Para ello se pulsara sobre el componente de variable y se selecciona el bloque que dice “poner a”, después se regresará a los componentes de cuadro de texto y se elige el bloque que dice: “campo de texto1 . texto”. Al final debe de quedar algo similar como lo que se muestra en la imagen 3.
Ahora que ya se tiene el valor que ha introducido el usuario, hay que regresar a la sección de “Variables” donde se va a eligir nuevamente un bloque que diga “poner a”, posteriormente se debe de ir a los bloques de matemáticas en donde se debe de seleccionar el bloque que dice “modulo de “. Recordad que la obtención del residuo en regularmente se hace con el símbolo de porcentaje (%). Ahora llega el turno de tomar de los bloques de variable el que lleva el nombre de “tomar ” y como la operación que se va a realizar es con una constante hay que tomar del bloque de matemáticas el que tiene un cero. Finalmente en su lienzo de bloques se debe de tener algo como lo que se muestra en la imagen 4.
Ahora llega el turno de la evaluación del calculo que se ha realizado, para ello se hará clic sobre la opción de “logica” (tiene un color verde) se encuentra en los controles de interfaz de la columna de Bloques. Y se debe de pulsar sobre el que tiene el símbolo de igual. Luego hay que ir a buscar el bloque que tiene el texto de “tomar” que se encuentra en la sección de variables, posteriormente se debe de colocar el bloque que tiene el texto “cero”, que es con lo que se va a comparar para evaluar el residuo de la operación. Y finalmente hay que ir a los bloques de control (tiene un color amarillo) y al pulsar sobre el se podrá notar que se tiene una gran variedad de controles que van desdee el if, if-else, switch y ciclos. Si todo ha ido bien se debe de tener una pantalla como la que se muestra en la imagen 5.
Una vez que se ha evaluado corresponde enviar los resultados a la etiqueta, para los casos en que sea par o impar el número. Para ello se va a ir los bloques del componete “Etiqueta” y se debe de elegir el que dice: “poner etiqueta1.texto como” se va a necesitar dos así como dos uniones, para poder concatenar el número y la leyenda “Es par” o en su caso “es impar” si se quisiera que la leyenda dijera “El número es par”, se debe de notar que se esta haciendo tres uniones, que son: “el” + número + “es par” por lo que se necesitaría dos uniones para cada caso. Por el momento se dejará de la forma sencilla: número `+ “es par”. Finalmente si todo ha salido bien se debe de tener un lienzo similar como lo que se ve en la imagen 6.
Es momento de agregar el bloque de texto a voz, este va a permitir que se lea lo que dice la etiqueta. para ello se hará clic en el componente Texto a voz, y se debe de elegir el bloque que dice: “llamar textoAVoz1. hablar mensaje” (es de color morado), y del componente etiqueta se va a requerir el bloque que tiene un texto como : “Etiqueta1.texto”. Debe de quedar un lienzo como el que se muestra en la imagen 7.
Se puede agregar dos bloques de texto a voz para que se ejecute en cada caso. Incluso podría usarse una variable que contenga el resultado y después de pasar la evaluación enviarla a la etiqueta, esto optimizaría el código en no usar al rededor de seis bloques.
Finalmente es hora de agregar el bloque que contendrá a todos los demás bloques, el del botón, que cuando se pulse debe de ejecutar todo los bloques, para ello hay que ir al componente “boton” y agregar el bloque que dice “clic”. Debe de tenerse algo como lo que se muestra en la imagen 8.
Ahora es momento de introducir “código” a los bloques y de conectarlos. Los códigos que se introducirá son: El nombre de las variables y los textos a mostrarse en la etiqueta. Las variables que se usaran son las siguientes:
- num, para guardar el número que introdujo por el cuadro de texto el usuario.
- rpi, que guardara el resultado del residuo o modulo de la división entre dos.
En la imagen 9 se aprecia todo el ensamble que se hizo para crear la “inteligencia” y funcionalidad de que la app, pueda identificar que número es par o impar. Sin embargo en la imagen 10 se observa, en la parte de arriba el resultado final del armado de los bloques y en la parte de abajo se nota la “optimización” al usar una variable que guarde el texto completo en vez de enviarlo directo a la etiqueta. La misma operación que se hizo con la variable (las concatenaciones) se puede hacer con la etiqueta y el texto a voz.
Para cerrar esta entrada, en el vídeo 1 se muestra la creación del proyecto, la generación de interfaz de usuario, y el ensamble de los bloques el entorno del appinventor. El vídeo 2 muestra la ejecución de lo que se creo en dicho entrono. Espero que la recreación de esta praáctica sea mucho mas fácil y aporte a sus conocimiento. Espero sus comentarios.