qt - 滚动后标题覆盖的 ListView 项目

问题描述

我正在尝试使用带有简单标题的 ListView，该标题位于列表顶部。它在大多数情况下都可以正常工作。当我手动滚动到顶部时，顶部项目位于标题下方：

当我从列表外部设置当前索引以突出显示一个项目时，列表滚动到突出显示的项目。这是预期和期望的行为。然而，列表以某种方式滚动，突出显示的项目将与标题处于相同的高度 (y)。因此，标题部分覆盖了该项目。在图片中，标题是透明的，高亮是浅绿色的：

如何设置列表以使列表内容始终从标题下方开始？或者作为一种解决方法，如何在选择自动滚动后设置当前项目的高度？为了完整起见，这里是我列表的当前代码。

ListView {
    id: particleList
    anchors.fill: parent
    model: particleModel
    clip: true
    highlight: Rectangle { color: Material.color(Material.Green); opacity: 0.2}
    highlightMoveDuration: Style.animationDurationMedium
    headerPositioning: ListView.OverlayHeader
    header: Item {
        height: 40
        anchors.left: parent.left
        anchors.right: parent.right
        Row {
            anchors.fill: parent
            MediumText {
                horizontalAlignment: Text.AlignHCenter
                width: parent.width / 3
                text: qsTr("Width")
            }
            MediumText {
                horizontalAlignment: Text.AlignHCenter
                width: parent.width / 3
                text: qsTr("Height")
            }
            MediumText {
                horizontalAlignment: Text.AlignHCenter
                width: parent.width / 3
                text: qsTr("Area")
            }
        }
    }
    footer: SmallText {
        anchors.left: parent.left
        anchors.right: parent.right
        text: particleModel.count
    }

    populate: Transition {
        NumberAnimation { properties: "x,y"; duration: 1000 }
    }

    delegate: Item {
        height: 40
        anchors.left: parent.left
        anchors.right: parent.right

        Row {
            anchors.fill: parent
            MediumText {
                anchors.verticalCenter: parent.verticalCenter
                width: parent.width / 3
                text: model.width
                horizontalAlignment: Text.AlignRight
                rightPadding: 20
            }
            MediumText {
                anchors.verticalCenter: parent.verticalCenter
                width: parent.width / 3
                text: model.height
                horizontalAlignment: Text.AlignRight
                rightPadding: 20
            }
            MediumText {
                anchors.verticalCenter: parent.verticalCenter
                width: parent.width / 3
                text: model.area
                horizontalAlignment: Text.AlignRight
                rightPadding: 20
            }
        }
        Rectangle {
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: parent.top
            height: 1
            visible: model.index !== 0
            color: Material.color(Material.Grey)
        }
    }
}

标签： qtqmlqt5qtquick2

qt - 滚动后标题覆盖的 ListView 项目

问题描述

解决方案

推荐阅读