Variable: Switch

const Switch: "Switch"

Defined in: react/src/generated/jsx.ts:15503

Shows a "light switch" that has two states: on or off.

The user can control which state should be active by clicking the empty area, or by dragging the slider.

GtkSwitch can also express situations where the underlying state changes with a delay. In this case, the slider position indicates the user's recent change (represented by the [property@Gtk.Switch:active] property), while the trough color indicates the present underlying state (represented by the [property@Gtk.Switch:state] property).

See [signal@Gtk.Switch::state-set] for details.

Shortcuts and Gestures

GtkSwitch supports pan and drag gestures to move the slider.

CSS nodes

switch
├── image
├── image
╰── slider

GtkSwitch has four css nodes, the main node with the name switch and subnodes for the slider and the on and off images. Neither of them is using any style classes.

Accessibility

GtkSwitch uses the [enum@Gtk.AccessibleRole.switch] role.