Solved Prevent MouseArea's positionChanged signal to propagate in ScrollView
-
Hi!
I am trying to handle a positionChanged signal in a MouseArea (to create kind of a drag&drop effet) that is in a ScrollView.
My problem is that after the mouse travelled a short distance, the parent ScrollView seem's to get the focus (the scrollbar appears) and I stop to receive positionChanged signals.
The objective would be to receive the positionChanged signal (even if the mouse gets out of my MouseArea & over the ScrollView as long as my left mouse button stays pressed) without propagating the signal to the ScrollView.
My layout looks like this:
ColumnLayout { width: 300 height: 400 // some elements here ScrollView { Layout.fillWidth: true Layout.fillHeight: true clip: true Rectangle { width: 200 height: 20 MouseArea { anchors.fill: parent onPositionChanged: { console.log('mouse pressed & moved') } } } }
-
It appears that I suffered from a sever case of RTFM...
If anyone get the same behavior, just add
preventStealing: true
to yourMouseArea
-
Anyone's got an idea or a hint on something I could try ?
-
This post is deleted! -
Ok. I took the time to investigate a bit more.
I have 3 separate examples. This is a simple QML application that should be easy to run.
The two first examples work. The third does not work.What is "working":
- Press the mouse button down on the MouseArea
- Move the mouse around without releasing the button
- The message that logs coordinates should never stop printing, wherever you are on screen until you release the mouse button.
For the third example, I get logs until the mouse moves too much and all the updates stop.
- Only ScrollView (works)
import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Layouts 1.12 ApplicationWindow{ id: root visible: true width: 1200 height: 600 ScrollView { clip: true anchors.fill: parent MouseArea { width: 300 height: 300 onPositionChanged: { console.log('Moved', mouseX, mouseY) } } } }
- Only ColumnLayout (works)
import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Layouts 1.12 ApplicationWindow{ id: root visible: true width: 1200 height: 600 ColumnLayout { MouseArea { width: 300 height: 300 onPositionChanged: { console.log('Moved', mouseX, mouseY) } } } }
- ColumnLayout inside a ScrollView (does not work)
import QtQuick 2.12 import QtQuick.Controls 2.12 import QtQuick.Layouts 1.12 ApplicationWindow { id: root visible: true width: 1200 height: 600 ScrollView { clip: true anchors.fill: parent // note: It does not work for ColumnLayout, Column, Row or RowLayout. If I use a Item here, it works ColumnLayout { MouseArea { width: 300 height: 300 onPositionChanged: { console.log('Moved', mouseX, mouseY) } } } } }
You can find a video of the behavior here: https://i.imgur.com/rIlWnhu.mp4
- I press and release the mouse without moving: I get the pressed & released events correctly
- I press and move the mouse: I get the pressed event, the move event, then it stops. No more move or released events.
- I press and move the mouse without going too far from the position where I pressed the mouse: It works until I get too far
Note: I don't get any Released or Exited event, but thecontainsPressed
property is correctly updated (ie: when I no longer receive events, its value is false). This is the property that I use to display the "Mouse pressed" text.
Is this something I do wrong with the ScrollView/ColumnLayout combo or is this a Qt bug ?
-
It appears that I suffered from a sever case of RTFM...
If anyone get the same behavior, just add
preventStealing: true
to yourMouseArea
-
@ebatsin Thank you! You just saved my day!