Parte 5: Agregar monedas y puntos | hyperPad Documentation

Loading...

Logo
Guía Completa - Creación de un Juego de Plataforma

Parte 5: Agregar monedas y puntos

Last updated September 19, 2015

Introducción

Con la Parte 4 completada, ahora deberías tener un nivel y un personaje jugable para correr y saltar.

Ahora necesitamos dar un propósito a nuestro jugador. Para esta parte del tutorial, agregaremos monedas coleccionables y una puntuación para llevar un registro de ellas.

Las monedas escondidas en bloques son una de las características más icónicas de Mario. Comencemos este tutorial creando esa característica.

Escondiendo Monedas en Ladrillos

Golpeando el Ladrillo

Haremos nuestro primer ladrillo de manera que podamos modificarlo rápidamente para que contenga tantas monedas como necesitemos. Una vez que el ladrillo esté completo, puedes duplicarlo y colocarlo donde quieras.

Este tutorial se basa en la Parte 4 y asume que has ramificado el proyecto de la Parte 4 desde el hub.

Comienza seleccionando uno de los ladrillos que contendrán monedas. Desde las propiedades del objeto, toca el botón "Comportamientos" para abrir el editor de comportamientos.

Desde la categoría Objeto, añade el comportamiento Colisionado. El comportamiento Colisionado desencadenará un evento cada vez que 2 objetos especificados se toquen entre sí.

Toca el comportamiento Colisionado que agregaste para ver sus propiedades. Puedes ver que tiene 2 cajas para objetos seleccionables (Referidos como Objeto A y Objeto B). El primero (Objeto A) está seleccionado para ti, y es el al que estás aplicando los comportamientos. Puedes tocar para cambiar esto si lo deseas, pero lo dejaremos así.

La caja vacía es para tu segundo objeto (Objeto B), contra el que el comportamiento de colisión será verificado. Toca la caja vacía y selecciona tu personaje jugador que agregaste en la Parte 4 de la guía.

Con tus objetos seleccionados, ahora puedes cambiar qué parte de Objeto B desencadenará el evento de colisión. Apaga todos los interruptores, excepto la opción "En la parte superior". Ahora el comportamiento de Colisionado solo funcionará cuando la parte superior del personaje jugador toque el ladrillo.

Ahora que el ladrillo verifica si la cabeza del jugador lo toca, hagamos que rebote hacia arriba y hacia abajo. Para esto, usaremos los comportamientos Mover Por para moverlo hacia arriba y luego hacia abajo.

Desde la categoría Transformar, añade el comportamiento Mover Por y conéctalo al comportamiento Colisionado que añadiste anteriormente.

Toca el comportamiento Mover Por y ve sus propiedades. Como queremos mover el ladrillo hacia arriba cuando el jugador lo golpea, cambia el Valor Y. Establece esto en un número pequeño, ya que solo queremos darle un pequeño efecto de rebote. Usé 0.20 Metros.

También necesitarás cambiar la Duración. La duración es el tiempo que tarda en completarse el movimiento. Por defecto, la duración está configurada en 1, pero esto significa que el ladrillo se moverá 0.2 metros en 1 segundo. Esto es demasiado lento para nuestras necesidades. Cambia la duración a 0.10 Segundos.

Nota: Establecer una duración de cero hará que tu objeto se mueva instantáneamente a la nueva posición. No se animará suavemente. Además, nota la caja con el texto "Lineal". Este es el efecto de interpolación de movimiento que se aplica a tu movimiento. Si tu comportamiento tiene una duración, se moverá basado en este efecto.

Ahora, para hacer que el ladrillo rebote hacia atrás, añade otro comportamiento Mover Por y conéctalo al anterior.

Una vez más, cambia las propiedades. Esta vez, queremos que el ladrillo se mueva hacia abajo. Para moverlo hacia abajo, cambia el Valor Y a un número negativo. Ya que queremos que el ladrillo vuelva a su posición original, moveremos -0.20 Metros. También necesitas cambiar la duración a 0.10 Segundos.

Para este punto, si presionas play, tu jugador puede golpear el ladrillo desde abajo y el ladrillo subirá y bajará. Sin embargo, hay algunos problemas que debemos abordar.

  1. Hay un pequeño error en nuestra lógica. Si el jugador sigue saltando realmente rápido sin dejar que el ladrillo regrese a la posición original, seguirá moviéndose hacia arriba.

  2. El ladrillo rebota para siempre. ¿Qué pasa si solo quieres unas pocas monedas, luego se detiene cuando está vacío?

  3. Aún no otorga ninguna moneda.

Comencemos abordando el problema 1. Este es en realidad un error simple de arreglar. Todo lo que tenemos que hacer es apagar el comportamiento de colisión tan pronto como el jugador lo golpee, y luego volver a encenderlo cuando haya terminado de moverse.

Para hacer esto, cambia a la categoría Personalizado, y añade "Comportamiento Apagado", luego conéctalo al comportamiento Colisionado.

Siguiente, desde las propiedades de Comportamiento Apagado, toca la caja vacía etiquetada "Seleccionar Comportamiento". Desde la lista, localiza el comportamiento Colisionado correcto. Ten en cuenta que la lista muestra todos los comportamientos, de todos los objetos. La lista está ordenada en función del nombre del objeto.

Ahora necesitas volver a encender el comportamiento de colisión cuando haya terminado el rebote. Para hacer esto, simplemente añade un Comportamiento Encendido desde la categoría Personalizado y conéctalo al segundo comportamiento Mover Por que agregaste anteriormente. Desde las propiedades del comportamiento, asegúrate de seleccionar el comportamiento Colisionado para volver a encenderlo.

Para el problema 2, usaremos un contenedor de caja para establecer la cantidad de monedas que cada ladrillo sostiene. Hacer esto nos permite cambiar fácilmente ladrillos específicos para tener más o menos monedas.

Lo primero que debes hacer es agregar un contenedor de caja desde la categoría Personalizado, puedes colocarlo en cualquier lugar de la pantalla ya que no se conecta con nada más. También puedes renombrar este contenedor de caja a "Monedas" para que sea más fácil de encontrar más tarde (para recordar cómo renombrar comportamientos, revisa la Parte 4)

Desde las propiedades del comportamiento del Contenedor de monedas, cambia la propiedad "Valor Predeterminado" a 3. Esto será cuántas monedas sostiene el ladrillo.

Ahora, desde la categoría Lógica, añade un comportamiento Agregar Valores y conéctalo al segundo Mover Por que agregamos anteriormente. Estaremos utilizando este comportamiento Agregar Valores para llevar un registro de cada vez que el jugador golpea el ladrillo.

Una vez que el comportamiento "Agregar Valores" esté conectado, tócalo para ver las propiedades del comportamiento. Las propiedades muestran 2 campos de entrada, y el comportamiento "Agregar Valores" devolverá la suma de los valores introducidos.

En nuestro caso, dado que estamos utilizando el agregar valor para llevar la cuenta de cada golpe, ingresaremos 1 en el campo superior, y para el campo inferior, devolveremos la suma del comportamiento "Agregar Valor" al segundo campo de entrada.

Lo que esto hace es incrementar la suma cada vez que se ejecuta el comportamiento. La primera vez que el comportamiento se ejecuta será 1+0 ya que no hay suma. La segunda vez que se ejecuta será 1+1, ya que la suma de la última vez se almacena.

A continuación, necesitas verificar si la suma de los valores agregados es la misma que la caja contenedora de Monedas que agregaste anteriormente.

Para hacer esto, añade un comportamiento de la categoría Lógica y conéctalo al Agregar Valores del paso anterior.

Con el comportamiento SI conectado, tócalo para ver las propiedades del comportamiento. El comportamiento SI comprobará si se cumple una condición específica (basada en los 2 campos de entrada, y la condición seleccionada).

En este caso, compartiremos la suma del comportamiento de agregar y la colocaremos en el primer campo de la condición SI.

Luego devolveremos el contenido de la caja contenedora al segundo SI.

Con estos valores ingresados, el siguiente comportamiento conectado solo se ejecutará SI la suma de agregar valores es igual al valor almacenado en la caja de monedas.

Ahora lo que necesitarás hacer es apagar el comportamiento de colisión y cambiar el gráfico para que no puedas obtener más monedas. Para hacer esto, añade un nuevo comportamiento Comportamiento Apagado de la categoría Personalizado y conéctalo al SI. Al igual que antes, selecciona el comportamiento Colisionado como el que deseas apagar.

Para mostrar al jugador que no quedan más monedas, puedes añadir el comportamiento Cambiar Gráfico de la categoría Transformar y conectarlo al SI.

Una vez conectado, selecciona un nuevo gráfico desde las propiedades del comportamiento Cambiar Gráfico. Toca la segunda caja en las propiedades del comportamiento y selecciona un nuevo gráfico.

Ahora, si presionas play, puedes saltar y golpear el ladrillo 3 veces antes de que se detenga.

Obteniendo Puntos

Configurando la UI

Lo siguiente que falta es obtener realmente puntos y recolectar monedas al golpear el ladrillo!

Lo primero que haremos es añadir un contador en la esquina de la pantalla para informar al jugador cuántos puntos tiene.

Así que, vuelve al editor principal presionando atrás desde el editor de comportamientos. Luego necesitas abrir la barra de Capas tocando los 3 puntos en el lado derecho de la pantalla (también puedes deslizar desde el borde de la pantalla).

Selecciona la capa UI Global. Las capas UI existen sobre las otras capas en la escena y se utilizan típicamente para botones, joysticks y etiquetas. También están fijas en el mismo lugar en la pantalla y parecen moverse con el resto del contenido en tu escena.

Nota: Los objetos colocados en la capa UI Global existirá en cada escena en tu proyecto. Si deseas que algo exista solo en una escena, utiliza la capa UI de Escena.

Con la capa UI Global seleccionada, toca el icono de frasco de Objetos Especiales en el muelle, o arrástralo a la escena.

Desde el popup selecciona Etiqueta, y una etiqueta será colocada en tu escena.

Toca la etiqueta recién agregada para abrir las propiedades del objeto. Desde las propiedades de la etiqueta puedes cambiar el color del texto, la fuente, el texto a mostrar, y más.

Toca la gran caja de texto y cambia el texto para que diga "Puntos:".

Siguiente, toca "Alineación" para expandir las propiedades de alineación. Establece el Ancho en 110 y Altura en 64.

Nota: Establecer estos en 0, elimina el área de texto, y permite que tu texto crezca horizontalmente indefinidamente.

Con las propiedades de la etiqueta configuradas, puedes usar la herramienta Mover/Transformar para colocar tu nueva etiqueta en la esquina de la pantalla y asegurarte de no obstruir la vista del jugador.

Una vez que tu etiqueta esté en posición, añade otra etiqueta a la escena, usaremos esta etiqueta para mostrar tus puntos. Esta vez establece el texto en 0, ya que tu jugador comienza con cero puntos. A diferencia de antes, estableceremos un ancho y altura especificados. Establece el Ancho en 500pt, y la altura en 64pt. Esto da un área especificada, donde el texto puede aparecer. Si tienes demasiado texto para encajar en esta área, se cortará.

Además, establece la alineación horizontal en alineada a la izquierda (Ajuste Izquierdo).

Cuando termines con las propiedades de la etiqueta, colócala al lado del título "Puntos".

Obteniendo Puntos

Ahora necesitamos aumentar tus puntos cada vez que obtengas una moneda. Cambia de nuevo a tu capa principal y vuelve a los comportamientos para el ladrillo con las monedas para que podamos añadir los comportamientos necesarios.

Desde la categoría UI, arrastra el comportamiento "Agregar a la Puntuación" y conéctalo al segundo comportamiento Mover Por agregado anteriormente en esta guía.

A continuación, toca el comportamiento Agregar a la Puntuación, y activa el interruptor de Puntuación Infinita. Si este interruptor estaba apagado, el siguiente comportamiento se activaría cuando se alcance la puntuación especificada. También asegúrate de que la etiqueta "0" esté seleccionada como el objeto correcto, ya que el comportamiento Agregar a la Puntuación seleccionará automáticamente una etiqueta aleatoria en tu escena.

Si ahora presionas play, ganarás 1 punto cada vez que el jugador golpee el ladrillo.

Ahora, puedes duplicar este ladrillo (como aprendiste en la parte 3) y colocarlo a lo largo de tu nivel.

Monedas Individuales

Tu primera moneda

A veces puede que quieras simplemente añadir monedas a lo largo de tu nivel sin esconderlas dentro de ladrillos. Esto es relativamente simple, y lo abordaremos ahora.

Comienza añadiendo tu gráfico de moneda en tu escena, luego tócalo para ver las propiedades del objeto.

Desde la parte inferior de las propiedades del objeto, asegúrate de que la pestaña física esté seleccionada.

Mientras estés en la pestaña física, haz que la moneda sea pasable. Hacer esto permite que nuestro jugador continúe corriendo a través de ella sin ser detenido o ralentizado.

A continuación, ajustaremos los límites de colisión de la moneda. Los límites de colisión definen la forma física del objeto. Los límites de colisión pueden ser de un tamaño o forma diferente a la apariencia visual del objeto. Para ajustar los límites de colisión, toca el ícono de Colisiones.

Desde el Editor de Colisiones puedes usar la paleta de herramientas a la izquierda para modificar y crear formas de colisión únicas.

Para esta guía, seleccionaremos la opción "Círculo" para crear un límite de colisión circular.

A continuación, arrastra el punto verde en el círculo para redimensionar el límite de colisión. Haz que el límite de colisión tenga el mismo tamaño que la moneda. Nota que si el límite de colisión es más grande que tu objeto, entonces tu jugador puede interactuar con él incluso antes de que toca físicamente la gráfica de moneda en el medio.

Cuando termines de crear el límite de colisión, toca el ícono de marca de verificación en la paleta de herramientas para aceptar y guardar la nueva forma.

Una vez más, toca la moneda para ver las Propiedades del Objeto. Esta vez abre el editor de comportamientos para la moneda.

Desde la categoría Objeto, añade el comportamiento "Colisionado" en la pantalla. Al igual que antes, abre las propiedades del comportamiento colisionado y selecciona al jugador Green Spaceman para Objeto B.

A continuación, desde la categoría UI, arrastra el comportamiento Agregar a la Puntuación y conéctalo a la colisión. Nuevamente, desde las propiedades del comportamiento, activa el interruptor para Puntuación Infinita y asegúrate de que se selecciona la etiqueta de puntuación correcta.

Finalmente, desde la categoría Objeto, añade el comportamiento Destruir Objeto y conéctalo al comportamiento de colisión. Esto eliminará completamente la moneda tan pronto como el jugador entre en contacto con ella.

Si presionas play, ahora puedes correr hacia la moneda y desaparecerá.

¡Eso es todo! Ahora tu juego de plataformas tiene monedas coleccionables. En este punto, todo lo que necesitas hacer es duplicar tus monedas y colocarlas a lo largo de tu nivel. ¡Intenta ser creativo al colocar tus monedas!

Puedes descargar la versión final de la Parte 5 desde el Hub y ver todo en acción.

En la Parte 6, comenzaremos a añadir un poco de dificultad al juego al introducir enemigos.