Keypad

The Keypad object enables users to input numerical codes, whether with or without decimal digits, and offers the flexibility to specify the desired number of digits.

The field value is sent as a command to the server:

• when the user changes it, if Auto Send it true

• when a button with submit action is pressed (sending multiple fields at once)

Keypad example: writing a BACnet value

Attributes

Common

ID

Sets the object's ID.

The ID identifies the object and is used to reference it in UISet actions, allowing to change its attributes dynamically.

The ID is not unique, it can be shared among multiple objects to quickly change a common attribute.

IDs can't be changed with a UISet action, but they can have a Value Binding assigned to them. Value Bindings on IDs allow an object to be dynamically attached to a set of attribute values.

E.g. the following Value Binding switches the ID of the object between mybutton1 and mybutton2 based on the value of the UISet button.address:

Value binding:

"mybutton" + ui('button', 'address')

UISet:

UISet('button', 'address', '1') switches the ID to mybutton1

UISet('button', 'address', '2') switches the ID to mybutton2

Position and Size

Position

Sets the object's position.

Attribute Values

Value	Description	Example
x<left>y<top>	Specify left/top coordinates in pixels.	x10y20

This attribute is available when parent's layout is neither "flex" nor "grid".

When parent's layout is neither "flex" nor "grid", this attribute defaults to x0y0.

Flex Grow

Specifies if the objects should grow to fill the available space.

Attribute Values

Value	Description
false	Default value. Objects do not grow to fill the available space.
true	Objects expand to fill the available space.

This attribute is available when parent's layout is "flex".

The default value is: false.

Flex Shrink

Specifies if the objects should shrink to fit the available space.

Attribute Values

Value	Description
false	Default value. Objects do not shrink to fit the available space.
true	Objects shrink to fit the available space.

This attribute is available when parent's layout is "flex".

The default value is: false.

Column

Specifies the starting column of the object inside a grid container.

Minimum value is 1.

Attribute Values

Value	Description
<int>	Column index starting from 1.

This attribute is available when parent's layout is "grid".

note

This attribute is experimental. It might not work properly and it might be modified or removed in a future release.

Column Span

Specifies how many grid columns the object spans.

Minimum value is 1.

Attribute Values

Value	Description
<int>	Column span starting from 1.

This attribute is available when parent's layout is "grid".

When parent's layout is "grid", this attribute defaults to 1.

note

This attribute is experimental. It might not work properly and it might be modified or removed in a future release.

Row

Specifies the starting row of the object inside a grid container.

Minimum value is 1.

Attribute Values

Value	Description
[empty]	Auto placement by the grid.
<int>	Row index starting from 1.

This attribute is available when parent's layout is "grid".

When parent's layout is "grid", this attribute defaults to auto.

note

This attribute is experimental. It might not work properly and it might be modified or removed in a future release.

Row Span

Specifies how many grid rows the object spans.

Minimum value is 1.

Attribute Values

Value	Description
<int>	Row span starting from 1.

This attribute is available when parent's layout is "grid".

When parent's layout is "grid", this attribute defaults to 1.

note

This attribute is experimental. It might not work properly and it might be modified or removed in a future release.

Width

Sets the object's width in pixels.

Minimum value is 200.

Height

Sets the object's height in pixels.

Minimum value is 280.

Field

Name

Specifies the name of the field, used to send a command to the server, along with the field's value as a parameter.

If the name starts with $, then the server will automatically set a variable with the same name as the command, containing the command's parameter.

Attribute Values

Value	Description	Example
<string>	Command name.
$[variable name]	A command name that sets a variable.	$myvar
$[variable name]!	A command name that sets a persistent variable.	$myvar!

By default, this attribute uses the id attribute.

Value

Specifies the field's value.

Min

Specifies the minimum value allowed.

Attribute Values

Value	Description
<string>	Minimum value.

Max

Specifies the maximum value allowed.

Attribute Values

Value	Description
<string>	Maximum value.

Digits

Specifies the number of digits allowed.

Attribute Values

Value	Description
auto	Any number of digits.
<int>	Maximum number of digits.

Decimals

Specifies the number of decimals allowed.

Attribute Values

Value	Description
<int>	Number of decimals.

The default value is: 0.

Password

Hides the typed value, providing a way for the user to securely enter a password.

Attribute Values

Value	Description
false	Default value. Typed value is not hidden.
true	Hide the typed value.

The default value is: false.

Layout

Label

Specifies a label.

Attribute Values

Value	Description
<string>	Label.

Style

Panel

Shows a panel that frames the object. Its style can be modified.

Attribute Values

Value	Description
true	Default value. Shows the panel.
false	Hides the panel.

The default value is: true.

Panel Color

Specifies the panel color.

Attribute Values

Value	Description
default	Default color.
primary	Primary color, used to highlight important areas.
warning	Warning color, used to highlight warning areas.
success	Success color, used to highlight success areas.
error	Error color, used to highlight error areas.
red,blue,yellow,green,yellow,purple,orange,green	Palette colors.
custom	Custom color, defined in the "Custom Color" attribute.

This attribute is available when panel is "true".

When panel is "true", this attribute defaults to true.

Panel Custom Color

Specifies the panel custom color.

Attribute Values

Value	Description	Example
<html color>	Color in any html accepted format.	#ff0000

This attribute is available when panelstyle is "custom" or panelstyle is "glass" or panelcolor is "custom".

When panelstyle is "custom" or panelstyle is "glass" or panelcolor is "custom", this attribute defaults to true.

Button Color

Specifies the button color.

Attribute Values

Value	Description
default	Default value. Default color.
primary	Primary color, used to highlight action buttons.
warning	Warning color, used to highlight warning buttons.
success	Success color, used to highlight success buttons.
error	Error color, used to highlight error buttons.
light	Light color.
dark	Dark color.
red,blue,yellow,green,yellow,purple,orange,green	Palette colors.
custom	Custom color, defined in the "Custom Color" attribute.

The default value is: default.

Button Custom Color

Specifies the button's custom color.

Attribute Values

Value	Description
<html color>	Any valid HTML color.

This attribute is available when buttoncolor is "custom" or buttonlook is "glass".

Button Look

Specifies the button's look.

Attribute Values

Value	Description
filled	Default value. Filled look, with a solid background.
clear	Clear look, no background or border.
outlined	Outlined look, with a solid border.
glass	Glass look, with a semi-transparent background.

The default value is: filled.

Button Shape

Specifies the button's shape.

Attribute Values

Value	Description
default	Default value. Default shape.
rounded	Rounded shape.
pill	Pill or circle shape.
rectangle	Rectangle shape.

The default value is: default.

Meta

Comment

Specifies a comment, visible only in the Project Editor. It can be used to add a note or a tag to the object. The filter in the object's SELECT panel applies to the comment as well.

note

This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.

Exclude

Excludes the object from the UI. Useful to temporarily hide an object without deleting it. Different from the "Visible" attribute, which hides the object in the UI but keeps it in the project, allowing it to be shown again with a UISet.

Attribute Values

Value	Description
false	Default value. Object is included in the UI.
true	Object is excluded from the UI.

The default value is: false.

note

This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.