Qt Reference Documentation

QML Switch Element

Provides an icon representing a physical switch that the user can turn on and off. More...

Inherits Item

  • List of all members, including inherited members
  • Properties

    Signals

    Detailed Description

    You can bind the Switch component to a feature that the application has to enable or disable depending on the user's input, for example. Switch has similar usage and API as CheckBox, except that Switch does not provide a built-in label.

    Using a Switch

    In this example the user can turn a switch on and off. In the code snippet below the switch is defined. The text label is bound to the checked property - this way the text label shows the switch's state to the user.

         Row {
             id: rowRow
             spacing: 10
             anchors.fill: parent
    
             Switch {
                 id: switchComponent
             }
    
             Text {
                 width: rowRow.width - rowRow.spacing - switchComponent.width
                 height: switchComponent.height
                 verticalAlignment: Text.AlignVCenter
                 text: switchComponent.checked ? "Switched on" : "Switched off"
                 font.pixelSize: platformStyle.fontSizeMedium
                 color: platformStyle.colorNormalLight
             }
         }

    The screenshot below illustrates the case where the user has turned the switch on.

    Property Documentation

    read-onlychecked : bool

    If a switch is turned on, checked is true; otherwise false.

    See also clicked.


    read-onlypressed : bool

    When the user presses or drags the switch, the value is true; otherwise false.


    Signal Documentation

    Switch::clicked ()

    This signal is emitted when the switch state is toggled from 'on' to 'off' or vice versa.

    See also checked.