Question

我有一个QML ListView，其中委托从另一个文件加载它的组件。单击委托项时，我想更新ListView。 CurrentIndex和highlight所选项目。

当我明确设置id的{{1}}时，它可以正常工作。但是，由于我还希望将代理人ListView也用于其他Component，我还是想找到一种如何从代理中访问ListView的通用方法ListView.currentIndex。

以下是代码：

main.qml

Component

Contact.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{}
    }
}

非常感谢任何帮助！

Answer 1

这里有两个问题：

您需要使用其所访问项目的名称来限定ListView附加的媒体资源。
currentIndex属性为a property of the ListView item type，而非attached property object。

要修复它们，请先更改：

ListView.currentIndex = index;

到此：

delegate.ListView.view.currentIndex = index;

然后给你的代表id：

Component {
    id: contact

    Rectangle {
        id: delegate
    // ...
}

文档的Example Usage部分（部分）证明了这一点：

ListView将许多属性附加到委托的根项目，例如ListView：isCurrentItem。在以下示例中，根委托项可以直接以ListView.isCurrentItem的形式访问此附加属性，而子contactInfo对象必须将此属性称为wrapper.ListView.isCurrentItem。

Answer 2

使用附加属性ListView.view：

此附加属性包含管理此委托的视图实例

小例子：

import QtQuick 2.4
import QtQuick.Window 2.2
import QtQuick.Layouts 1.1

Window {
    width: 600
    height: 400
    visible: true

    Component {
        id: listDelegate
        Rectangle {
            height: 30
            width: parent.width
            color:  ListView.isCurrentItem ? "orange" : "white"
            property var view: ListView.view
            property int itemIndex: index
            Text { anchors.centerIn: parent; text: name }
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    view.currentIndex = itemIndex;
                }
            }
        }
    }

    RowLayout {
        anchors.fill: parent
        ListView {
            Layout.minimumWidth: parent.width / 2
            Layout.fillHeight: true
            model: ListModel {
                ListElement {name: "item1.1"}
                ListElement {name: "item1.2"}
                ListElement {name: "item1.3"}
            }
            delegate: listDelegate
        }
        ListView {
            Layout.minimumWidth: parent.width / 2
            Layout.fillHeight: true
            model: ListModel {
                ListElement {name: "item2.1"}
                ListElement {name: "item2.2"}
                ListElement {name: "item2.3"}
            }
            delegate: listDelegate
        }
    }
}

从Delegate访问Listview currentIndex

2 个答案: