The TextBox component allows users to enter and edit numeric values within their applications. It is commonly used for forms, data entry, and any scenario where text input is required.
| Table of Contents | ||||
|---|---|---|---|---|
|
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 TextBox, PasswordBox, or NumericTextBox.
- Click or drag-and-drop it on the Drawing area to use it.
- Double-click the component to open the configuration window.
NumericTextBox Settings | |
|---|---|
Label Text | Specifies the text displayed next to the NumericTextBox. It helps users understand the context or purpose of the displayed value. In this example, it displays {Tag.Temperature}. |
Linked Value | Binds the NumericTextBox to a specific tag or variable (Tag.Temperature.Value). This binding ensures the NumericTextBox displays and controls the value of the specified tag. |
Binding | Sets the binding mode for the component. Options are: TwoWay: Updates the data source and UI interchangeably. Output Only: Updates the UI based on the data source without allowing user input to affect the data source. Input Only: Accepts user input and updates the data source, but changes in the data source do not update the UI. |
Step | Specifies the increment value for the NumericTextBox. Default is 1, which means the value will increase or decrease by 1 unit with each step. |
MinValue | Specifies the minimum value that the NumericTextBox can display or accept. |
MaxValue | Specifies the maximum value that the NumericTextBox can display or accept. |
Preview | Controls the preview of the label content or data bindings. Options are: LinkedTags: 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 | Allows users to define a formatting expression for the displayed text. |
Border | Sets the border style for the NumericTextBox. Options are: OutlineAndFill: Combines both an outline and a fill effect for the border. OutlineOnly: Displays only the outline of the control. HorizontalLine: Shows a horizontal line as the border. |
ShowClearButton | When checked, displays a button to clear the text content within the NumericTextBox. |
Label Settings: Position | Defines the label's position relative to the NumericTextBox. Options are: Auto: The label position is determined automatically based on the available space and button size. Top: The label is positioned above the NumericTextBox. Left: The label is positioned to the left of the NumericTextBox. Inside: The label is positioned inside the NumericTextBox, usually centered. None: The NumericTextBox has no visible label. |
Width | Specifies the width of the label. Default is 80. |
Auto | When enabled, the label's width is defined automatically. |
Preview (Label Settings) | Controls the preview of the label content or data bindings. Options are: LinkedTags: 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 (Label Settings) | Allows to define an expression to format the selected label. For example: 0.00 (number with 2 decimal places). |
Runtime Execution
When users type into a NumericTextBox, the application captures and processes the input. Applying to the tag defined in the LinkedValue.
In this section...
| Page Tree | ||
|---|---|---|
|