Quantcast
Channel: QtWebEngine
Viewing all articles
Browse latest Browse all 13965

qml-presentation-system and mouse interaction with a SlideSwitch

$
0
0
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         }     } }

Viewing all articles
Browse latest Browse all 13965

Trending Articles