52 lines
2.1 KiB
Markdown
52 lines
2.1 KiB
Markdown
# VulkanUI
|
|
|
|
A walking tour of the V1 widget set. UI-only (no 3D pass), so the entire
|
|
visible image comes from one compute dispatch per frame.
|
|
|
|
## What it shows
|
|
|
|
- **Layout**: nested `VStack` / `HStack` / `Spacer` / `TabView`, fluent
|
|
builder API, `Length::Px` / `Pct` / `Frac` / `Auto` units, DPI scaling
|
|
(your `Window::scale` flows through automatically).
|
|
- **Theming**: `themes::default_dark()` with `theme.primary` / `secondary`
|
|
/ `danger` / `input` styles applied per-widget via `.style(...)`.
|
|
- **Text**: per-run colour styling via `TextRun`, an em-dash in the
|
|
header to confirm UTF-8 decoding works end-to-end.
|
|
- **Buttons**: rounded background (SDF in the shader), centred SDF
|
|
glyphs, `onClick` callbacks. Quit calls `_Exit(0)` so a working click
|
|
visibly closes the window.
|
|
- **Progress bar**: a `ProgressBar` at 42 %.
|
|
- **TabView**: three tabs (Graphics / Input / Audio); clicking the
|
|
tab bar swaps content.
|
|
- **InputField**: focusable text edits with caret blink, UTF-8 typing,
|
|
Backspace / Delete / arrow keys / Home / End, key repeat, horizontal
|
|
scrolling that keeps the caret visible, clipping that prevents
|
|
overflow from drawing past the field's bounds.
|
|
|
|
## Run
|
|
|
|
```bash
|
|
cd examples/VulkanUI
|
|
crafter-build -r
|
|
```
|
|
|
|
## Interactions to try
|
|
|
|
| Action | Expected |
|
|
|---|---|
|
|
| Click `Play` / `Options` | Prints `[click] ...` to stderr |
|
|
| Click `Quit` | App exits |
|
|
| Click a tab label (Graphics / Input / Audio) | Tab body swaps |
|
|
| Click an `InputField` | Border turns blue, caret appears and blinks |
|
|
| Type | Characters appear at the caret, including multi-byte UTF-8 |
|
|
| Hold a letter | After ~500 ms the character starts repeating at ~25 Hz |
|
|
| Backspace / Delete | Removes one full UTF-8 codepoint |
|
|
| ← / → / Home / End | Moves the caret |
|
|
| Type past the right edge | Text scrolls left, caret stays visible |
|
|
| Click outside any input | Caret disappears (focus cleared) |
|
|
|
|
## Notes
|
|
|
|
The shader (`shaders/ui.comp.glsl` in the library) is compiled to
|
|
`ui.comp.spv` next to the binary by the build system.
|
|
The font (`Inter.ttf`) is bundled via `cfg.files.push_back`.
|