La clonación de los clásicos: PacMan

1
  • 0 favourites

Index

Tagged

Attached Files

The following files have been attached to this tutorial:

.capx

omnomnomagon-returns.capx

Download now 408.05 KB

Stats

14,165 visits, 17,842 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Movimiento basado en rejilla

Ahora, vamos a configurar el sprite PacMan.

Crea un nuevo Sprite, y cámbiale el nombre a Pacman. En la ventana de cuadros de animación, haz clic derecho y elige la opción "Import sprite strip..." y selecciona la imagen del principio de este tutorial que contiene el PacMan y las imágenes de fantasmas. El número de celdas horizontales es 14; el número de celdas verticales es 4. Elimina todas las tramas que no contienen una imagen de PacMan. En el panel Propiedades, establezca la velocidad a 8 y Loop en "Yes". Luego, en la ventana de animaciones, haz clic en "Default" y seleccione "Duplication". Realiza esto un total de tres veces, quedando con 4 animaciones. (Esto ahorra la molestia de recrear cada animación del spritesheet original). Haz clic en cada una de las animaciones y cambiarles el nombre a "A0", "A90", "A180", "A270". En la animación A0, borrar todos los marcos excepto los dos donde PacMan se enfrenta a la derecha (de cara a un ángulo de 0 grados). Del mismo modo, para las animaciones A90, A180 y A270, borrar todos los marcos excepto los donde PacMan enfrenta a Abajo, a la Izquierda y a Arriba respectivamente. Cierra el Editor de imágenes; hemos terminado aquí.

A continuación, añade el comportamiento de la bala (Bullet behavior) al sprite PacMan, y establecer el valor predeterminado de la velocidad a 0. También, agregar las siguientes variables de instancia a PacMan.:

* Direction (número) - Almacena el ángulo de movimiento que PacMan tiene actualmente. Establecer el valor inicial 0.

* MoveDuration (número) - Almacena el número de segundos necesarios para PacMan para viajar el ancho de 1 casilla de rejilla. Establecer el valor inicial 0. (Siéntase libre de ajustar esto más adelante si lo desea.)

* TargetX (número) - Almacena la coordenada X de la cuadrícula en que PacMan esta viajando. Establecer el valor inicial 0.

* TargetY (número) - Igual que el anterior, pero para la coordenada Y.

A continuación, agregue un objeto Teclado para al "layout". También agregue otro elemento sprite y cambiarle el nombre a "CollisionDetector" (o algo similar). Para la imagen, puede usar el cuadrado de abajo:

Sin embargo, cualquier imagen cuadrada más pequeña que sus cuadrículas funcionará. En el panel de propiedades, establezca la visibilidad inicial del sprite CollisionDetector a "invisible".

Finalmente, nos dirigiremos a la Hoja de Eventos. En primer lugar, añadir una variable global llamada "TileSize" y establezca su valor en 32 (el ancho, en píxeles, de cada cuadrícula).

A continuación, haga clic con el botón derecho para agregar un grupo, cambie el nombre a "PacMan Movement". Incluso si tienes un número limitado de eventos, el uso de grupos para organizar el código es fundamental para mantenerlo organizado y legible.

En lugar de escribir todos los eventos, la siguiente captura de pantalla muestra los eventos que se necesitan. Presta especial atención a que los eventos son eventos secundarios de los demás, el código se explicará después de la imagen.

Tenemos el control de movimiento de PacMan por "turning the bullet speed on and off", es decir, poniéndolo a cero y valores distintos de cero. Desde PacMan sólo puede moverse por plazas enteras de cuadrícula, sólo se procesa la entrada de teclado cuando ha terminado un movimiento y se centró en una cuadrícula, que se indica con velocidad de una bala de PacMan igual a cero.

Por lo tanto, cuando la velocidad de una bala es igual a cero, comprobamos para ver si alguna de las flechas de dirección han sido pulsadas. Si es así, dejamos la instancia de variable "Direction" en el ángulo correspondiente (0 = derecha, 90 = abajo, 180 = izquierda, 270 = hacia arriba). A continuación, si cualquiera de las teclas de flecha han sido pulsadas (nótese el uso de un bloque OR aquí), se calcula las coordenadas X e Y de PacMan, almacenadas en las variables de instancia correspondientes, y estableciendo las coordenadas de CollisionDetector a ese lugar. Si el sprite CollisionDetector superpone con un sprite Wall, PacMan no puede moverse en esta dirección y nada más ocurre.

Sin embargo, si no hay solapamiento, la magia sucede. En este caso, establecemos velocidad de una bala de PacMan con el valor necesario para cubrir la cantidad de píxeles en cantidad MoveDuration de segundos. También establecemos el ángulo de la bala de movimiento para que PacMan se mueva en la dirección correcta. Converiendo "Direction" a una cadena de texto, también activamos la animación correspondiente de PacMan viajando en esa dirección (esto fue por eso que nombramos las animaciones en la forma en que lo hicimos, utilizando las más obvias) y a continuación, se utiliza el comando de espera del sistema. Lo realmente bueno de este comando es que los sucesos siguientes en la hoja de evento se ejecutarán (así, por ejemplo, los fantasmas que vamos a añadir más tarde continuarán en movimiento); sólo las acciones siguientes al comando wait se retrasan. (Para obtener más información, consulte el tutorial http://www.scirra.com/tutorials/56/how-to-use-the-system-wait-action.) Esperamos MoveDuration segundos, exactamente la cantidad de tiempo que PacMan necesita para completar el viaje a la siguiente cuadrícula. Debido a que la velocidad de la bala no es cero durante este tiempo, los acontecimientos mencionados no tendrán lugar hasta que el movimiento se ha completado. Finalmente, después de que se complete el comando wait del sistema, fijamos las coordenadas X e Y de PacMan a lo que debería ser (corrigiendo los errores fraccionales, esencialmente "snapping PacMan to the grid"), y pusimos la velocidad de vuelta a cero, lo que le permite a la hoja de evento procesar la entrada de teclado adicional para mover PacMan.

  • 0 Comments

  • Order by
Want to leave a comment? Login or Register an account!