Switch

A Switch is a representation of a physical switch that allows users to turn things on or off. Consider using a CheckBox instead if you want the user to select or deselect values, for example in a list with multiple options.

Properties

  • checked_icon (in image): The icon that is displayed if checked is true.
  • unchecked_icon (in image): The icon that is displayed if checked is false.
  • text (in string): If set to false the checkbox is disabled.
  • enabled (in bool): If set to false the checkbox is disabled.
  • checked (in-out bool): Whether the checkbox is checked or not (default: false).
  • style (in SwitchStyle): Defines the style of the checkbox.
  • box_style (out BorderStyle): Gets the style of the check box.
  • box_icon_style (out IconStyle): Gets the style of the check box icon.
  • text_style (out TextStyle): Gets the style of the text of the checkbox.
  • layout_style (out LayoutStyle): Gets the style of the layout.

Callbacks

  • toggled(/* checked */ bool): The checked value changed.

Example

import { Switch } from "@vivi/magic.slint";
export component Example inherits Window {
    width: 200px;
    height: 25px;

    Switch {
        text: "Hello World";
    }
}