Problem with MouseArea in delegate

sk2212

This is also working for me:

            GridView {
                id: grid
                clip:true
                anchors.fill: parent
                cellWidth: Units.dp(80)
                cellHeight: Units.dp(80)
                interactive: false

                delegate: Rectangle {
                    id: rect
                    width: grid.cellWidth - Units.dp(5)
                    height: grid.cellHeight - Units.dp(5)
                    color: backcolor

                    MouseArea {
                        hoverEnabled: true
                        anchors.fill: parent
                        onPressed: {
                            console.log("pressed")
                        }
                        onReleased: {
                            console.log("released")
                        }
                        onEntered: {
                            console.log("entered");
                        }
                    }
             }


                Component.onCompleted: {
                    for(var i=0;i<36;i++) {
                        grid.model.append({backcolor: "#E0E0E0"});
                    }
                }

                model: ListModel {

                }
   }

nnnnn

@p3c0

Thanks for your answer!

Unfortunately, this did not solve my problem. With an additional MouseArea (as parent of the GridLayout) I can capture the Released-events (form the outer MouseArea), the Pressed-event (from the inner MouseAreas), however I do not see any Entered-events anymore :-(

p3c0

@nnnnn That's strange. Is there any other component present apart from the code that you posted earlier ?

nnnnn

@sk2212

I tried your example here - I do not get entered-Events when I move the mouse pointer around while the button is pressed; same problem as in my code.

Once again my scenario - to avoid misunderstandings:
Go to a cell, press the button, keep button pressed, move the pointer to other cells, release the button.
In this case, I would like a pressed-event from the first cell, entered-events from all others, and a released-event from the last one. Seems to be tricky...

Cheers

nnnnn

@p3c0

Hi!

Here is a complete example (which is unfortunately not doing what I want). Anything wrong here?

import QtQuick 2.4
import QtQuick.Window 2.2
import QtQuick.Layouts 1.1

Window {
    visible: true
    color: "black"

    MouseArea {
        id: outer
        anchors.fill: parent

        onReleased: {
            console.log("outer - onReleased")
        }

        GridLayout {
            id: fieldGrid
            anchors.fill:parent
            rows: 2
            columns: 2

            Repeater {
                id: repeater
                model: myModel

                Rectangle {
                    id: del
                    Layout.column: col
                    Layout.row: row
                    Layout.fillWidth: true
                    Layout.fillHeight: true

                    Text {
                        anchors.centerIn: parent
                        text: name
                    }

                    MouseArea {
                        id: inner
                        anchors.fill: parent
                        hoverEnabled: true

                        onPressed: {
                            console.log("inner - onPressed")
                            mouse.accepted = false;
                        }
                        onEntered: {
                            console.log("inner - onEntered")
                        }
                    }
                }
            }
        }
    }

    ListModel {
        id: myModel

        ListElement { row: 0; col: 0; name: "a"}
        ListElement { row: 0; col: 1; name: "b"}
        ListElement { row: 1; col: 0; name: "c"}
        ListElement { row: 1; col: 1; name: "d"}
    }
}

p3c0

@nnnnn This too works on my system. I'm using Qt 5.5 on Ubuntu.

nnnnn

Really? You get Entered-events while you keep the mouse button pressed?

Ok, I will check with Qt 5.5 here, I wanted to update anyway. Thanks for your help, I will post how things are going...

nnnnn

Hmm, it's not working for me under Qt5.5/Kubuntu 14.04 either. No entered-Events when I move the mouse around while pressing the mouse button.

sk2212

@nnnnn

Ah...got your point. The events are not triggered when you press a button, hold this button and move to another button. THAN the events for the "new" entered button are not triggered.

I did not know a solution so far...

nnnnn

I really find no solution for this using MouseArea. My only hope now is that I can find a workaround using a MultiPointTouchArea, but maybe this is something completely different (have to check to documentation first...)

nnnnn

I have a simple solution now, using only one MouseArea on top and looking for onPositionChanged. I don't think it is very beautifuly (I have to call childAt() all the time), but at least it is working.

import QtQuick 2.4
import QtQuick.Window 2.2
import QtQuick.Layouts 1.1

Window {
    visible: true
    color: "black"

    GridLayout {
        id: fieldGrid
        anchors.fill: parent
        rows: 2
        columns: 2

        Repeater {
            id: repeater
            model: myModel

            Rectangle {
                id: del
                Layout.column: col
                Layout.row: row
                Layout.fillWidth: true
                Layout.fillHeight: true

                Text {
                    anchors.centerIn: parent
                    text: name
                }
            }
        }
    }

    MouseArea {
        anchors.fill: parent
        property point pos: Qt.point(-1, -1)

        onPressed: {
            var obj = fieldGrid.childAt(mouse.x, mouse.y)
            if ( !obj )
                return;

            console.log("onPressed")
            pos = Qt.point(obj.Layout.row, obj.Layout.column)
            console.log("newField: " +  pos)
        }
        onReleased: {
            console.log("onReleased")
        }

        onPositionChanged: {
            var obj = fieldGrid.childAt(mouse.x, mouse.y)
            if ( !obj )
                return;

            var newPos = Qt.point(obj.Layout.row, obj.Layout.column)
            if ( newPos === pos )
                return;

            console.log("newField: " +  newPos)
            pos = newPos;
        }
    }

    ListModel {
        id: myModel

        ListElement {row: 0; col: 0; name: "a" }
        ListElement {row: 0; col: 1; name: "b" }
        ListElement {row: 1; col: 0; name: "c" }
        ListElement {row: 1; col: 1; name: "d" }
    }
}

p3c0

@nnnnn Hmm. I overlooked your onEntered requirement. It doesnot work in my example. The problem is that once you set mouse.accepted=false the release event is not trapped.