Component Palette Icon:

On this page ...

This component consists of two or more buttons arranged in a column, row, or grid. Each button corresponds to an integer-valued state and is displayed with the correct style based on the component's Indicator Value. When a button is pressed then released, its value is written to the Control Value. 


Properties

NameDescriptionProperty TypeScriptingCategory
Confirm TextThe message to display in a confirmation box if Confirm? is true. Default is "Are you sure?"string.confirmTextBehavior
Confirm?If true, a confirmation box will be shown.boolean.confirmBehavior
Control ValueValue that controls the state. Typically, this is bound to the same location as the Indicator Value.int.controlValueData
CursorThe mouse cursor to use when hovering over this component. Options are: Default, Crosshair, Text, Wait, Hand, Move, SW Resize, or SE Resize.int.cursorCodeCommon
Display StyleThe display style (rows or columns) for this N-state button.int.displayStyleAppearance
EnabledIf disabled, a component cannot be used.boolean.componentEnabledCommon
FocusableIf false, users cannot interact with the component using the keyboard.boolean.focusableEnabledBehavior
FontFont of text on this component.Font.fontAppearance
Grid ColsThe number of columns if the Display Style is set to "Grid" mode.int.gridColsAppearance
Grid RowsThe number of rows if the Display Style is set to "Grid" mode.int.gridRowsAppearance
Horizontal GapThe horizontal spacing between buttons.int.hGapAppearance
Indicator ValueValue that indicates the current state. Typically, this is bound to the same location as the Control Value.int.indicatorValueData
Mouseover TextThe text that is displayed in the tooltip which pops up on mouseover of this component.String.toolTipTextCommon
NameThe name of this component.String.nameCommon
QualityThe data quality code for any tag bindings on this component.QualityCode.qualityData
RolloverIf true, the button may indicate that the mouse is hovering over it.boolean.rolloverEnabledBehavior
StatesA Dataset that stores the information for the different states.Dataset.statesBehavior
Vertical GapThe vertical spacing between buttons.int.vGapAppearance
VisibleIf disabled, the component will be hidden.boolean.visibleCommon
Deprecated Properties
Data QualityThe data quality code for any tag bindings on this component.int.dataQualityDeprecated


Scripting

Component Functions

This component does not have component functions associated with it.

Extension Functions

This component does not have extension functions associated with it. 

Event Handlers

Event handlers allow you to run a script based off specific triggers. See the full list of available event handlers on the Component Events page.


Customizers

  • The Multi-State Button Customizer consists of four panels:

    • Preview: Displays a preview image of the component
    • States: Displays a list of possible states. Each state corresponds to one button. You may add, remove, and re-order states.
    • Selected Style: Displays configurable style properties for the selected button. The button will use this style when its state is active. 
    • Unselected Style: Displays configurable style properties for the selected button. The button will use this style when its state is inactive.

    PropertyDescription
    TextText displayed on the button.
    Background ColorColor of the button.
    Foreground ColorColor of the text.
    BorderType of border around the button.
    Image PathRelative path for an image on the button.


Examples

Stylized Multi-State Button

Property NameValue
Display StyleGrid
Styles


  • No labels