• View
• Edit
• History
• Print

User Interface Elements

Gauge

Gauges display values as ratios or percentages, either vertically or horizontally.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Color Mask	The color mask to apply to the element.	Color
Current Value	The templated value to leverage to control the current value of the gauge.	String
End	The sprite to use for the end of the gauge.	Sprite
Fill	The sprite to use for the filled area between the start and end of the gauge.	Sprite
Fill Strategy	The method of utilizing the Fill to fill between the start and end of the gauge.	Fill Strategy
Maintain Limits	Whether or not to prevent the gauge from growing beyond the minimum or maximum values.	Toggle
Maximum Value	The templated value to leverage to control the maximum value of the gauge.	String
Minimum Value	The templated value to leverage to control the minimum value of the gauge.	String
Orientation	The orientation of the gauge.	Orientation
Start	The sprite to use for the start of the gauge.	Sprite

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle

List

Lists are used to setup simple, fixed selectable options. A more extensible version, the Templated List?, can be used to display highly configurable, variable selectable options.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Enable Looping	Whether or not the items in the element loop to the beginning after reaching the end and vice versa.	Toggle
Hide When Unfocused	Whether or not to hide the element when it becomes unfocused.	Toggle
Orientation	The direction of the items composition in the element.	Orientation

Cursor Appearance

Name	Explanation	Type
Animate Cursor When Unfocused	Whether or not to animate the cursor when the element is unfocused.	Toggle
Color Mask	The color mask to apply to the cursor on the element.	Color
Cursor Fits Contents	Whether or not the cursor is stretched to fit the currently selected item in the element.	Toggle
Cursor Mask Margin	The margin to apply to the cursor on the element.	Number
Mask Strategy	The strategy used to compose the masked cursor on the element.	Skin Strategy
Cursor Offset	The amount in pixels to offset the cursor on the element.	Number
Hide Cursor When Unfocused	Whether or not to hide the cursor when the element is unfocused.	Toggle
Sprite	The sprite to use for the cursor on the element.	Sprite
Type	The method of displaying the cursor on the element.	Cursor Type

Cursor Sound Effects

Name	Explanation	Type
Use Default Sounds	Whether or not to use the default system sound effects.	Toggle
Buzzer Sound Effect	The sound to play when an invalid action occurs.	Sound Effect?
Confirm Sound Effect	The sound to play when confirmation occurs.	Sound Effect?
Movement Sound Effect	The sound to play when a cursor moves.	Sound Effect?

Item Appearance

Name	Explanation	Type
Color	The color of the text in the element.	Color
Drop Shadow Color	The drop shadow color of the text in the element.	Color
Drop Shadow Offset	The amount in pixels to offset the drop shadow for the text in the element.	Number
Font Family	The font family of the text in the element.	Font Family
Font Size	The font size of the text in the element.	Number
Horizontal Alignment	The horizontal alignment of the text in the element.	Alignment
Sprite Horizontal Alignment	The horizontal alignment of the sprite or image in the element.	Alignment
Sprite Margin Left	The left margin in pixels of the sprite or image in the element.	Number
Sprite Margin Top	The top margin in pixels of the sprite or image in the element.	Number
Sprite Margin Right	The right margin in pixels of the sprite or image in the element.	Number
Sprite Margin Bottom	The bottom margin in pixels of the sprite or image in the element.	Number
Sprite Vertical Alignment	The vertical alignment of the sprite or image in the element.	Alignment
Text Margin Left	The left margin in pixels of the text in the element.	Number
Text Margin Top	The top margin in pixels of the text in the element.	Number
Text Margin Right	The right margin in pixels of the text in the element.	Number
Text Margin Bottom	The bottom margin in pixels of the text in the element.	Number
Use Drop Shadow	Whether or not to use a drop shadow on the text in the element.	Toggle
Vertical Alignment	The vertical alignment of the text in the element.	Alignment

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle

Scripts

Name	Explanation	Type
Focused	The script to execute when the element gains focus.	Script
Unfocused	The script to execute when the element loses focus.	Script

Item Properties

Appearance

Name	Explanation	Type
Color Mask	The color of the text to override in the element.	Color
Override Styles	Whether or not the item should use different styling from what was specified in the list element.	Toggle
Sprite Horizontal Alignment	The horizontal alignment of the sprite or image to override in the element.	Alignment
Sprite Margin Left	The left margin in pixels of the sprite or image to override in the element.	Number
Sprite Margin Top	The top margin in pixels of the sprite or image to override in the element.	Number
Sprite Margin Right	The right margin in pixels of the sprite or image to override in the element.	Number
Sprite Margin Bottom	The bottom margin in pixels of the sprite or image to override in the element.	Number
Sprite Vertical Alignment	The vertical alignment of the sprite or image to override in the element.	Alignment
Text	The text to display in the element.	String
Text Margin Left	The left margin in pixels of the text to override in the element.	Number
Text Margin Top	The top margin in pixels of the text to override in the element.	Number
Text Margin Right	The right margin in pixels of the text to override in the element.	Number
Text Margin Bottom	The bottom margin in pixels of the text to override in the element.	Number
Use Space if Hidden	Whether or not to occupy the space if the item is not rendered.	Toggle
Use Sprite Only	Whether or not to display the sprite or image only.	Toggle

Scripts

Name	Explanation	Type
Execute	The script to execute when the item is selected.	Script
Focused	The script to execute when the item gains focus.	Script
Unfocused	The script to execute when the item loses focus.	Script

Pane

Panes are used to show a background pattern or border.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Background	The image to display as a background in the element.	Sprite
Color Mask	The color mask to apply to the element.	Color
Hue Shift	The hue shift to apply to the element.	Number
Strategy	The strategy used to compose the background.	Skin Strategy

Context

Name	Explanation	Type
Is Linked to Selected Context	Whether or not the context is linked to the current selection in the user interface.	Toggle
Is Linked to UI Context	Whether or not the context is linked to the user interface.	Toggle
Template Type	The data type to expect for templating. Note: This is not used by the engine and only assists in providing suggestions in the Template.	Data Type?

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle

Picture

Pictures are used to show static images or sprites, including animated, in a user interface.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Color Mask	The color mask to apply to the element.	Color
Horizontal Alignment	The horizontal alignment of the element.	Alignment
Hue Shift	The hue shift to apply to the element.	Number
Image	The static image to display in the element.	Image
Sprite	The sprite to display in the element.	Sprite
Stretch to Boundaries	Whether or not to stretch the image or sprite to fit the size of the element.	Toggle
Template	The template details for the element.	String
Use Template	Whether or not to use a template for the image or sprite.	Toggle
Vertical Alignment	The vertical alignment of the element.	Alignment

Context

Name	Explanation	Type
Is Linked to Selected Context	Whether or not the context is linked to the current selection in the user interface.	Toggle
Is Linked to UI Context	Whether or not the context is linked to the user interface.	Toggle
Template Type	The data type to expect for templating. Note: This is not used by the engine and only assists in providing suggestions in the Template.	Data Type?

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle

Templated List

Templated lists are used to setup dynamic selectable options. They are Context? driven, which allows for properties of different data types to be displayed.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Enable Looping	Whether or not the items in the element loop to the beginning after reaching the end and vice versa.	Toggle
Hide When Unfocused	Whether or not to hide the element when it becomes unfocused.	Toggle
Orientation	The direction of the items composition in the element.	Orientation
Template Type	The data type to expect for templating. Note: This is not used by the engine and only assists in providing suggestions in the Template.	Data Type?

Context

Name	Explanation	Type
Custom Context	The custom context property to use on the element.	String
Use Custom Context	Whether or not to use a custom context property on the element.	Toggle

Cursor Appearance

Name	Explanation	Type
Animate Cursor When Unfocused	Whether or not to animate the cursor when the element is unfocused.	Toggle
Color Mask	The color mask to apply to the cursor on the element.	Color
Cursor Mask Margin	The margin to apply to the cursor on the element.	Number
Mask Strategy	The strategy used to compose the masked cursor on the element.	Skin Strategy
Cursor Offset	The amount in pixels to offset the cursor on the element.	Number
Hide Cursor When Unfocused	Whether or not to hide the cursor when the element is unfocused.	Toggle
Sprite	The sprite to use for the cursor on the element.	Sprite
Type	The method of displaying the cursor on the element.	Cursor Type

Cursor Sound Effects

Name	Explanation	Type
Use Default Sounds	Whether or not to use the default system sound effects.	Toggle
Buzzer Sound Effect	The sound to play when an invalid action occurs.	Sound Effect?
Confirm Sound Effect	The sound to play when confirmation occurs.	Sound Effect?
Movement Sound Effect	The sound to play when a cursor moves.	Sound Effect?

Item Details

Name	Explanation	Type
Item Components	Enables the item component editor.
Margin Left	The left margin in pixels of the item in the element.	Number
Margin Top	The top margin in pixels of the item in the element.	Number
Margin Right	The right margin in pixels of the item in the element.	Number
Margin Bottom	The bottom margin in pixels of the item in the element.	Number
Pixel Width	The width in pixels of the item in the element.	Number
Pixel Height	The height in pixels of the item in the element.	Number
Relative Width	The width relative to the templated list of the item.	Number
Relative Height	The height relative to the templated list of the item.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the item in the element.	Toggle

Item Disabled Effect

Name	Explanation	Type
Color Mask	The color mask to apply to the item in the element.	Color
Grayscale	Whether or not to apply a grayscale tone to the item in the element.	Toggle
Invert Condition Value	Whether or not to invert the value of the relevant property.	Toggle
Opacity	The opacity of the item in the element.	Number
Switch	The global switch to leverage for the disabled effect.	Switch
Template	The templated value to leverage for the disabled effect.	String
Use Switch	Whether or not to use a global switch to control the accessibility of the item.	Toggle
Use Template Value	Whether or not to use a templated value to control the accessibility of the item.	Toggle
Visible	Whether or not the item should be visible when disabled.	Toggle

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle

Scripts

Name	Explanation	Type
Execute	The script to execute when an item is selected.	Script
Focused	The script to execute when the templated list gains focus.	Script
Item Focused	The script to execute when an item gains focus.	Script
Item Unfocused	The script to execute when an item loses focus.	Script
Unfocused	The script to execute when the templated list loses focus.	Script

Text

Text is used to display text or text patterns.

Properties

System

Name	Explanation	Type
Name	The name of the element.	String

Appearance

Name	Explanation	Type
Color	The color of the text in the element.	Color
Drop Shadow Color	The drop shadow color of the text in the element.	Color
Drop Shadow Offset	The amount in pixels to offset the drop shadow for the text in the element.	Number
Font Family	The font family of the text in the element.	Font Family
Font Size	The font size of the text in the element.	Number
Horizontal Alignment	The horizontal alignment of the text in the element.	Alignment
Text	The text to display in the element.	String
Use Drop Shadow	Whether or not to use a drop shadow on the text in the element.	Toggle
Use Word Wrapping	Whether or not to wrap text to fit cleanly on multiple lines.	Toggle
Vertical Alignment	The vertical alignment of the text in the element.	Alignment

Context

Name	Explanation	Type
Is Linked to Selected Context	Whether or not the context is linked to the current selection in the user interface.	Toggle
Is Linked to UI Context	Whether or not the context is linked to the user interface.	Toggle
Template Type	The data type to expect for templating. Note: This is not used by the engine and only assists in providing suggestions in the Template.	Data Type?

Effects

Name	Explanation	Type
Character Delay (milliseconds)	The number of milliseconds to wait before displaying the next character in the text	Number
Character Sound	The sound effect to play when each character displays in the text.	Sound Effect?

Position

Name	Explanation	Type
Margin Left	The left margin in pixels of the element.	Number
Margin Top	The top margin in pixels of the element.	Number
Margin Right	The right margin in pixels of the element.	Number
Margin Bottom	The bottom margin in pixels of the element.	Number
Pixel X	The x coordinate in pixels of the element.	Number
Pixel Y	The y coordinate in pixels of the element.	Number
Pixel Width	The width in pixels of the element.	Number
Pixel Height	The height in pixels of the element.	Number
Relative X	The x coordinate relative to the container of the element.	Number
Relative Y	The y coordinate relative to the container of the element.	Number
Relative Width	The width relative to the container of the element.	Number
Relative Height	The height relative to the container of the element.	Number
Use Relative Positioning	Whether or not to use relative positioning and sizing for the element.	Toggle