在 GridView 的委托顶部绘制突出显示组件

Question

我试图强制在 GridView 中当前 selected 项目上绘制突出显示项目，但没有成功。这是我的 QML：

import QtQuick 2.0

GridView {
    id: gridView
    width: 140
    height: 140
    cellHeight: 70
    cellWidth: 70

    highlight: Rectangle {
        color: "red"
        z: 1
    }

    delegate: Item {
        id: itemId

        width:  GridView.view.cellWidth
        height: GridView.view.cellHeight

        Text {
            id: textId
            text: "1234"
        }

        MouseArea {
            anchors.fill: parent
            onClicked: itemId.GridView.view.currentIndex = index
        }
    }

    model: 100
}

我希望将高亮组件的 z 设置为 1 可以完成这项工作，但没有按预期工作。如果我 select 项目在 window 打开后立即显示，我的高亮会覆盖它们，但是当我开始滚动时，select 显示下面的项目，高亮不再位于顶部。我该如何解决？

Answer 1

GridView 委托中 z 的默认值为 1 (link)。不知道为什么不能指定属性 z: 0 （然后它总是回到默认值）当可以设置除 0 以外的任何其他值时。但是你可以在突出显示中指定 z: 2 属性，或在委托的 onCompleted 处理程序中将默认值 z 覆盖为 0：

Component.onCompleted: {
    z = 0;
}

在 GridView 的委托顶部绘制突出显示组件

drawing highlight component on top of delegate in GridView

qt

qml

qt5

qtquick2