中心QML ListView突出显示的项目

Question

在图片中Test,Test 1并Test 2在ListView.在这种情况下,Test元素突出显示.如何修改视图行为以确保当前(突出显示的)项始终位于列表的中间？我希望实现的目标如下图所示:

Answer 1

你只需要highlightRangeMode以preferredHighlightBegin和preferredHighlightEnd.从文档:

滚动列表时,这些属性会影响当前项的位置.例如,如果当滚动视图时当前所选项目应保留在列表的中间,请将preferredHighlightBegin和preferredHighlightEnd值设置为中间项目所在位置的顶部和底部坐标.如果以编程方式更改currentItem,列表将自动滚动,以便当前项位于视图的中间.此外,无论是否存在突出显示,都将发生当前项索引的行为.

以下是水平的完整示例,ListView当前项目位于中心.

import QtQuick 2.4
import QtQuick.Window 2.2

Window {
    width: 300
    height: 150
    visible: true

    ListView {
        anchors.fill: parent
        spacing: 5

        model: 20

        delegate:
            Rectangle {
            width: 30
            color: ListView.view.currentIndex === index ? "red" : "steelblue"

            height: ListView.view.height
            Text {
                anchors.centerIn: parent
                text: index
                font.pixelSize: 20
            }
        }

        orientation: Qt.Horizontal
        preferredHighlightBegin: 150 - 15
        preferredHighlightEnd: 150 + 15
        highlightRangeMode: ListView.StrictlyEnforceRange
    }
}