Interfețe Grafice (UI) cu Noduri Control în Godot 4: Containere și Ancore în GDScript (Godot Engine)

Ghid complet pentru construirea interfețelor de utilizator în Godot 4: nodurile Control, alinierea automată cu VBoxContainer și HBoxContainer, sistemul de ancore și stilizarea temelor.

Sintaxă
anchors_preset = Control.PRESET_FULL_RECT; $VBoxContainer.add_child(buton)

Toate elementele de interfață din Godot (butoane, bare de viață, etichete text, meniuri) moștenesc nodul de bază Control. Marele avantaj al motorului Godot este sistemul inteligent de rezoluție responsivă bazat pe Ancore (Anchors) și Containere automate.

Crearea unui meniu de pauză dinamic și centrat
extends CanvasLayer

@onready var container_butoane: VBoxContainer = $MarginContainer/VBoxContainer
@onready var eticheta_titlu: Label = $MarginContainer/VBoxContainer/TitluLabel

func _ready() -> void:
    # Conectarea semnalului 'pressed' al unui buton din interfață:
    $MarginContainer/VBoxContainer/BtnContinua.pressed.connect(_on_continua_pressed)
    $MarginContainer/VBoxContainer/BtnIesire.pressed.connect(_on_iesire_pressed)

func _on_continua_pressed() -> void:
    # Dezactivează pauza jocului și ascunde meniul:
    get_tree().paused = false
    visible = false

func _on_iesire_pressed() -> void:
    get_tree().quit()
Nod Container Descriere organizare elemente
VBoxContainer Aranjează automat toate nodurile copil într-o coloană verticală unică.
HBoxContainer Aranjează automat nodurile copil într-un rând orizontal.
GridContainer Organizează elementele într-o grilă tabelară cu număr fix de coloane (ideal pentru inventare).
MarginContainer Adaugă margini de spațiere interioară (padding) pe cele 4 laturi.