qt - 从委托(delegate)访问 ListView currentIndex

Question

我有一个 QML ListView，其中委托(delegate)从另一个文件加载其组件。单击委托(delegate)项目时，我想更新 ListView。 CurrentIndex 并突出显示所选项目。

当我显式设置 ListView 的 id 时，它起作用了。但是，由于我想将委托(delegate)的 Component 也用于其他 ListView ，所以我很难找到一种访问 ListView.currentIndex 的通用方法> 来自委托(delegate) Component 内。

这是代码:

ma​​in.qml

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Window 2.2
import QtQuick.Dialogs 1.2

ApplicationWindow {
    title: qsTr("Hello World")
    width: 640
    height: 480
    visible: true

    ListModel {
        id: contactsModel
        ListElement {
            name: "Bill Smith"
        }
        ListElement {
            name: "John Brown"
        }
        ListElement {
            name: "Sam Wise"
        }
    }

    ListView{
        id: contactsView
        anchors.left: parent.left
        anchors.top: parent.top
        width: parent.width
        height: parent.height
        orientation: Qt.Vertical
        spacing: 10
        model: contactsModel
        delegate: Contact{}
    }
}

Contact.qml(委托(delegate)使用的组件)

import QtQuick 2.0

Component{
    id: contact
    Rectangle{
        width: 200
        height: 50
        color: ListView.isCurrentItem ? "#003366" : "#585858"
        border.color: "gray"
        border.width: 1

        MouseArea{
            anchors.fill: parent
            onClicked: {
                ListView.currentIndex = index; // <---- does not work
                //  contactsView.currentIndex = index; // <---- Works
            }
        }

        Text{
            anchors.centerIn: parent
            color: "white"
            text: name
        }
    }
}

非常感谢任何帮助!

Answer 1

这里有两个问题:

• 您需要使用访问它们的项目名称来限定 ListView 的附加属性。
• currentIndex 属性为 a property of the ListView item type ，而不是attached property object .

要解决这两个问题，请首先更改此内容:

ListView.currentIndex = index;

对此:

delegate.ListView.view.currentIndex = index;

然后为您的委托(delegate)提供一个 id:

Component {
    id: contact

    Rectangle {
        id: delegate
    // ...
}

Example Usage(部分)证明了这一点文档部分:

ListView attaches a number of properties to the root item of the delegate, for example ListView:isCurrentItem. In the following example, the root delegate item can access this attached property directly as ListView.isCurrentItem, while the child contactInfo object must refer to this property as wrapper.ListView.isCurrentItem.