Qml-presentation-system and mouse interaction with a SlideSwitch



  • Hi everyone

    I'm preparing a speech with the qml-presentation-system.
    On one slide I have add a SlideSwitch.
    The SlideSwitch appears as expected but I can't move the handle.

    It seems that the MouseArea works perfect and receives the mouse click.
    But the drag is not working.
    The code below is working perfectly when I use qmlscene but integrated in the qml-presentation-system it is not working.
    Any ideas?

    @import QtQuick 2.0

    /**
    This item provides a secure slideswitch. A SlideSwitch is a switch that can
    not be pressed accidentally. The user has to slide to knob to the other side
    to toggle.
    */
    Item {
    id: slideswitch
    property alias on: button.on
    signal toggled(bool on)

    Rectangle {
        id: background
        property bool hover: false
        color: "#2d2d2d"
        border.width: 4
        border.color: "white"
        radius: 8
        width: parent.width
        height: parent.height
    
        anchors.fill: parent
    }
    
    Rectangle {
        id: button
        property bool on: false
    
        height: background.height - 2*background.border.width
        width: (background.width / 2)-10
        color: button.on ? "grey" : "#2d2d2d"
        border.width: background.border.width
        border.color: "white"
        radius: 4
        x:background.border.width
        y:background.border.width
    
        Text
        {
            id: label
            anchors.fill: parent
            text: button.on ? "DSP" : "ARM"
            font.family: "OpenSymbol"
            font.pixelSize: 27
            font.bold: true
            color: button.on ? "#2d2d2d" : "grey"
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment:  Text.AlignVCenter
        }
    
        MouseArea {
            id: bla
            anchors.fill: parent
            drag.target: parent
            drag.axis: Drag.XAxis
            drag.minimumX: background.border.width
            drag.maximumX: background.width - button.width - background.border.width
    
            onReleased: {
                console.log("Greatings from below. ButtonX: "+button.x+"drag.max: "+drag.maximumX)
    
                if(button.x > ((drag.maximumX) / 2)) {
                    slideswitch.state = ""
                    slideswitch.state = "on"
                    toggled(true)
                }
                else {
                    slideswitch.state = ""
                    slideswitch.state = "off"
                    toggled(false)
                }
            }
        }
    }
    
    // using states to differentiate between "on" and "off"
    states: [
        State {
            name: "on"
            PropertyChanges {
                target: button
                x: background.width - button.width - background.border.width
                on: true
            }
        },
        State {
            name: "off"
            PropertyChanges {
                target: button
                x: background.border.width
                on: false
            }
        }
    ]
    
    transitions: Transition {
        NumberAnimation {
            properties: "x"
            duration: 400
            easing.type: Easing.OutQuad
        }
    }
    

    }@


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.