Skip to main content

Toggle button

This is a toggle button that supports On/Off states, and is useful for conveying state when multiple options need to be provided.

toggle_anatomy.svg

1. Root : The top-level container that wraps the button
2. Label : Button label
3. Icon(Prefix) : Icon providing additional visual context for the label
4. Icon(Suffix) : Icon providing additional visual context for the label


States

StateValueDefaultDescription
ToggledBooleanFalseChanges to True when the toggle button is activated. The default value is False.
PressedBooleanFalseChanges to True when in a draggable window.
DisabledBoolean*When True, the button is in a disabled state and cannot be controlled.

toggle_state.svg



Properties

StateValueDescription
FloatingBooleanDisplayed with shadow or color depending on the background style.
SizeLarge, Medium, SmallYou can choose size options for the button.

toggle_property.svg