The PushButton component allows users to create interactive buttons within their displays.
On this page:
Requirements
This component is Portable. It runs both on Windows and on Web Pages hosted in any platform.
Configuration
- Go to Displays / Draw.
- On the Components Panel, select Interaction, then PushButton.
- Click or drag-and-drop it on the Drawing area to use it.
- Double-click the component to open the configuration window.
PushButton Settings | |
---|---|
Field | Description |
Label Text | Specifies the text displayed in the PushButton. |
Localize | Enables the label text to be dynamically adjusted based on the user’s locale settings, ensuring the interface is accessible and understandable for users from different language backgrounds. |
Linked Value | Associates the button with a tag, enumeration, value, or object. |
Binding | Sets the binding mode for the component. The options are: TwoWay: Updates the data source and UI interchangeably; OutputOnly: Allows data output without user input; InputOnly: Accepts user input without updating the data source. |
BorderThickness | Specifies the thickness of the PushButton border. The Apply button applies the specified border thickness. |
Label Settings
Label Settings | |
---|---|
Field | Description |
Position | Defines the label's position. There following options are available: Auto: The label position is determined automatically based on the available space and button size. Top: The label is positioned above the button. Left: The label is positioned to the left of the button. Inside: The label is positioned inside the button, usually centered. None: The button has no visible label. |
Width | Defines the label's width. |
Auto | When enabled, defines the label's width automatically. |
Preview | This option is available only when you link an object to the button. Preview options control the preview of the label content or data bindings. These options indicate the data linked to the button. Linked tag: Displays the object path of a linked tag, such as "Tag.Temperature.Value". Whitespace: Shows a white space as a placeholder. Placeholder: Displays the symbol ‘#’ as a placeholder. |
Format | This option is available only when an object is linked to the button. It allows you to define an expression to format the selected label. For example, ‘N1’ formats a number with one decimal place. |
Runtime Execution
The application instantly performs the linked action when users press the PushButton. This button provides immediate feedback, confirming the interaction. The event handler then executes the command, such as initiating a process, starting data logging, or resetting an alarm, ensuring prompt responses.
In this section: