Tipos de UI
Referencia completa de todos los tipos de elementos disponibles en EventUI. Cada tipo tiene sus propias propiedades y comportamiento dentro del árbol de la pantalla.
Resumen
Campos comunes
Todos los elementos comparten estos campos base independientemente del tipo:
| Campo | Obligatorio | Default | Descripción |
|---|---|---|---|
id | ✅ Sí | — | Identificador único dentro del archivo de UI. |
type | ✅ Sí | — | Tipo del elemento en mayúsculas. |
x | ✅ Sí | — | Posición X. Con anchor actúa como offset. |
y | ✅ Sí | — | Posición Y. Con anchor actúa como offset. |
width | No | 100 | Ancho en píxeles de UI. |
height | No | 20 | Alto en píxeles de UI. |
z_index | No | 0 | Orden de capas. Mayor valor = encima. |
visible | No | true | Visibilidad estática del elemento. |
properties | Varía | — | Propiedades específicas del tipo. |
children | No | — | Elementos hijos anidados. |
Además, dentro de properties cualquier tipo puede usar:
| Propiedad | Descripción |
|---|---|
anchor | Punto de anclaje relativo a la pantalla. Ver sistema de anclas. |
anchor_offset_x | Desplazamiento X adicional desde el punto de ancla. |
anchor_offset_y | Desplazamiento Y adicional desde el punto de ancla. |
visible_if | Condición de visibilidad basada en variables de estado. Ver data binding. |
IMAGE
Renderiza una textura de Minecraft o de un resource pack como imagen estática. Es el elemento más básico — ideal para fondos, títulos decorativos y separadores.
- id: "fondo"
type: IMAGE
x: 0
y: 0
width: 500
height: 350
properties:
texture: "eventui:textures/ui/fondo.png"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
texture | ✅ Sí | — | ResourceLocation de la textura. Formato: namespace:textures/ruta/archivo.png |
0x808080). No lanza error en consola del servidor.IMAGE_BUTTON
El elemento más completo del sistema. Botón con textura personalizada que soporta íconos, animaciones de hover, sonidos, hitbox preciso y texturas dinámicas según el estado del evento vinculado.
- id: "btn-mision"
type: IMAGE_BUTTON
x: 0
y: 0
width: 64
height: 64
properties:
anchor: "center"
anchor_offset_x: -100
anchor_offset_y: 0
# Texturas
texture: "eventui:textures/ui/btn.png"
hover_texture: "eventui:textures/ui/btn_hover.png"
in_progress_texture: "eventui:textures/ui/btn_inprogress.png"
completed_texture: "eventui:textures/ui/btn_completed.png"
# Ícono de ítem
icon: "minecraft:diamond"
icon_scale: "0.8"
# Hover
hover_animation: "zoom_in"
hover_animation_intensity: "1.15"
hover_animation_duration: "200"
hover_animation_easing: "ease_out"
hover_hitbox: "texture_alpha"
# Sonidos
hover_sound: "minecraft:ui.toast.in"
hover_sound_volume: "1.0"
hover_sound_pitch: "1.3"
click_sound: "minecraft:item.book.page_turn"
click_sound_volume: "1.0"
click_sound_pitch: "1.0"
# Visibilidad y acción
visible_if: "mision_activa == true"
action: "open:misiones-menu"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
texture | ✅ Sí | — | Textura base del botón. |
hover_texture | No | — | Textura al pasar el cursor. |
in_progress_texture | No | — | Textura cuando el evento vinculado está IN_PROGRESS. |
completed_texture | No | — | Textura cuando el evento vinculado está COMPLETED. |
icon | No | — | ResourceLocation del ítem renderizado encima de la textura como sprite 2D. |
icon_scale | No | "1" | Escala del ícono. "1" = tamaño normal, "0.7" = 70%. |
hover_animation | No | — | Tipo de animación hover. Ver referencia de animaciones. |
hover_animation_intensity | No | — | Intensidad de la animación. Significado varía por tipo. |
hover_animation_duration | No | "200" | Duración en ms. |
hover_animation_easing | No | "ease_out" | linear, ease_in, ease_out, ease_in_out. |
hover_hitbox | No | "box" | "box": rectángulo completo. "texture_alpha": solo píxeles opacos de la textura. |
hover_sound | No | — | ResourceLocation del sonido al hacer hover. |
hover_sound_volume | No | "1.0" | Volumen hover (0.0 – 2.0). |
hover_sound_pitch | No | "1.0" | Tono hover. |
click_sound | No | — | Sonido al hacer clic. Vacío = sonido por defecto del sistema. |
click_sound_volume | No | "1.0" | Volumen clic. |
click_sound_pitch | No | "1.0" | Tono clic. |
visible_if | No | — | Condición de visibilidad. Ver data binding. |
action | No | — | Acción al hacer clic. Ver tabla de acciones abajo. |
BUTTON
Botón de texto estilo vanilla de Minecraft. Renderiza el fondo estándar del juego con texto centrado. Ideal para acciones simples como cerrar una pantalla.
- id: "btn-cerrar"
type: BUTTON
x: 150
y: 260
width: 100
height: 22
properties:
text: "§7← Cerrar"
action: "close"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
text | ✅ Sí | — | Texto del botón. Acepta códigos § para colores. |
action | No | — | Acción al hacer clic. |
TEXT
Renderiza texto con soporte para colores, alineación, sombra y data binding dinámico con {{variables}}.
- id: "texto-progreso"
type: TEXT
x: 250
y: 80
width: 480
height: 20
properties:
content: "§7Progreso: §e{{event.currentProgress}}§7/§e{{event.targetProgress}}"
align: "center"
shadow: "true"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
content | ✅ Sí | — | Texto a mostrar. Acepta códigos §, MiniMessage, saltos de línea (\n, \n\n) y variables {{...}}. |
align | No | "left" | "left", "center", "right". |
shadow | No | "false" | "true" activa la sombra bajo el texto. |
font_size | No | "1.0" | Escala del tamaño de fuente. |
line_spacing | No | "0" | Espacio entre líneas dentro de un párrafo. |
paragraph_spacing | No | "10" | Espacio entre párrafos. |
anchor_offset_x | No | — | Desplazamiento X adicional para anclas. |
anchor_offset_y | No | — | Desplazamiento Y adicional para anclas. |
PROGRESS_BAR
Barra de progreso que lee automáticamente el avance de un objetivo específico de un evento.
- id: "barra-zombies"
type: PROGRESS_BAR
x: 68
y: 190
width: 128
height: 8
properties:
event_id: "matar-zombies"
objective_id: "kill-zombies"
color: "5cb85c"
background_color: "2a2a2a"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
event_id | ✅ Sí | — | ID del evento del que tomar el progreso. |
objective_id | ✅ Sí | — | ID del objetivo específico dentro del evento. |
color | No | verde | Color del relleno en hexadecimal sin #. |
background_color | No | gris oscuro | Color del fondo en hexadecimal sin #. |
PANEL
Contenedor con fondo de color sólido. Funciona como un grupo visual — sus hijos se renderizan con posición relativa al panel. Útil para agrupar elementos con un fondo común.
- id: "panel-info"
type: PANEL
x: 50
y: 100
width: 200
height: 80
properties:
color: "1a1a1a"
alpha: "180"
children:
- id: "texto-panel"
type: TEXT
x: 10
y: 10
width: 180
height: 20
properties:
content: "§eInformación"
shadow: "true"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
color | No | — | Color de fondo en hexadecimal sin #. |
alpha | No | "255" | Opacidad del fondo (0–255). |
ICON
Renderiza el sprite 2D de un ítem de Minecraft — el mismo icono que ves en el inventario. A diferencia de IMAGE_BUTTON, no tiene hover, clic ni animaciones. Es puramente decorativo.
- id: "icono-diamante"
type: ICON
x: 100
y: 50
width: 16
height: 16
properties:
item: "minecraft:diamond"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
item | ✅ Sí | — | ResourceLocation del ítem a mostrar. Solo ítems de Minecraft vanilla. |
TOOLTIP
Muestra información al pasar el cursor sobre el elemento padre. Solo funciona como hijo (children) de otro elemento — no puede usarse como elemento raíz de la pantalla.
children:
- id: "tooltip-info"
type: TOOLTIP
x: 0
y: 0
width: 0
height: 0
properties:
render_type: "standard"
content: "§eNombre del objeto\n§7Descripción aquí"
shadow: "true"
children:
- id: "tooltip-texto"
type: TOOLTIP
x: 0
y: 0
width: 0
height: 0
properties:
render_type: "text"
content: "Texto flotante sin fondo"
shadow: "true"
children:
- id: "tooltip-receta"
type: TOOLTIP
x: 0
y: 0
width: 0
height: 0
properties:
render_type: "advanced"
content: |
recipe: minecraft:diamond_chestplate [frame:eventui:textures/ui/crafting_frame.png]
| render_type | Descripción |
|---|---|
standard | Fondo estilo vanilla de Minecraft. Soporta \n y códigos §. Soporta también alineación con offset_x y offset_y. |
text | Texto flotante sin fondo. Soporta shadow, alineación (left, center, right) y saltos de línea con \n, <br> o <newline>. |
advanced | Tooltip enriquecido con secciones: TEXT, ITEM, RECIPE, ENTITY, IMAGE, SEPARATOR. |
ENTITY_RENDER
Renderiza una entidad viva en 3D. Compatible con entidades de mods. Las entidades muestran automáticamente sus animaciones de reposo (idle).
- id: "render-zombie"
type: ENTITY_RENDER
x: 100
y: 100
width: 50
height: 50
properties:
entity: "minecraft:zombie"
scale: "35"
rotation_mode: "spin"
spin_speed: "0.5"
y_offset: "0"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
entity | ✅ Sí | — | ResourceLocation de la entidad. Ejemplo: minecraft:zombie, modid:entidad. |
scale | No | "30" | Tamaño del render. Mayor = más grande. |
rotation_mode | No | — | "spin": rotación continua. "static" / "fixed": rotación estática fija. "follow_mouse": la entidad sigue al cursor de forma suave. |
spin_speed | No | "0.5" | Velocidad de rotación en modo spin. |
y_offset | No | "0" | Desplazamiento vertical del modelo. |
ITEM_RENDER
Renderiza un ítem de Minecraft como modelo 3D completo — muestra el modelo con iluminación, a diferencia de ICON que muestra el sprite 2D plano.
- id: "render-espada"
type: ITEM_RENDER
x: 120
y: 80
width: 32
height: 32
properties:
item: "minecraft:diamond_sword"
scale: "2.0"
rotation_x: "20"
rotation_y: "45"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
item | ✅ Sí | — | ResourceLocation del ítem. Solo ítems de Minecraft vanilla. |
scale | No | "1.0" | Escala del modelo. |
rotation_x | No | — | Rotación en eje X en grados. |
rotation_y | No | — | Rotación en eje Y en grados. |
BLOCK_RENDER
Renderiza un bloque de Minecraft como modelo 3D isométrico.
- id: "render-diamante"
type: BLOCK_RENDER
x: 150
y: 100
width: 48
height: 48
properties:
block: "minecraft:diamond_block"
scale: "1.5"
rotation_y: "30"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
block | ✅ Sí | — | ResourceLocation del bloque. Solo bloques de Minecraft vanilla. |
scale | No | "1.0" | Escala del modelo. |
rotation_y | No | — | Rotación en eje Y en grados. |
SKILL_TREE
Renderiza un árbol de habilidades interactivo con nodos desbloqueables, conexiones visuales y efectos de animación. Los jugadores pueden gastar puntos para desbloquear habilidades.
- id: "skill-tree-ui"
type: SKILL_TREE
x: 0
y: 0
width: 500
height: 350
properties:
skill_tree_id: "combate"
point_type: "combat_points"
| Propiedad | Obligatorio | Default | Descripción |
|---|---|---|---|
skill_tree_id | ✅ Sí | — | ID del árbol de habilidades definido en skill_trees.yml. |
point_type | ✅ Sí | — | Tipo de puntos que este árbol consume (ej: "combat_points"). |
Acciones de botones
Los elementos BUTTON e IMAGE_BUTTON ejecutan una acción al hacer clic:
| Acción | Descripción |
|---|---|
open:<id> | Abre otra pantalla por su id. Agrega la actual a la pila de navegación. |
close | Cierra la pantalla actual. |
back | Vuelve a la pantalla anterior en la pila de navegación. |
start_event:<id> | Inicia el evento indicado en el servidor. |
abandon_event:<id> | Abandona el evento. Pide confirmación si no es repetible. |
none o vacío | Sin acción — el botón es decorativo. |
start_event y abandon_event se envían al servidor vía el bridge. El cliente no modifica el progreso directamente — espera la respuesta del servidor.