-
Notifications
You must be signed in to change notification settings - Fork 5
switch
Quetzy edited this page Jun 20, 2022
·
2 revisions
A switch element allows you to conditionally render different UI based on a data binding. For example, you may want to render one thing if a value in your game data is true, or another if it's false. switch also supports strings, so you might want to switch on something like left/right or top/bottom.
TODO
switch_on and cases
| Property | Type | Default Value? | Bindable? | Description |
|---|---|---|---|---|
switch_on |
{binding} to a boolean or string value | - | yes | The switch_on binding determines the value that will be used to decide which 'case' to render from the cases property. |
cases |
string-to-YUI-Element map (struct) | - | - | The cases property is a struct, which maps one of the expected case values to a YUI element. See the cases example below if this sounds confusing. |
default_case |
YUI element | - | - | The default_case property can be used to define a renderer to use when the value from switch_on does not have a matching case in the cases definition. |
cases is a map, which pairs a 'key', corresponding to the resolved value from switch_on to a YUI element to render when the resolved value matches the case key. For example:
cases:
top:
type: text
text: This will only render if the switch value is 'top'
bottom:
type: text
text: And this will only render if the switch value is 'bottom'
This example is only rendering simple text elements, but any YUI Element (or panel of elements, etc) can be used.
Home - Elements - Built-in Widgets - YuiScript - Themes -- Custom Widgets