miércoles, 24 de febrero de 2016

Trivial con App Inventor - Trivial completo (un jugador)

El juego consiste en lo siguiente:

Una ficha se va moviendo por el tablero. Cada vez que cae en una casilla, se hace una pregunta del color correspondiente. Cada pregunta acertada suma 150 puntos, y cada fallo resta 75. Si la ficha está en una casilla de "quesito", se consigue uno de ese color. Cuando se tienen los cuatro "quesitos", el juego finaliza.

1. Componentes:

  • Un lienzo con el tablero y una imagen sprite, en la que se pondrá por defecto la imagen 0.png (todas las imágenes de la ficha con quesitos pueden descargarse aquí. Una plantilla para hacer un tablero de 24 casillas puede descargarse aquí).

  • Un botón para el dado (dadoBoton), y una etiqueta que muestre lo que ha salido en la tirada (dadoEtiqueta)

  • Una etiqueta que diga Puntos: y otra etiqueta para almacenar los puntos conseguidos (puntosEtiqueta)

  • Una etiqueta que diga Pregunta: y otra etiqueta para mostrar la pregunta correspondiente (preguntaEtiqueta)

  • Un selector de lista para elegir la respuesta

  • Un botón para reiniciar



Visión general de la aplicación:



2. Variables:


  • Variable dado, que se inicia a 0

  • Variables de la ficha: variable casilla, que se inicia a 1. Variables de posición X y posición Y, que son listas y que pueden traerse de una de las aplicaciones anteriores. Variables para comprobar si tiene o no un quesito de un determinado color (amarillo, rojo, verde, azul), que son booleanas y que se inician todas a falso.

  • Variables de preguntas y respuestas. Se harán tres listas por cada color: una para las preguntas, otra para las respuestas, y otra para las respuestas correctas. También se iniciarán cuatro contadores (uno para cada color), todos a 1. Además, se iniciará una variable llamada respuestaCorrecta, que almacenará la respuesta correcta correspondiente a la pregunta que se hace en ese momento, y que se iniciará a 0.

  • Para los puntos no se hará una variable, pues se almacenarán directamente en la etiqueta.

3. Botón dado:

Se programa igual que en los ejercicios anteriores:

 4. Procedimiento preguntar:

Este procedimiento comprobará el color de la casilla en la que está la ficha. En función del color, cargará en la etiqueta de preguntas (preguntaEtiqueta) la pregunta correspondiente, en el selector de lista las respuestas correspondientes, y en la variable respuestaCorrecta, la respuesta correcta a esa pregunta. Además, aumentará en 1 el contador del color correspondiente:


5. Selector de lista:

En el selector de lista:

  • Se comprueba si la respuesta es correcta. Si es así, se aumentan los puntos en 150 y se llama al procedimiento quesito (para comprobar si hay que añadir un "quesito", y, en su caso, hacerlo). Si la respuesta no es correcta, disminuye los puntos en 75.

  • Se comprueba si se han conseguido todos los quesitos. Si es así, el juego finaliza. Si no, se habilita el dado para poder seguir jugando.

6. Procedimiento quesito

En este procedimiento se comprueba si se está en una casilla de "quesito" de algún color, así como si la ficha aún no tiene el "quesito" de ese color, para, en su caso, añadirlo.


7. Botón reiniciar

Debe poner todas las variables a sus valores iniciales:

8. Modificaciones

8.1. Distintas ventanas para preguntas y tablero

Si las preguntas que vamos a realizar son muy largas pueden no caber en la pantalla del móvil al tiempo que el tablero. Para evitar ésto haremos dos ventanas. En una de ellas aparecerán el tablero, el dado, los puntos, y el botón reiniciar. En la otra la etiqueta de pregunta y el selector de lista.

Las ventanas pueden hacerse con dos disposiciones verticales. En una, a la que podemos llamar juego,  situaremos el tablero y los botones y etiquetas que lo acompañan. En la otra, a la que podemos llamar preguntas, pondremos la etiqueta de preguntas y el selector de lista. Al iniciar la aplicación haremos visible la ventana juego e invisible la de preguntas:

Cuando vayamos a hacer una pregunta cambiarán las tornas, y habrá que hacer invisible la ventana juego y visible la de preguntas. Ésto se hace al principio del procedimiento preguntar:


Asimismo, tras elegir una respuesta, debe hacerse de nuevo visible la ventana juego, e invisible la de preguntas. Estos bloques se añadirán al principio del de selector de lista:



El problema al hacer ésto es que, inmediatamente después de apretar el botón dado, cambiamos de ventana. No da tiempo ni siquiera a ver en qué casilla hemos caído. Para retardar un poco el cambio de una ventana a otra habrá que añadir un componente reloj, que se programará así:

  • La propiedad time enabled se deshabilitará de inicio, y time interval se pondrá a los milisegundos que deseemos que tarde en cambiar de pantalla (en este caso 1500, o sea, segundo y medio):




  •  Al final del bloque del botón dado se quitará la llamada al procedimiento preguntar, y se sustituirá por un bloque que habilitará el temporizador (pondrá time enabled a verdadero).


  • Por último, llamaremos al procedimiento preguntar cuando lo indique el temporizador, al mismo tiempo que lo deshabilitaremos de nuevo:

Asimismo, del botón reiniciar sobran los siguientes bloques (ya no son necesarios porque cambiamos de ventana):



8.2. Clic involuntario en el botón reiniciar

 Puede ocurrir que, involuntariamente, se apriete el botón reiniciar, por lo que convendría pedir una confirmación de que realmente se desea hacer ésto. Para ello primeramente colocaremos todo lo que hay dentro del botón reiniciar en un procedimiento del mismo nombre:

El botón reiniciar se programará de manera que nos muestre un aviso preguntando si realmente se desea reiniciar el juego:

Finalmente, después de elegir, si se ha elegido SÍ, se llamará al procedimiento reiniciar. En caso contrario continuará el juego:

8.3. Puntuación negativa en color rojo

Añade los bloques necesarios para que los puntos aparezcan en color rojo en caso de ser negativos, y de color negro si son positivos.



Puedes descargarte la aplicación en este enlace.

1 comentario: