Differences

This shows you the differences between two versions of the page.

--- mistudio:design_editor:more_layout:buttons_inputs:checkbox [2026/09/18 13:36] – removed - external edit (Unknown date) 127.0.0.1
+++ mistudio:design_editor:more_layout:buttons_inputs:checkbox [2026/09/18 15:33] (current) – tputman
@@ Line 1: / Line 1: @@
+===== CheckBox =====
+com.ergotech.vib.graphics.CheckBox
+==== Image Examples ====
+| {{:mistudio:graphics:more_layout:buttons_inputs:pasted:20260627-120739.png?40|CheckBox in the graphics palette}} | {{:mistudio:graphics:more_layout:buttons_inputs:pasted:20260627-120816.png?120|CheckBox graphic example}} |
+| //CheckBox in the graphics palette.// | //CheckBox graphic example.// |
+==== Overview ====
+The CheckBox graphic is a More Layout input control used for selected and unselected behavior.
+CheckBox can be used as a two-state control. It can switch between an off state and an on state, and it sends a value when the state changes.
+CheckBox can display different labels for the off and on states.
+==== Common Uses ====
+  * Creating a selected or unselected control
+  * Sending a checkbox value into application logic
+  * Creating on/off operator controls
+  * Displaying off and on labels
+  * Sending high and low values
+  * Updating a displayed checkbox state from logic
+==== Input Behavior ====
+CheckBox can be updated from an input connection.
+The **updateDisplayedValue** port updates the displayed CheckBox state from logic, a data source, or another component.
+==== Output Behavior ====
+CheckBox sends its current value through **PrimaryOutPort**.
+In a typical selected/unselected setup, the unchecked state sends the configured **Low Value**, and the checked state sends the configured **High Value**.
+==== CheckBox-Specific Behavior ====
+CheckBox is designed for two-state selected and unselected behavior.
+CheckBox-specific settings include:
+  * **Name** Sets the name of the CheckBox graphic.
+  * **Enabled** Controls whether the user can interact with the CheckBox.
+  * **Font** Controls the font used for the CheckBox label.
+  * **Text Color** Sets the CheckBox label text color.
+  * **High Value** Sets the value used for the checked or active state.
+  * **Low Value** Sets the value used for the unchecked or inactive state.
+  * **Off Label** Sets the label shown for the unchecked or off state.
+  * **On Label** Sets the label shown for the checked or on state.
+  * **Background Color** Sets the CheckBox background color.
+  * **ImageOff** Selects the image used for the off state.
+  * **ImageOn** Selects the image used for the on state.
+  * **Visible** Controls whether the CheckBox is shown.
+==== Logic Ports ====
+In the Logic Editor, CheckBox includes these default ports:
+  * **PrimaryOutPort**
+  * **updateDisplayedValue**
+The **PrimaryOutPort** sends the CheckBox output value.
+The **updateDisplayedValue** port updates the displayed CheckBox state from another source.
+==== Notes ====
+Use CheckBox when users need to select or clear a two-state option.
+Use [[mistudio:design_editor:more_layout:buttons_inputs:roundcheckbox|RoundCheckBox]] for the round checkbox variation.
+Use [[mistudio:design_editor:more_layout:buttons_inputs:button|Button]] for button-style on/off behavior.
+Use [[mistudio:design_editor:more_layout:buttons_inputs:bootstrapbutton|BootstrapButton]] for Bootstrap-style button behavior.
+For general graphic behavior, see [[mistudio:design_editor:active_graphic|Active Graphic]].
+==== Related Pages ====
+  * [[mistudio:design_editor:start|MIStudio Design Editor]]
+  * [[mistudio:design_editor:more_layout:start|More Layout]]
+  * [[mistudio:design_editor:more_layout:buttons_inputs:start|Buttons and Input Controls]]
+  * [[mistudio:design_editor:more_layout:buttons_inputs:button|Button]]
+  * [[mistudio:design_editor:more_layout:buttons_inputs:bootstrapbutton|BootstrapButton]]
+  * [[mistudio:design_editor:more_layout:buttons_inputs:roundcheckbox|RoundCheckBox]]
+  * [[mistudio:design_editor:active_graphic|Active Graphic]]