Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Game Development
  2. From Scratch
Gamedevelopment

Hacer un juego de Match-3 en Construct 2: Más intercambio, puntos y coincidencias

by
Difficulty:BeginnerLength:LongLanguages:
This post is part of a series called Make a Match-3 Game in Construct 2.
Make a Match-3 Game in Construct 2: Points, Matching, and Gravity
Make a Match-3 Game in Construct 2: Block Movement

Spanish (Español) translation by Elías Nicolás (you can also view the original English article)

Ahora estamos a mitad de camino de esta serie, y hasta ahora hemos cubierto mucho. En el tutorial anterior, agregamos un sistema de puntos a nuestro juego, finalmente aplicamos "gravedad" a los bloques, y mejoramos nuestro sistema de concordancia. En este tutorial vamos a hacer algunas pequeñas mejoras a nuestro sistema de intercambio, añadir el texto de los puntos flotantes que puede ver en la versión final del juego y terminar nuestro sistema de concordancia de una vez por todas.


Demostración final del juego

Aquí está una demostración hacia el juego final que estamos haciendo a través de esta serie:




1. Mejora de la mecánica de intercambio

En este momento, el juego tiene un mecanismo de intercambio muy simple implementado. Si bien el sistema que utilizamos para realizar estos intercambios es muy eficaz, hay dos problemas que se pueden encontrar mientras se juega, y ambos deben ser arreglados antes de ir más lejos.

Estas cuestiones surgen de la misma idea: que el sistema de intercambio no tiene en cuenta las fronteras del campo de juego.

A la izquierda, a la derecha

¿Que significa exactamente? Bueno, primero, si querías, podrías mover un bloque fuera del campo de juego a la izquierda o a la derecha, haciendo un intercambio como el ilustrado a continuación:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Si entras en el juego y haces este intercambio, verás que el juego no hace nada para detenerte y actúa como si el campo del juego continuara para siempre en una dirección horizontal. La razón de esto es que, en este momento, el campo de juego continúa para siempre horizontalmente.

Dado que nunca definimos las fronteras izquierda y derecha del campo de juego, o incluso que el campo de juego tiene bordes izquierdo y derecho, el juego nunca intenta detener al jugador de mover el bloque más al lado. Este problema también aparece cuando cambia el otro borde del campo de juego también.

Para resolver este problema, agregaremos algunas condiciones nuevas al Evento Block > On DragDrop drop. Vaya a este evento y añada esta condición al Sub-Evento que comprueba los intercambios a la izquierda:

Añada ahora esta condición al Sub-Evento que comprueba los intercambios de derecha:

Los eventos de intercambio izquierdo y derecho deberían verse así:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Estas nuevas condiciones que hemos añadido están siendo utilizadas por los eventos de intercambio como un cheque para asegurarse de que el intercambio está dentro de las fronteras horizontales del campo de juego. El primero asegura que la posición en la que el bloque sería intercambiado no está más a la izquierda que los bloques más a la izquierda y la segunda asegura que la posición en la que el bloque está siendo intercambiado no está más lejos a la derecha que la posición derecha la mayoría de los bloques.

Con el segundo, utilicé una fórmula con Block.Width para encontrar dónde están los bloques más a la derecha para asegurar que, si el tamaño de los bloques cambiaba, no impediría que esta condición funcionara.

Si ejecuta el juego ya no debe ser capaz de hacer intercambios horizontales que poner bloques fuera del área de juego.

Fuera de los límites

El otro problema que tenemos es que el juego no te impide intercambiar un bloque debajo del campo de juego. Abre el juego y trata de hacer un intercambio como el que he ilustrado en esta imagen:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Después de hacer este intercambio, usted debería haber visto el bloque esencialmente desaparecer detrás de la parte inferior del campo de juego, y los bloques que estaban por encima de él deberían haber caído para llenar el espacio ahora vacío. Una vez más, este problema es porque nunca definimos dónde está el borde inferior del campo.

En el tutorial anterior declaramos que los bloques deben dejar de caer después de alcanzar cierta altura, pero nunca dijimos si estaba bien que un bloque estuviera por debajo de esa altura al realizar un intercambio.

Arreglar esto será tan simple como los dos temas anteriores. Vaya al sub-evento que comprueba los intercambios hacia abajo y agregue esta condición:

Su código para esta sección debería tener el siguiente aspecto:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Al igual que la condición anterior, esto asegura que el intercambio no colocar el bloque en un área fuera del campo de juego. En este caso, mira el área debajo del campo del juego.

Si usted prueba su juego en este punto, ahora debe ser incapaz de hacer intercambios que ponen el bloque debajo de la base del campo de juego.

En este punto, hemos resuelto los problemas con el sistema de intercambio, y podemos pasar a hacer nuestro sistema de puntos aún mejor.


2. Texto de los puntos flotantes

En este momento, nuestro sistema de puntos es bastante eficaz. Funciona de la manera deseada, y ya muestra todo correctamente. A pesar de eso, sin embargo, si usted dio el juego a un jugador y se sentó con él, no podría ser capaz de decir exactamente cuántos puntos que estaban recibiendo de cada grupo que hicieron, ya que el juego puede moverse rápidamente.

Para resolver este problema, vamos a agregar pop-ups de texto que muestran cuántos puntos el jugador hace de cualquier grupo que forman. Esto agregará un toque visual adicional al juego, y dejará claro al jugador cuán valiosos son los grupos más grandes.

Creación del propio texto

Antes de que podamos comenzar a agregar la funcionalidad, necesitamos crear un nuevo objeto que actuará como el pop-up de texto, por lo que sigue estos pasos.

  1. Vaya a Layout 1.
  2. Inserte un nuevo objeto Text:
    1. Name: FloatingPointsText
    2. Layer: Game Field
    3. Position: 616, 250
    4. Size: 127, 43
    5. Text: 0
    6. Font: Calibri, Bold, 24
    7. Color: 255, 255, 255
  3. En la pestaña Proyectos Projects de la derecha, haga clic con el botón secundario en el objeto FloatingPointsText y elija Behaviors.
  4. Agregue un nuevo comportamiento Fade y cierre la ventana Behaviors.
  5. En las propiedades en el lado izquierdo de la pantalla, cambie el Fade Out Time a 1.25.

El objeto que acabamos de crear va a ser usado para crear el texto flotante que le dice al jugador cuántos puntos le dará un grupo dado. Ahora que realmente tenemos este objeto, tenemos que implementarlo para que cuando el jugador haga una coincidencia, generará una nueva instancia del objeto y cambiará el texto para mostrar el número apropiado de puntos.

Generando el texto

Para generar el texto de puntos vamos a agregar dos nuevas acciones a las comprobaciones de NumMatchesFound en la función FindMatches.

Vaya a la función FindMatches y agregue estas dos acciones al final de cada cheque NumMatchesFound > 3:

Su función FindMatches debería tener el siguiente aspecto:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Entonces, ¿qué están haciendo estas Acciones? La primera Acción crea el objeto FloatingPointsText encima del primer bloque del grupo y la segunda multiplica el número de bloques en el grupo por 10, al igual que hace nuestra fórmula de puntos y establece el texto del nuevo objeto en ese número .

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Si ejecuta el juego en este punto, debe notar que el texto no se está moviendo en absoluto. Para solucionar este problema vamos a agregar un nuevo Evento a nuestro juego.

Realización del movimiento del texto

Vuelva a la Event Sheet 1 y añada un nuevo evento:

Tu nuevo Evento debería tener este aspecto:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Si ejecuta el juego ahora, verá que el texto se mueve.

En este punto, nuestro FloatingPointsText está funcionando de la manera que lo deseamos, pero es posible que haya notado un problema leve ahora que el sistema está en su lugar. El problema en sí se deriva de la forma en que funciona el sistema de concordancia, y ahora que podemos ver que todavía hay un problema con la coincidencia, podemos establecer sobre la fijación de este problema final, y poner nuestro sistema de concordancia a la cama.


3. Completar el sistema de coincidencia

Si aún no sabes de qué tema estoy hablando, entra en el juego y haz un grupo que contenga cuatro bloques. Una vez que su grupo está hecho, usted debe ver algo similar a lo que tengo en la imagen de abajo:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Como puede ver, en realidad tenemos dos instancias de los objetos de texto flotante. Si usted hace un grupo con cinco bloques, el problema se vuelve aún peor y verá en realidad tres instancias de los puntos de texto.

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

La razón de este problema se basa en la forma en que se detectan coincidencias. En este momento, nuestro sistema de concordancia mira cada bloque individualmente, y mira en la dirección correcta, y la dirección hacia abajo, para encontrar coincidencias. Debido a esto, el sistema de concordancia es en realidad encontrar tres grupos de diferentes tamaños aquí, aunque en realidad es sólo un gran grupo.

El primer grupo se encontrará cuando comience con el bloque A, y contendrá cinco bloques:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

El segundo grupo se encontrará cuando comience con el bloque B, y contendrá cuatro bloques:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Y el tercer grupo se encuentra cuando comienza con el bloque C, y contendrá tres bloques:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Por lo tanto, en este momento, nuestro sistema de concordancia es muy ineficiente - y roto - ya que está comprobando los mismos bloques varias veces y registrar más grupos de lo que realmente son.

Cómo solucionaremos esto

La solución de este problema es en realidad mucho más simple de lo que podría parecer al principio.

La cuestión aquí se deriva principalmente del hecho de que el sistema de concordancia no tiene forma de saber si el bloque que está empezando es en realidad el comienzo del grupo. Si pudiéramos garantizar que sólo miramos los bloques que estaban más a la derecha o más arriba, dentro de los grupos a los que pertenecían, entonces el sistema de concordancia sería efectivo tal cual.

Por lo tanto, todo lo que tenemos que hacer es añadir una condición o evento que asegura que no hay bloques de coincidencia arriba o hacia la izquierda del bloque con el que empezamos y para decirle a la función cuando ha realizado esta comprobación, para que pueda Proceda normalmente si el bloque que está mirando es el inicio del grupo.

Lo primero que agregaremos es un nuevo parámetro para la función CheckMatches. Este parámetro será un entero y será 1 o 0.

Si el parámetro es 1, indicará a la función que necesita para realizar la comprobación para asegurarse de que está mirando el bloque inicial en el grupo; Si es 0, indicará a la función que ya ha realizado esta comprobación, y puede proceder normalmente para determinar si el grupo está compuesto por tres o más bloques.

Vamos a hacerlo

Por lo tanto, comience por ir a la función FindMatches. En esta función se llama CheckMatches dos veces. Puesto que esta es la primera vez que llama a CheckMatches para cualquier bloque que esté buscando, debe agregar un nuevo parámetro a cada una de estas llamadas de función y establecerlo en 1 para que verifique si el bloque que está viendo es el Comienzo de un grupo.

Su función FindMatches ahora debería verse así, y he resaltado las dos sentencias modificadas para su conveniencia:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Ahora que estamos diciendo a CheckMatches cuándo necesita realizar este nuevo cheque, necesitamos realmente agregar la nueva comprobación para que se realice. Vaya a su función CheckMatches y agregue este nuevo sub-evento como el primer sub-evento:

Antes de terminar de modificar la función CheckMatches, también debe agregar una instrucción Else a la parte superior del evento original para la función CheckMatches y debe agregar el nuevo parámetro a la llamada de función CheckMatches y establecerlo en 0.

El nuevo código para la función CheckMatches debería tener este aspecto:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

El Evento que agregamos hace exactamente lo que he descrito anteriormente. En primer lugar, mira el bloque anterior, o a la izquierda del bloque inicial en el que pasa.

Si ese bloque es del mismo color que el que pasaste, no hace nada, ya que sabe que el bloque que pasaste no es el primer Bloque en ese grupo.

Por otro lado, si no es del mismo color que el bloque que pasaste, el cheque original se produce debido a la declaración Else que acabamos de agregar, y busca un grupo de tres o más bloques como lo haría normalmente.

Si prueba el juego en este punto y crea un grupo con más de tres bloques, debería ver solo un objeto de texto flotante que le indique cuántos puntos valió ese grupo.


Conclusion

Ahora que hemos terminado de arreglar todas estas características, y finalmente hemos completado nuestro sistema de concordancia, estamos listos para implementar el sistema de movimiento. Dado que ya hemos hecho mucho en este tutorial, y como el sistema de movimiento nos obliga a hacer múltiples sistemas complejos, voy a esperar hasta el siguiente artículo para iniciar el sistema de movimiento.

Si usted está ansioso por empezar a trabajar en él, considere algunas de estas cosas. Obviamente lo primero que tienes que hacer es implementar el movimiento en sí. Para eso, intente usar un sistema similar al que usamos al hacer que los objetos de texto de puntos floten. A partir de ahí, empezar a considerar cómo cambiaría la velocidad a la que se mueven. Por último, ¿cómo va a generar nuevas filas de bloques para el jugador, y cómo sabrá cuándo generar nuevas filas?

Tómese su tiempo para considerar estas cosas, y te veré aquí la próxima semana para la próxima gran entrega de la serie.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.