101 lines
3.1 KiB
Markdown
101 lines
3.1 KiB
Markdown
---
|
|
title: UI Systems
|
|
type: docs
|
|
weight: 5
|
|
---
|
|
|
|
The UI Systems section covers user interface, permissions, and custom pages.
|
|
|
|
## Overview
|
|
|
|
{{< cards cols="2" >}}
|
|
{{< card link="hud-manager" title="HUD Manager" subtitle="Control visibility of HUD components" icon="eye" >}}
|
|
{{< card link="custom-pages" title="Custom Pages" subtitle="Create custom UI overlays" icon="document-text" >}}
|
|
{{< card link="windows" title="Windows" subtitle="Inventory and crafting windows" icon="collection" >}}
|
|
{{< card link="ui-files" title="UI Files" subtitle="The .ui markup language" icon="code" >}}
|
|
{{< card link="ui-syntax" title="UI Syntax" subtitle="Variables, imports, templates" icon="document" >}}
|
|
{{< card link="ui-widgets" title="UI Widgets" subtitle="Available widget types" icon="cube" >}}
|
|
{{< card link="ui-properties" title="UI Properties" subtitle="Anchor, layout, padding" icon="adjustments" >}}
|
|
{{< card link="ui-styles" title="UI Styles" subtitle="Styling system" icon="color-swatch" >}}
|
|
{{< card link="permissions" title="Permissions" subtitle="Player permissions and access control" icon="shield-check" >}}
|
|
{{< /cards >}}
|
|
|
|
## Key Concepts
|
|
|
|
### HUD Components
|
|
|
|
The HUD consists of built-in components that can be shown or hidden:
|
|
|
|
- **Hotbar** - Item slots at the bottom of the screen
|
|
- **Health/Mana/Stamina** - Vital stat bars
|
|
- **Chat** - Text communication
|
|
- **Compass** - Direction indicator
|
|
- **Notifications** - Alert messages
|
|
- And many more...
|
|
|
|
### Custom Pages
|
|
|
|
Custom pages allow you to create overlay UIs using the `UICommandBuilder`:
|
|
|
|
```java
|
|
public class MyPage extends CustomUIPage {
|
|
|
|
public MyPage(PlayerRef ref) {
|
|
super(ref, CustomPageLifetime.CanDismiss);
|
|
}
|
|
|
|
@Override
|
|
public void build(Ref<EntityStore> ref, UICommandBuilder builder,
|
|
UIEventBuilder events, Store<EntityStore> store) {
|
|
// Build UI using builder.set(), builder.append(), etc.
|
|
builder.append("Pages/MyTemplate.ui");
|
|
builder.set("#title", "Welcome!");
|
|
}
|
|
}
|
|
```
|
|
|
|
### Page Manager
|
|
|
|
Each player has a `PageManager` that handles custom pages:
|
|
|
|
```java
|
|
Player player = ...;
|
|
PageManager pageManager = player.getPageManager();
|
|
|
|
// Open a custom page
|
|
pageManager.openCustomPage(ref, store, new MyPage(player.getPlayerRef()));
|
|
|
|
// Close to normal view
|
|
pageManager.setPage(ref, store, Page.None);
|
|
```
|
|
|
|
## Accessing the HUD Manager
|
|
|
|
```java
|
|
Player player = ...;
|
|
HudManager hudManager = player.getHudManager();
|
|
|
|
// Hide all HUD components
|
|
hudManager.setVisibleHudComponents(player.getPlayerRef());
|
|
|
|
// Show specific components
|
|
hudManager.showHudComponents(player.getPlayerRef(),
|
|
HudComponent.Hotbar,
|
|
HudComponent.Health
|
|
);
|
|
```
|
|
|
|
## Architecture
|
|
|
|
```
|
|
Player
|
|
├── HudManager → Controls HUD visibility
|
|
├── PageManager → Manages custom pages
|
|
│ └── CustomUIPage → Your custom UI
|
|
└── WindowManager → Manages windows (inventory, crafting)
|
|
```
|
|
|
|
{{< callout type="info" >}}
|
|
UI operations are typically performed through the `PlayerRef` or `Player` component. Access these through events or the command context.
|
|
{{< /callout >}}
|