En este tutorial, aprenderás a crear un botón en Unity que permita mostrar y ocultar un panel de créditos al hacer clic.
✅ Funciona con UI
y Canvas
en Unity.
✅ Sin necesidad de cambiar de escena.
✅ Fácil de implementar en cualquier menú.
🔹 1. Crear el Panel de Créditos
📌 Paso 1: Agregar un Canvas
si no tienes uno
- Ve a
GameObject > UI > Canvas
. - Renómbralo
CanvasMenu
(si aún no tienes un Canvas). - Asegúrate de que el
CanvasScaler
está en:UI Scale Mode
: Scale With Screen SizeReference Resolution
: 1920×1080
📌 Paso 2: Crear el PanelCreditos
- Dentro del
Canvas
, clic derecho > UI > Panel. - Renómbralo
PanelCreditos
. - Ajusta su tamaño y color según prefieras.
📌 Paso 3: Agregar Texto y un Botón de Cerrar
- Dentro del
PanelCreditos
, agrega:UI > Text (TextMeshPro)
→ Escribe los créditos del juego.UI > Button - TextMeshPro
→ RenómbraloBotonCerrarCreditos
.
- Edita el
BotonCerrarCreditos
:- Cambia el texto a
"Cerrar"
. - Ajusta su tamaño y posición dentro del
PanelCreditos
.
- Cambia el texto a
- Desactiva
PanelCreditos
en elInspector
para que no aparezca al inicio.
🔹 2. Crear el Script para Mostrar y Ocultar el Panel
📌 Paso 4: Crear el Script CreditosManager.cs
- Ve a la carpeta
Scripts
(Assets/Scripts
). - Clic derecho > Create > C# Script.
- Nómbralo
CreditosManager.cs
y ábrelo. - Copia este código:
using UnityEngine;
public class CreditosManager : MonoBehaviour
{
public GameObject panelCreditos; // Referencia al panel de créditos
void Start()
{
// Asegurar que el panel esté oculto al iniciar el juego
if (panelCreditos != null)
{
panelCreditos.SetActive(false);
}
else
{
Debug.LogWarning("⚠️ Panel de créditos no asignado en el Inspector.");
}
}
// Método para mostrar el panel
public void MostrarCreditos()
{
if (panelCreditos != null)
{
panelCreditos.SetActive(true);
}
}
// Método para ocultar el panel
public void OcultarCreditos()
{
if (panelCreditos != null)
{
panelCreditos.SetActive(false);
}
}
}
🔹 3. Asignar Funcionalidad a los Botones
📌 Paso 5: Asignar el Script a un Objeto
- Crea un
GameObject
vacío en la jerarquía (GameObject > Create Empty
). - Renómbralo
GestorCreditos
. - Arrástrale el script
CreditosManager.cs
(Add Component > CreditosManager
).
📌 Paso 6: Conectar los Botones con el Script
- Selecciona el
BotonCreditos
en la Jerarquía. - En el Inspector, busca la sección
Button > OnClick()
. - Haz clic en
+
para agregar una nueva acción. - Arrastra el
GestorCreditos
al campo vacío. - En la lista desplegable, selecciona
CreditosManager > MostrarCreditos()
.
✍ Repite esto con el BotonCerrarCreditos
:
- En
OnClick()
, seleccionaCreditosManager > OcultarCreditos()
.
🎯 Resultado Final
✅ Al presionar el botón «Créditos», el panel aparecerá.
✅ Al presionar «Cerrar», el panel desaparecerá.
✅ Si el PanelCreditos
no está asignado, Unity mostrará una advertencia en la Console
.
