QML ListView在鼠标点击时无响应

Question

大家好，我尝试了几种方法，但无法使我的ListView响应鼠标点击。

以下是我的ListView代码:

 ListView {
         id: listview1
         x: 0
         y: 82
        // width: 574
        // height: 967
         width: window.width
         height: window.height
         visible: true
         keyNavigationWraps: false
         boundsBehavior: Flickable.DragAndOvershootBounds
         opacity: 1
         maximumFlickVelocity: 2500
         anchors.leftMargin: 0
         highlightMoveSpeed: 489
         contentWidth: 0
         preferredHighlightEnd: 2
         spacing: 5
         highlightRangeMode: ListView.NoHighlightRange
         snapMode: ListView.SnapToItem
         anchors.bottomMargin: 0
         anchors.rightMargin: 0
         anchors.topMargin: 82
              anchors.fill: parent
              model: myModel
              delegate:Component {
                  //id: contactDelegate
                  Item {
                      property variant myData: model
                      width: 574; height: 90
                      Column {
                          x: 12
                          y: 0
                          width: 562
                          height: 90
                          anchors.rightMargin: 0
                          anchors.bottomMargin: 0
                          anchors.leftMargin: 12
                          anchors.topMargin: 0
                          anchors.fill: parent
                          spacing: 2
                          Text { text: '<b>ID: </b> ' + id_korisnika ; verticalAlignment: Text.AlignTop; wrapMode: Text.NoWrap; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 }
                          Text { text: '<b>Ime: </b> ' + ime_korisnika ; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 }
                          Text { text: '<b>Prezime: </b> ' + prezime_korisnika; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 }
                          Text { height: 16; text: '<b>Broj telefona: </b> ' + broj_korisnika ; verticalAlignment: Text.AlignVCenter; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 }
                          Text { text: '<b>Adresa: </b> ' + adresa_korisnika ; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 }

                          MouseArea {
                              id: mouse_area1
                              z: 1
                              hoverEnabled: false
                              anchors.fill: parent
                          }
                      }
                      }
              }

              //delegate: contactDelegate
              highlight: Rectangle {color:"black"; radius: 5; opacity: 0.7

              }
              focus: true

          }

我尝试在所有区域放置我的代码，但是我无法使其工作。有任何建议都可以。

- user123_456

Answer 1

请查看QtCreator中的KeyInterction示例，其中有你要找的答案 :)
你可以按照以下方式查看代理样例：

ListViewDelegate:

Item {
    id: container
    width: ListView.view.width; height: 60; anchors.leftMargin: 10; anchors.rightMargin: 10

    Rectangle {
        id: content
        anchors.centerIn: parent; width: container.width - 40; height: container.height - 10
        color: "transparent"
        antialiasing: true
        radius: 10

        Rectangle { anchors.fill: parent; anchors.margins: 3; color: "#91AA9D"; antialiasing: true; radius: 8 }
    }

    Text {
        id: label
        anchors.centerIn: content
        text: "List element " + (index + 1)
        color: "#193441"
        font.pixelSize: 14
    }

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

        onClicked: {
            container.ListView.view.currentIndex = index
            container.forceActiveFocus()
        }
    }
}

关键是 MouseArea 部分。 祝好运 - S.M.Mousavi

- S.M.Mousavi

---

index 是从哪里来的？ - ManuelSchneid3r

这是一个委托。index 在委托中预定义。 - S.M.Mousavi

container 如何访问 ListView？尽管我的委托在一个单独的 QML 文件中，但我使用这个方法使我的 ListView 工作正常！ - zar

您可以使用ListView（例如ListView.view.width）从委托访问到ListView。 - S.M.Mousavi

Answer 2

我在您的MouseArea（mouse_area1）中没有看到onClicked处理程序代码。您是如何尝试捕获/响应鼠标单击的？

尝试以下代码，看看会发生什么。

MouseArea {
    id: mouse_area1
    z: 1
    hoverEnabled: false
    anchors.fill: parent

    onClicked:{
        console.log("test");
    }
}

- Kunal

---

这似乎是有效的，我该如何将这个高亮部分放入onclick处理程序中？ - user123_456

我不确定，但我认为你需要设置currentIndex。并且还需要设置highlightFollowsCurrentItem: true。 - Kunal

嘿，@user123_456，如果你没有得到正确和充分的信息，就不应该将响应标记为正确答案。我曾经遇到过同样的问题。经过多次研究，我找到了解决方案，并与您分享了我的响应帖子。请查看我的响应帖子。 - S.M.Mousavi

给下票者一个反馈，您可以评论一下为什么您会对我的答案进行投票否定吗？ - Kunal