Toggle Switch in Qt

Question

I am trying to use an element which is the equivalent of Android Switches in Qt. I have found a ToggleSwitch in QML, but nothing in the actual C++ Qt libs. Am I just missing

Answer 1

Also see QRadioButton and QPushButton with checkable and some style-sheet or custom drawing can be made like "On/off switches toggle"

Answer 2

@piccy's suggestion is what I've done for such a toggle switch previously. With a few tweaks tho.

We had to emulate the behaviours similar to the iOS on/off switches. Meaning you needed a gradual movement which you won't have with slider being with a limit of 0-1 without external animations.

Hence what I did was set the value range for the slider to be the same as the max width of the slider.

Then connect the slider released signal and check if the value is less than half the maximum and if so set slider value to 0 else slider value to max.

This will give you a good drag effect and clip to extremes when you release the mouse.

If you want the slider to just toggle when clicked on the other side without any drag connect the slider value changed signal and check the new value to be closer to either extreme and set it as the slider value if the slider is not in its down state. Do not change slider value if slider is down since you might then break the previous drag motion.

Answer 3

I know this thread is old, but I struggled quite a bit with this particular issue despite being given a very good hint by Viv.

Anyway, I figured I'd share the solution I came up with on here, maybe it'll help someone else along the way.

void Switch::on_sldSwitch_actionTriggered(int action) {
    if(action != 7) ui->sldSwitch->setValue((action%2) ? 100 : 0);
}

void Switch::on_sldSwitch_sliderReleased() {
    ui->sldSwitch->setValue((ui->sldSwitch->sliderPosition() >= 50) ? 100 : 0);
}

A little explanation: actionTriggered will be called each time the slider is clicked or moved with the keyboard. When it is dragged, it will emit the signal '7'. To avoid immediate snapping, action 7 is blocked.

When moving to the right, it emits 3 while clicking and 1 while hitting 'right' (or 'down') on the keyboard, which is why we're snapping to the right when it's not an even number.

When moving left, it emits 2 or 4.

sliderReleased() will get called once you let go of the mouse button after dragging, however at this moment, the slider still has its old value (which tripped me up quite a bit). So, in order to get the correct position to snap to I queried sliderPosition instead of value and that's that.

I hope this helps someone.

Answer 4

Well, you'll have to use QCheckBox. It's not a Toggle Switch, but it does same thing. If you really want different visual, you'll have to create custom widget