Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

MouseArea prevents the parent scrolling to work properly



  • In a project using the Qt Quick Controls 2, I needed to create a tree view, which contains a resizable column header and several rows, as shown on the following screenshot:
    TreeView.png

    To achieve that, I used a TableView as a base, and implemented my own items by overriding the delegate property. Each row is an ItemDelegate, and contains some text, an image and 2 buttons on the end. I also need to open a popup menu while a right click is performed onto a row, and plan some advanced features, e.g the possibility to edit the text contained in a row. I also added a vertical scrollbar to the tree, and it should be scrolled using the default mouse gestures.

    To achieve that I added a MouseArea to my ItemDelegate, in the following manner:

    ItemDelegate
    {
        ...
    
        MouseArea
        {
            id: maItem
            visible: !m_Editing
            anchors.fill: parent
            hoverEnabled: true
            acceptedButtons: Qt.LeftButton | Qt.RightButton
            propagateComposedEvents: true
            //preventStealing: true
    
            onEntered:
            {
                // here comes the code to apply when mouse entered in the row
            }
    
            onExited:
            {
                // here comes the code to apply when mouse exited the row
            }
    
            onClicked:
            {
                // prevent the event to filter the mouse click, thus children buttons may also receive the click
                mouse.accepted = false
    
                // here comes the code to apply when the row is clicked
            }
        }
    
        ...
    }
    

    The above code works as I expected for my tree, except for one point: the mechanism which allows the tree to be scrolled by left clicking on an item and moving the mouse up or down is broken. When the MouseArea is active, I need to click twice on any item of my row to enable it. I can deactivate this behavior completely by setting the preventStealing: true property, this resolve the incoherence, however I want to keep this functionality.

    Is there a way to prevent the MouseArea to break the tree scroll behavior? What I'm doing wrong in the above code, and what should I modify to let the tree manage the scrolling, and in the same time adding a MouseArea to manage my row?

    NOTE I suspect that the key of this issue is the focus, am I pointing the good direction?



  • Finally I searched a while by myself, and I think I may answer my own question. Although I couldn't completely resolve my issue, I noticed that the answer is hidden in the other MouseArea events. For example, by handling the onPressed event and adding the mouse.accepted in several key locations, I could let the component take care of the scrolling when the left mouse button is pressed, whereas the right click opens a popup menu.

    My conclusion is that there is no ready-to-use way, i.e there is no parameter to activate in the MouseArea itself which may resolve this kind of issue, and the solution is a good balance between activating different parameters in the different functions.



  • Finally I searched a while by myself, and I think I may answer my own question. Although I couldn't completely resolve my issue, I noticed that the answer is hidden in the other MouseArea events. For example, by handling the onPressed event and adding the mouse.accepted in several key locations, I could let the component take care of the scrolling when the left mouse button is pressed, whereas the right click opens a popup menu.

    My conclusion is that there is no ready-to-use way, i.e there is no parameter to activate in the MouseArea itself which may resolve this kind of issue, and the solution is a good balance between activating different parameters in the different functions.