1

有人可以向我解释一下我在以下设置中做错了什么。

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

页面.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);
                }
            }
        }
    }
}

引擎.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。由于某些奇怪的原因,更新模型上的选定属性实际上并没有更新模型。为什么会这样?

4

1 回答 1

0

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

这意味着您不需要在对象中包含selected变量。RoleEngine.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"
}
于 2014-08-23T08:36:20.827 回答