-
Notifications
You must be signed in to change notification settings - Fork 4
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