Juego del gato en
App Inventor

////////////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////////

App Mentimeter

Progresión: utiliza herramientas de comunicación digital en forma directa, o emisión y descarga continua, transmisión por secuencias, lectura y difusión continuo para difundir información, conocimientos, experiencias y aprendizajes de acuerdo a su contexto personal, académico, social y ambiental.

Meta específica: edita documentos en herramientas ofimáticas, según la necesidad del usuario.

El programa que realizaremos en esta sesión será el juego del "GATO".

De nueva cuenta, ingresa a http://appinventor.mit.edu

e inicia un nuevo proyecto. Ponle por nombre GATO.

DISEÑO.

Inserta una disposición tabular desde la Paleta y Disposición:

Como es un juego de gato, hay que modificar la disposición a 3 columnas y 3 registros:

Agrega un botón en cada una de las disposiciones tabulares, de tal forma que sean las 9 posiciones posibles en el juego:

Con el fin de dejar preparado el juego, borra el texto de cada uno de los botones:

Ahora en Screen, centra la disposición tabular creada tanto horizontal como verticalmente:

Agrega un botón al que cambiarás el NOMBRE y el TEXTO llamándolo RESET. Desde Sensores agrega un Reloj y desde Interfaz de usuario, un Notificador.

NOTA: Estos dos últimos componentes agregados los verás abajo de la pantalla:

PROGRAMACIÓN DE EVENTOS

Agrega dos variables. Asigna el nombre de la primera como TURNO que nos servirá para que cada jugador vaya tomando su turno y, a la segunda variable, asígnale el nombre CASILLA que representará cada uno de los 9 botones agregados.

Inicializa la variable TURNO a 1 y la variable CASILLA a una lista vacía.

Desde Screen1 agrega Cuando Screen1.Inicializar.Ejecutar.

Desde la variable CASILLA carga la opción poner global.CASILLAS.to y construye con construye una lista las opciones de las 9 casillas de nuestro juego:

Desde DisposiciónTabular1 agrega a la lista los 9 botones correspondientes:

Modifica el ancho de cada botón utilizando:

Desde Control la opción

para cada elemento en la lista.ejecutar

combinándolo desde una opción que está hasta abajo

Cualquier componente -> Cualquier botón

la opción

poner Botón.Alto.del componente.como

De la variable CASILLA, inserta

tomar Global CASILLLA y divide entre 3 el ancho de la pantalla para que los botones queden homogéneos.

Duplica este bloque para determinar el Ancho de las casillas.

NOTA: esto que acabas de realizar es una forma muy eficiente de modificar las propiedades de varios elementos al mismo tiempo.

Utilizaremos el mismo truco anterior para modificar el Tamaño de letra de todas las casillas.

Este estará dividido entre 5 en lugar de 3.

De la misma forma será necesario activar (Habilitado) todos los elementos.

Crearemos un procedimiento RESET repitiendo algunos de los elementos de la pantalla inicializada y, habilitaremos la secuencia del botón RESET que agregamos a la pantalla de inicio:

A continuación programaremos la lógica del clic de cada uno de los botones, que será nuestro juego. Para ello es necesario cambiar la condición de cada botón activado (Habilitado = falso) con el fin de que ya no se pueda elegir. Como somos nosotros los que jugamos, le asignaremos una X a nuestro juego. Quitamos de la lista ese botón para jugar y cambiamos el turno al jugador 2, o sea, la computadora.

Finalmente, agregaremos el procedimiento "clave" que momentáneamente solo quedará indicado y que contendrá toda la lógica del juego:

Este mismo código lo replicaremos en los botones restantes, solo ten cuidado en asignar el botón correspondiente en cada caso:

Ahora es necesario construir el módulo COMPROBAR.

Lo primero que habrá que hacer es validar si el turno ya le corresponde a la computadora.

Recuerda que determinamos que TURNO 1 somos nosotros y TURNO 2 es la computadora.

El proceso de juego es:

1) Elegir al azar uno de los botones sobrantes, ya que nosotros hicimos la primera tirada

2) En la casilla seleccionada escribir la letra "O" que representará el círculo del juego

3) Deshabilitar la opción de elección posterior

4) Eliminar de la lista el botón que seleccionó la computadora

Finalmente, hay que agregar la condición de lo que sucedería cuando ya no hay casillas por elegir. De no agregar esto el programa generaría un error.

Hasta este punto, si haces la prueba con lo ya programado verás que funciona correctamente, lo siguiente entonces es construir la lógica que permita jugar el gato correctamente y determinar el ganador.

Lo primero que haremos es modificar la condición SI - ENTONCES aprovechando las opciones de mutación que tiene app inventor y reacomodar los módulos que ya habíamos construido hacia la parte de abajo para que los módulos que agreguemos se ejecuten primero.

Ahora iremos barriendo las posibles combinaciones para ganar en el juego.

La primera combinación es la de horizontal, línea superior:

Los bloques que habrán de construirse deberán: obtener el texto de los 3 botones y unirlos en una sola cadena y comprobar que el texto unido es igual al texto "XXX" para determinar que hemos ganado. Utiliza la característica "mutante" del bloque unir para concatenar el texto de los 3 botones. Utiliza un notificador para mostrar el texto de que ganaste el juego.

Necesitaremos en total 9 comprobaciones para determinar que hemos ganado.

8 corresponden al juego que estamos haciendo nosotros y una, al juego de la computadora.

Al finalizar cada una de estas comprobaciones y la notificación de que hemos ganado, será necesario volver a resetear el juego.

Utiliza la condición "mutante" del si para agregar las condiciones faltantes:

Con lo anterior determinamos las formas de ganar. Ahora necesitamos agregar de igual manera las 8 formas de perder, o dicho de otra forma, cuando la computadora nos gana. Para ello utilizaremos nuevamente la opción mutante de la app y copiar y pegar la misma secuencia de bloques como lo hicimos anteriormente, pero ahora en lugar de "XXX" con "OOO".

También hay que agregar la opción de empate:

Finalmente, cambiaremos un poco el diseño de la pantalla ocultando la barra de estado y la barra de título:

Haz pruebas par ver como funciona.

Tarea Semana 10

Productos y actividades solicitadas en clase:

T19.C1 Participación activa en clase
T20.C1 Programa en App Inventor con las especificaciones solicitadas

Productos DE TAREA A ENTREGAR:

T21.C2 Conclusiones del corte
T22.C2 Autoevaluación del corte
T23.C2 Comentario del Capítulo 12
T24.C2 Comentario del Capítulo 13

Juego del gato en App Inventor

Juego del gato en
App Inventor