Cómo diseñar y codificar una barra de salud en Unity3D

Cómo diseñar y codificar una barra de salud en Unity3D

Pionero en algunos de los primeros videojuegos del mundo, la salud es una mecánica común que persiste en muchos de los títulos más populares de la actualidad. La salud hace posible emplear mecánicas de lucha complejas, crear una progresión del jugador y hacer que tu juego sea más intuitivo. Pero, ¿cómo agregas un sistema de salud a tus propios juegos?

Unity3D facilita agregar elementos de interfaz de usuario 2D a juegos 3D, por lo que es un excelente lugar para comenzar a explorar las barras de salud por primera vez.

Lo que vas a aprender

En la superficie, este proyecto puede no parecer complicado. A pesar de esto, deberá comprender varios conceptos clave de codificación de Unity3D para crear una barra de salud que funcione. Esto significa que hay mucho que aprender a medida que avanza en este proyecto, que incluye:

  • Cómo crear elementos/sprites de interfaz de usuario 2D en Unity3D.
  • Cómo editar componentes de objetos de juego con código.
  • Cómo compartir variables entre scripts en Unity3D.

Paso 1: configura tu escena

Antes de que pueda comenzar a codificar su barra de salud, necesita una escena con un modelo de jugador para que se aplique. Para comenzar, puede seguir nuestra guía de controlador de personajes Unity3D basada en la física para crear un modelo de jugador con controles básicos.

Con un modelo de escena y jugador en su lugar, es hora de agregar un elemento de interfaz de usuario. Haga clic con el botón derecho dentro de la ventana Jerarquía y seleccione IU > Imagen . Esto creará dos nuevos elementos en su jerarquía: un objeto principal Canvas y un objeto secundario Image. Cambie el nombre del objeto secundario a Healthbar. Elija un ancho, alto y posición para su barra de salud usando el inspector.

la unidad agrega una imagen de interfaz de usuario

Puede agregar una imagen de interfaz de usuario un poco más grande con su color configurado en negro para que actúe como fondo/borde para la barra de salud. Solo asegúrese de que esté encima de la barra de salud en la jerarquía para que se muestre detrás de ella.

Este elemento de la interfaz de usuario funciona como base para su barra de salud, pero también necesita un sprite para animarlo. Vaya al panel Proyecto, haga clic con el botón derecho y seleccione Crear > 2D > Sprites > Cuadrado .

unidad agrega un nuevo sprite

Seleccione la Barra de salud de la jerarquía y arrastre el sprite que acaba de crear al cuadro de selección Imagen de origen dentro del inspector. También puede cambiar Tipo de imagen a Relleno, Método de relleno a Horizontal y Origen de relleno a Izquierda. Ahora, si ejecuta su juego y usa el control deslizante Cantidad de relleno , debería ver que su barra de salud se reduce y crece.

agregar sprite como un componente de objeto

Paso 2: agregue una variable de salud

No tendría mucho sentido crear una barra de salud sin una variable de salud para dictar su estado. Otros scripts deben poder acceder a esta variable, y tiene sentido colocarla en un lugar central. Agréguelo al script de control de caracteres como un flotador público:

public float playerHealth = 1.0f;

El uso de un flotante para esta variable significa que puede representar fácilmente cualquier porcentaje de 0 a 100, para que coincida con la variable Cantidad de relleno de la imagen de la interfaz de usuario de la barra de salud. Por ejemplo, un playerHealth de 0.5f es el 50% del ancho de la barra de salud.

Paso 3: Comparta variables entre secuencias de comandos en Unity

Las variables normalmente operan dentro de sus propias funciones y scripts. Esto los hace inaccesibles desde otras funciones y scripts a menos que tome medidas para indicarle al código dónde encontrar las variables con las que desea trabajar.

Comience por crear un nuevo archivo de secuencia de comandos llamado Salud para albergar el código. Puede arrastrar y soltar este script en el elemento de la interfaz de usuario Healthbar creado en el primer paso. El siguiente código entra en la función void Update().

Este proceso comienza con la búsqueda del objeto del juego que posee la variable. En este caso, es el objeto Character_Model:

GameObject Character_Model = GameObject.Find("Character_Model");

A continuación, es hora de encontrar el componente de secuencia de comandos que contiene la variable con la que necesita trabajar.

Character_Control character_Control = Character_Model.GetComponent();

Y, finalmente, puede extraer la variable específica que está buscando. En este caso, es la variable playerHealth que agregaste al controlador de tu personaje. Asigne esto a una variable flotante dentro del script actual llamado currentHealth.

currentHealth = character_Control.playerHealth;

Solo se necesitan unas pocas líneas de código para obtener la variable que necesita, y puede aplicar este método siempre que necesite acceder a la salud de su jugador. Su código debería verse así una vez que haya terminado:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class Health: MonoBehaviour
{
    public float currentHealth;

    void Start()
    {
    }

    void Update()
    {
        GameObject Character_Model = GameObject.Find("Character_Model");
        Character_Control character_Control = Character_Model.GetComponent();
        currentHealth = character_Control.playerHealth;
    }
}

Paso 4: programe el objeto de juego de la barra de estado de la interfaz de usuario

Ahora que ha creado un elemento de interfaz de usuario de la barra de salud y tiene acceso a la variable de salud del jugador, es hora de hacer que funcionen juntos. Para comenzar, agregue una variable estática privada que contendrá el componente de imagen de su barra de salud:

private static Image Healthbar;

Luego puede asignar el componente de imagen a esta variable dentro de la función void Start(), que solo se ejecuta una vez.

Healthbar = GetComponent();

Ahora que tiene todas sus variables en su lugar, puede usar el código del paso anterior para establecer el ancho de relleno del objeto de la interfaz de usuario de la barra de estado. No necesita realizar ninguna conversión aquí; tanto la salud del jugador como la cantidad de llenado de la barra de salud son variables flotantes.

Healthbar.fillAmount = currentHealth;

Con este código en su lugar, su barra de salud se llenará hacia arriba y hacia abajo según la variable de salud que se encuentra en el código Character_Control. Sin embargo, esto es un poco aburrido, y definitivamente le vendría bien un poco de color.

Comience agregando un nuevo color para que la barra de salud tenga un color verde claro cuando el jugador tenga mucha salud.

Color greenHealth = new Color(0.6f, 1, 0.6f, 1);

A continuación, agregue una declaración if para verificar si la salud del jugador está por encima de 0.3f, es decir, 30% o más. Si es superior a 0,3f, configure la barra de salud para que coincida con el color que acaba de agregar. Si está por debajo de 0.3f, cambie la barra de salud a rojo.

if (currentHealth >= 0.3f) {
    Healthbar.color = greenHealth;
} else {
    Healthbar.color = Color.red;
}

Paso 5: Prueba del código

Como puede ver en el código completo a continuación, este proyecto es bastante simple cuando está todo junto. Por supuesto, sin embargo, necesita una forma de probar su código.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class Health: MonoBehaviour
{
    private static Image Healthbar;
    public float currentHealth;

    void Start()
    {
        Healthbar = GetComponent();
    }

    void Update()
    {
        GameObject Character_Model = GameObject.Find("Character_Model");
        Character_Control character_Control = Character_Model.GetComponent();
        currentHealth = character_Control.playerHealth;
        Healthbar.fillAmount = currentHealth;

        Color greenHealth = new Color(0.6f, 1, 0.6f, 1);

        if (currentHealth >= 0.3f) {
            Healthbar.color = greenHealth;
        } else {
           Healthbar.color = Color.red;
       }
    }
}

Puede agregar una sola línea de código al script Character_Control para hacer posible la prueba. Cada vez que el jugador presiona la tecla W para avanzar, elimina una pequeña cantidad de salud. Puede agregar el mismo código a cualquier secuencia de comandos con acceso a la variable playerHealth para obtener los mismos resultados:

playerHealth -= 0.001f;

También puede considerar agregar activos únicos a su proyecto de Unity. Puedes encontrar activos gratuitos de Unity en la web, lo que te brinda la oportunidad de darle vida a tu proyecto sin tener que gastar dinero.

Creación de barras de salud en Unity3D

Tu juego está empezando a tomar forma ahora que tienes una barra de salud para tu personaje. Todavía queda mucho trabajo por hacer, pero ahora debería tener algunas de las habilidades clave que necesita para comenzar a lograr un progreso real. Por supuesto, sin embargo, nunca está de más leer más guías.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *