Sprites.Ui.Window
Titled panels, modal or floating.
Sprites.Ui.Window.Floating Void
Sprites.Ui.Window.Floating(visible, title, hasClose, resizeable, place, content)
A floating window, shown while visible is true. It drags by its title bar; hasClose adds a close button, and resizeable adds grips to drag its edges and corners. By default it opens centred and content sized; place opens it at a chosen spot instead.
| Input | Type | Description |
|---|---|---|
visible | Sprites.Reactive.Value | Shows the window while true. A close button clears it. |
title | String or Sprites.Reactive.Value | The title bar text and drag handle. |
hasClose | Boolean | Adds a close button. |
resizeable | Boolean | Adds grips to drag the edges and corners. |
place | Object | Optional (pass null to skip). Pins the opening corner in viewport pixels, with left, top, right or bottom, and a minWidth that overrides the centred default's floor. |
content | Function | Builds the window body. Last, so it reads as the trailing block. |
Returns nothing.
const open = Sprites.Reactive.Value(false);
const name = Sprites.Reactive.Value('Hero');
Sprites.Ui.Button.SetValue(open, true, 'Open tools');
Sprites.Ui.Window.Floating(open, 'Tools', true, true, null, () => {
Sprites.Ui.Content.Area(() => {
Sprites.Ui.Input.Text(name);
});
});Sprites.Ui.Window.Modal Void
Sprites.Ui.Window.Modal(visible, title, width, height, content)
A modal window over a backdrop, shown while visible is true. It centres over the nearest overlay region, or the whole window when there is none. Width and height are optional.
| Input | Type | Description |
|---|---|---|
visible | Sprites.Reactive.Value | Shows the window over a backdrop while true. |
title | String or Sprites.Reactive.Value | The title bar text. |
width | Number | Optional width in pixels. |
height | Number | Optional height in pixels. |
content | Function | Builds the window body. |
Returns nothing.
const open = Sprites.Reactive.Value(false);
const name = Sprites.Reactive.Value('Hero');
Sprites.Ui.Button.SetValue(open, true, 'Rename');
Sprites.Ui.Window.Modal(open, 'Rename', 320, null, () => {
Sprites.Ui.Content.Area(() => {
Sprites.Ui.Input.Text(name);
});
Sprites.Ui.Window.Footer(() => {
Sprites.Ui.Button.SetValue(open, false, 'Done');
});
});