UI Setup
Overview of every UI component in a level scene — player and enemy HUD bars, inventory window, notifications, and win/options screens — with step-by-step Inspector configuration for each.
UI Components at a Glance
The level UI is split into three layers: HUD overlays that track live stats, modal windows opened on demand, and notification toasts triggered from code.
| Layer | Component | Purpose |
|---|---|---|
| HUD | PlayerHealthBar | Row of heart toggles that mirrors the player's current HP. |
| HUD | PlayerStaminaBar | Row of pip toggles that mirrors the player's current stamina. |
| HUD | HUD_ShowStatEffectNumber | Floating numbers that pop above a character whenever damage, healing, or a block occurs. |
| Enemy HUD | EnemyHealthBar | Numeric HP label on each enemy, updated on every hit. |
| Enemy HUD | EnemyActionSequencePanel | Grid of action icons showing the full enemy sequence on hover. |
| Enemy HUD | EnemyInstructionIndicator | Animated icon that transitions to match the enemy's active action. |
| Windows | InventoryWindow | Full-screen inventory displaying equipment slots, item slots, and stat totals. |
| Windows | WinScreenController | Modal overlay shown automatically when the level is completed. |
| Windows | GameOptionsMenu | In-game options panel with volume controls and map return. |
| Notifications | NotificationLayout | Toast pop-up with icon and message that auto-dismisses after 7 seconds. |
| Notifications | EquipmentNotification | Queued pop-up that announces newly received equipment items. |
Step 1 — Player HUD Bars
PlayerHealthBar and PlayerStaminaBar subscribe to LevelManager events automatically at startup ([DefaultExecutionOrder(10)]). No manual wiring to LevelManager is needed — place either component anywhere in the Canvas and assign its two Inspector fields.
| Component | Field | Type | What to assign |
|---|---|---|---|
PlayerHealthBar | heartPrefab | Toggle | Toggle prefab spawned once per maximum HP point. |
healthContainer | Transform | Parent transform that receives the spawned heart toggles. | |
PlayerStaminaBar | pointPrefab | Toggle | Toggle prefab spawned once per maximum stamina point. |
container | Transform | Parent transform that receives the spawned stamina pip toggles. |
Both bars destroy and re-spawn their toggles on each LevelManager.OnInitialize event, so the counts always match the LevelInfo values at the start of a run.
Step 2 — Floating Stat Numbers
Add HUD_ShowStatEffectNumber as a child of any GameObject that owns a Health or PlayerStamina component. The script finds those components via GetComponentInParent in Start() and subscribes automatically — no Inspector wiring is required.
Customise the three color fields in the Inspector to control how each event type is displayed:
| Field | Default | When applied |
|---|---|---|
negativeColor | Red | Damage received (Health.OnDamageApplied). |
positiveColor | Blue | Healing or stamina gain (PlayerStamina.OnValueChanged with a positive delta). |
blockedColor | Green | Blocked attack (Health.OnDamageBlocked). Displays a "Blocked" label instead of a number. |
Step 3 — Enemy HUD
Enemy HUD components are typically placed on a Canvas that is a child of the enemy prefab. Each component wires itself to its sibling EnemyController or Health in Start() — there is no extra setup in the Inspector beyond ensuring they share the same parent hierarchy.
| Component | What it shows | Trigger |
|---|---|---|
EnemyHealthBar | Current HP as a text label. | Health.OnHealthUpdated |
EnemyActionSequencePanel | Grid of all action icons and loop counts. Visible only on mouse hover. | Populated on initialization. |
EnemyInstructionIndicator | Animated icon that switches between actions as the enemy executes. | EnemyController.OnStart / OnActionChange / OnEnd |
Step 4 — Inventory Window
InventoryWindow is a singleton accessed at runtime via InventoryWindow.current. Open and close it from any script:
InventoryWindow.current.Open();
InventoryWindow.current.Close();
The window manages three categories of child widgets. Wire them up in the Inspector before entering Play Mode:
- Stats array — Add one
StatSlotentry per stat you want visible. Each entry pairs a Stat asset with aTMP_Textlabel; the window writes the current total to that label onRefresh(). - Equipment slots — Place one
EquipmentSlotLayoutper slot type (Weapon,Shield,Helmet,Armor,Boots) and set the matchingEquipment.Typeon each in the Inspector. Hovering an occupied slot shows a floating tooltip with stats and effects. - Item slots — A pool of
ItemSlotLayoutwidgets. The window fills them automatically from the inventory onOpen()andRefresh().
Call Refresh() manually if the inventory changes while the window is already visible.
Step 5 — Win Screen & Options Menu
WinScreenController subscribes to LevelManager.OnLevelCompleted and opens itself — no manual trigger is needed. GameOptionsMenu must be opened from a button using a standard UnityEvent or from code:
GetComponent<GameOptionsMenu>().Open();
GetComponent<GameOptionsMenu>().Close();
Both extend Window, so they play the openSound / closeSound clips assigned in the Inspector automatically.
Step 6 — Notifications
Show a generic toast from any MonoBehaviour:
NotificationLayout notificationPrefab; // assign in Inspector
notificationPrefab.CreateInstance(icon, "Your message here", transform);
The notification slides in, holds for 7 seconds, then dismisses itself. The parent argument controls where it is placed in the Canvas hierarchy; pass null to use the prefab's default parent.
Queue an equipment announcement from anywhere — including across scene loads:
EquipmentNotification.AddEquipment(equipment);
If a notification is already on screen, the new one enters the queue and appears automatically once the current one is dismissed.
Step 7 — Custom Windows
Subclass Window to add any new modal panel to your scene:
public class MyPanel : Window
{
public override void Open()
{
// run custom logic before the panel appears
base.Open();
}
public override void Close()
{
base.Close();
// run custom logic after the panel hides
}
}
Assign openSound and closeSound clips in the Inspector for automatic SFX. If no AudioSource is assigned the window opens and closes silently.