Qt Reference Documentation

QML Switch Element

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

This element was introduced in Qt Quick Components 1.0.

Properties

Signal Handlers

Detailed Description

You can use the Switch component, for example, to enable and disable an application feature based on the user's input. 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

checked : bool

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

See also clicked.


platformInverted : bool

Symbian:

If platformInverted is true, the component is visualized with the inverted style. For more information, see Using Inverted Style with Symbian Components. By default platformInverted is false.

This property group was introduced in Qt Quick Components 1.1.


pressed : bool

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


Signal Handler Documentation

Switch::clicked ()

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

See also checked.