Interactividad

Blueprint

Añade lógica con un grafo visual de nodos: eventos, condiciones y acciones — sin código.

Blueprint es el editor visual de grafos de nodos de Easelt Builder — el lugar donde tu diseño deja de ser una maqueta estática y empieza a *hacer cosas*. Lo abres con el botón Blueprint, colocas nodos desde la paleta NODES y los conectas entre sí para que un clic abra una ventana, un interruptor revele un panel o un botón cambie el texto y el color de un elemento. Cuando exportas, todo el grafo se compila en gui.lua y se ejecuta en vivo dentro del juego.

Abrir Blueprint

Haz clic en el botón Blueprint para pasar del lienzo de diseño al editor de grafos de nodos. En lugar de arrastrar elementos visuales, ahora arrastras *nodos* — pequeños bloques de lógica — desde la paleta NODES al lienzo del grafo, y luego conectas sus pines para describir el comportamiento. Todo lo que conectes aquí se convierte en lógica real del juego, no solo en un efecto de vista previa.

Cómo funciona el grafo

Un grafo de Blueprint se lee de izquierda a derecha a lo largo de los cables. Un evento se dispara (algo que hace el jugador), una condición opcional decide qué rama tomar, y una o más acciones llevan a cabo el resultado. Construyes el comportamiento colocando estos tres tipos de nodo y conectando el pin out de uno al pin in del siguiente.

Nodos de evento (verdes)

El punto de partida de una cadena. Están vinculados a un elemento específico y se disparan cuando el jugador interactúa con él.

Nodos de condición / "If"

Ramifican el flujo. Plantean una pregunta de sí/no y envían el grafo por una ruta then o else.

Nodos de acción

La carga útil. Abren ventanas, muestran u ocultan elementos, cambian texto y color, reproducen animaciones y sonidos, o cambian de diseño.

Nodos de evento

Los nodos de evento son verdes y cada uno está vinculado a un elemento — haz clic en el campo de destino del nodo para elegir qué elemento escucha. Son el lugar donde comienza cada cadena.

Evento	Qué hace
`onClick`	Se dispara cuando el jugador hace clic en el elemento vinculado.
`onHover`	Se dispara cuando el puntero se mueve sobre el elemento vinculado.
`onLeave`	Se dispara cuando el puntero se aleja del elemento vinculado.
`onChange`	Se dispara cuando una casilla de verificación o un interruptor cambia de estado (activado/desactivado).
`onOpen`	Se dispara cuando se abre una ventana.
`onClose`	Se dispara cuando se cierra una ventana.

Nodos de condición

Los nodos de condición (o "If") ramifican tu lógica. Cada uno tiene una salida then y una salida else — conecta las acciones que quieras en cada ruta. Haz clic en el campo de destino del nodo para elegir el elemento o la ventana que evalúa.

Condición	Qué comprueba
`ifWin`	Si una ventana está actualmente abierta.
`ifSwitch`	Si un interruptor o casilla de verificación está actualmente activado.
`ifVis`	Si un elemento está actualmente visible.

Nodos de acción

Los nodos de acción hacen el trabajo. Encadénalos en secuencia para ejecutar varios seguidos, y haz clic en el campo de destino de cada nodo para elegir el elemento o la ventana sobre la que actúa.

Acción	Qué hace
`openWin`	Abre una ventana.
`closeWin`	Cierra una ventana.
`toggleWin`	Alterna una ventana entre abierta y cerrada.
`showEl`	Muestra un elemento.
`hideEl`	Oculta un elemento.
`toggleEl`	Alterna la visibilidad de un elemento.
`setText`	Cambia el texto de un elemento (admite árabe).
`setColor`	Cambia el color de relleno de un elemento.
`playAnim`	Reproduce la animación del elemento.
`sound`	Reproduce un sonido.
`switchDesign`	Cambia a otro diseño o pantalla.

💡

setText admite completamente el árabe, por lo que puedes controlar etiquetas de derecha a izquierda directamente desde el grafo.

Ventanas y paneles

Cualquier elemento puede comportarse como una ventana. Esto es lo que permite que openWin, closeWin, toggleWin, ifWin, onOpen y onClose lo tengan como destino.

Abre el panel de Blueprint
Selecciona el elemento y abre la sección "Blueprint panel" en el Inspector.
Actuar como ventana / panel
Activa "Act as window / panel" para convertir el elemento en una ventana que se pueda abrir.
Empieza abierta (opcional)
Opcionalmente activa "Starts open" para que la ventana esté visible cuando la GUI se cargue por primera vez.

Los elementos que dibujes encima y dentro de un panel se convierten en sus miembros y se abren y cierran junto con él. En el caso de un grupo, sus hijos actúan automáticamente como sus miembros — de modo que al abrir o cerrar el grupo se arrastra todo su contenido con él.

Conectar nodos entre sí

Conectas los nodos arrastrando entre sus pines. Así es como los nodos de evento, condición y acción forman una cadena funcional.

Arrastra desde el pin out de un evento hasta el pin in de una acción para activarla.
Encadena acciones en secuencia para ejecutar varias una tras otra.
Desde una condición, conecta los pines then y else a las acciones que debe ejecutar cada rama.
Haz clic en el campo de destino de un nodo para elegir su elemento o ventana de un menú desplegable.

Controles del lienzo

El lienzo del grafo permite desplazarse y hacer zoom por completo, para que puedas disponer comportamientos grandes con comodidad.

Control	Acción
Rueda de desplazamiento	Hace zoom hacia el cursor.
Arrastrar espacio vacío	Desplaza el lienzo.
Paleta NODES	Añade nodos al grafo.

Exportar a gui.lua

Cuando exportas, todo el grafo de Blueprint se compila en gui.lua. Los clics, las condiciones, la apertura y el cierre de ventanas, y los cambios de texto y color se ejecutan todos dentro del juego — no solo en Test. Tu grafo de nodos se convierte en lógica real de MTA:SA lista para distribuir.

ℹ️

Como todo se compila en gui.lua, el comportamiento que conectas en Blueprint se ejecuta en jugadores reales, no solo dentro de la vista previa del builder.