Tutorial de un juego de damas en AppInventor
En este tutorial, veremos como realizar un juego de damas en AppInventor, usando conocimiento que aprendimos en el tutorial anterior, acerca de las listas, y también usando cosas de los talleres anteriores, como el uso de imágenes.
Como primera cosa, necesitamos las imágenes que utilizaremos en nuestra aplicación, las cuales serán el tablero del juego, y las fichas. Podría explicarles como realizar esas imágenes en paint, pero es mejor que se las entregue, las cuales podrán descargar acá en formato comprimido.
Luego de descargarlas, en la parte de diseñador de AppInventor, debemos arrastrar el lienzo a la pantalla, y junto con el lienzo debemos arrastrar 16 SpriteImagen al lienzo. ¿Por qué? Porque son 16 las fichas que utilizaremos en el juego. Primero, al lienzo le debemos poner la imagen del tablero, y a 8 imágenes les pondremos la ficha azul, y a las restantes, la ficha roja. Luego las ubicaremos en sus posiciones, lo que nos debería quedar algo parecido a esto:
Para empezar a programar el juego, nos dirigiremos a la parte de Bloques, donde inicializaremos dos listas, que serán las listas de fichas azules y rojas. Para esto, haremos que cuando se inicialice la aplicación, le asignaremos las imágenes que teníamos a las respectivas listas, de la siguiente forma:
Luego, se debe crear el algoritmo para que las fichas se muevan. Para esto, crearemos un procedimiento, el cual realice ese algoritmo, que mueva una ficha azul o una roja en diagonal a su lugar indicado. Para esto, usaremos el siguiente bloque:
Ahora ese procedimiento lo queremos utilizar cuando la ficha sea presionada y sea soltada, ya que como podemos ver al principio, necesita componentes x, y y una ficha para funcionar. Para esto ocuparemos dos bloques, uno presionar otro soltar, de la siguiente forma:
El primer bloque se debe hacer también para las fichas azules, y si se dan cuenta, los dos bloques anteriores se deben hacer no solo para las fichas rojas, sino que usando el mismo principio, para las 8 fichas azules restantes. Puede parecer una cosa muy tediosa y dificultosa, pero si nos damos cuenta, es casi el mismo bloque que se debe replicar, por lo que se puede utilizar la función Duplicar de AppInventor, aliviándonos bastante trabajo.
Por último, nos falta la mecánica más importante del juego, que si una ficha es "comida" por otra, debe desaparecer del tablero. Para esto también tendremos que replicar un bloque para cada ficha, pero es la opción más fácil que tenemos. ¿Cómo haremos esto? Pues, deshabilitando e invisibilizando al componente tocado. Por otro lado, deberemos agregar un notificador (como el del taller pasado) el que nos indicará cuando hagamos un movimiento ilegal (en este caso, tratar de "comerse" una pieza propia. Este bloque quedará de la siguiente forma:
Como dijimos anteriormente el bloque anterior debe replicarse con todas las fichas, con pequeños cambios. Por ejemplo, si la ficha es azul, deberemos cambiar el "tomar global listaRojas" por "tomar global listaAzules".
Con esto damos término al tutorial del juego de damas, espero les haya gustado :).
Comentarios
Publicar un comentario