Question

有人可以通过以下设置向我解释我的错误。

我们的想法是在engine.js中开发游戏引擎，UI逻辑在qml文件中。

page.qml

Page {
    id: page
    SilicaGridView {
        id: listView
        model: ListModel {
            id: roleList
            Component.onCompleted: {
                Engine.addRoles(roleList);
            }
        }

        delegate: Rectangle {
            id: delegate
            border.color: model.selected ? Theme.highlightColor : Theme.primaryColor

            Label {
                text: qsTr(model.name)
            }
            MouseArea {
                anchors.fill: parent;
                onClicked: {
                    Engine.selectRole(model);
                }
            }
        }
    }
}

的engine.js：

function Role() {
    this.name = "role"
    this.selected = false;
}

function addRoles(list) {
    list.append(new Role());
    list.append(new Role());
}

function selectRole(role) {
    console.log(role.selected) // <-- false
    role.selected = true;
    console.log(role.selected) // <-- false
}

所以当我点击页面上的一个元素时，它会从引擎中调用selectRole。出于某些奇怪的原因，更新模型上的选定属性实际上并不会更新模型。为什么会这样？

Answer 1

Qt Quick中的视图已经有一种跟踪所选项目的方法：

这意味着您的selected个对象中不需要Role个变量。 Engine.js变为：

function Role() {
    this.name = "role"
}

function addRoles(list) {
    list.append(new Role());
    list.append(new Role());
}

你的QML代码没有运行（如果你提供一个工作示例，这确实很有帮助），所以我冒昧地让它运行：

import QtQuick 2.3
import QtQuick.Controls 1.1

import "Engine.js" as Engine

ApplicationWindow {
    width: 500
    height: 500

    ListView {
        id: listView
        width: 100
        height: 100
        anchors.centerIn: parent

        model: ListModel {
            id: roleList
            Component.onCompleted: {
                Engine.addRoles(roleList);
            }
        }

        delegate: Rectangle {
            id: delegateItem
            border.color: ListView.isCurrentItem ? "red" : "black"
            width: listView.width
            height: 30

            Label {
                id: label
                text: qsTr(model.name)
                anchors.centerIn: parent
            }
            MouseArea {
                anchors.fill: parent;
                onClicked: {
                    listView.currentIndex = index;
                    print(index, delegateItem.ListView.isCurrentItem)
                }
            }
        }
    }
}

注意使用ListView的附加属性isCurrentItem。这是一个方便的属性，相当于：

delegate: Rectangle {
    border.color: listView.currentIndex == index ? "red" : "black"
}

无法在QML javascript文件中编辑对象属性

1 个答案: