Can't Get Mousearea in Delegate of Listview To Work



  • I've been trying to get a mousearea to work in a listview delegate, but have had no success. I've put together a simple QML example built entirely in the designer, except for the addition of the mousearea to the delegate. From everything I've read on these forums and elsewhere, this should work. While the simple mousearea on the left returns a message to the console, the mousearea within the delegate does not.

    Any thoughts? What am I missing?

    BTW, this is under QtQuick 2.0.

    Also, changing the delegate from an "Item" to a "Rectangle" makes no difference. I've also tried an Item or Rectangle inside a Component without luck.

    Thanks,

    George

    @import QtQuick 2.0

    Rectangle {
    id: rectangle2
    width: 360
    height: 360

    Rectangle {
        id: rectangle1
        width: 99
        height: 360
        color: "#ffffff"
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.top: parent.top
        anchors.topMargin: 0
        anchors.left: parent.left
        anchors.leftMargin: 0
    
        MouseArea {
            id: mousearea1
            anchors.fill: parent
            onClicked: {
                console.debug("rect click")
            }
        }
    }
    
    Rectangle {
        id: rectangle3
        x: 99
        y: 0
        width: 261
        height: 360
        color: "#ffffff"
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.top: parent.top
        anchors.topMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
    
        ListView {
            id: list_view1
            anchors.fill: parent
            delegate: Item {
                x: 5
                height: 40
                Row {
                    id: row1
                    spacing: 10
                    Rectangle {
                        width: 40
                        height: 40
                        color: colorCode
                    }
    
                    Text {
                        text: name
                        anchors.verticalCenter: parent.verticalCenter
                        font.bold: true
                    }
                }
                MouseArea {
                    id: mousearea2
                    anchors.fill: parent
                    onClicked: {
                        console.debug("list click")
                    }
                }
            }
            model: ListModel {
                ListElement {
                    name: "Grey"
                    colorCode: "grey"
                }
    
                ListElement {
                    name: "Red"
                    colorCode: "red"
                }
    
                ListElement {
                    name: "Blue"
                    colorCode: "blue"
                }
    
                ListElement {
                    name: "Green"
                    colorCode: "green"
                }
            }
        }
    }
    

    }
    @



  • The width of your Item and correspondingly of your MouseArea is 0.

    Change line 48 to

    height: 40; width: list_view1.width

    and it should work.



  • OK, I'll just go over in this corner and hide.

    How could I have been so stupid??!!

    Thanks! ;-)


Log in to reply
 

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