时间戳

首页 > 解决方案 > 从字符串向量创建 ListView/ListModel

qt - 从字符串向量创建 ListView/ListModel

问题描述

序幕

QAbstractListModel可能是一个解决方案，但我认为这对我来说有点矫枉过正......不确定

介绍

我正在 C++ 中创建一个向量，以便可以从 QML 中访问：

class MyClass : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QVector<QString> items READ items WRITE setItems NOTIFY itemsChanged)
    // ...
}

正如我所测试的，我可以从 QML 中访问我的向量：

console.log("myClass.items >>> ", myClass.items) // Logs vector of strings

问题

在我的 QML UI 上，我打算显示向量内的字符串列表。我尝试使用ListModel，ListView但我不知道该怎么做。有人可以帮忙吗？

    ListModel {
        id: myListModel
        // How to compose my model here according to vector of strings
        // i.e. myClass.items
    }

    ListView {
        model: myListModel
        delegate: {
            // ... show the strings inside the vector
        }
    }

更新

正如@Amfasis 和@mohabouje 所建议的那样，我像这样修改了我的代码，但由于某种原因它不起作用。

C++ 方面：

class MyClass : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QStringList items READ items WRITE setItems NOTIFY itemsChanged)
    //...
}

QML 方面：

            Row {
                ListView {
                    id: items
                    model: myClass.items // Directly connect to C++ string list
                    delegate: Text {
                        text: modelData // Strings are NOT displayed on QML UI
                                        // Log of modelData shows it is empty
                    }
                }
            }

在 QML 上我登录myClass.items并看到我的字符串列表：

console.log("myClass.items >>> ", myClass.items)
// logs:
// qml: myClass.items >>>  [item 0,item 1,item 2]

终于修复了

设置或修改项目时，我需要emit修改信号，否则它将不起作用：

m_items = /* set items here */;
emit itemsChanged(m_items); // This is required!

标签： qtqml

解决方案

您应该向 QML 引擎公开您的类接口。在这种情况下，您可以将 your 替换QVector<QString>为QStringList.

class MyModel: public QObject {
    Q_OBJECT
    Q_PROPERTY(QStringList model READ model NOTIFY modelChanged)
    ...
};

如果您查看文档：

没有命名角色的模型（例如下面显示的 ListModel）将具有通过 modelData 角色提供的数据。还为只有一个角色的模型提供了 modelData 角色。在这种情况下，modelData 角色包含与命名角色相同的数据。

因此，您应该使用该属性modelData：

ListView {
  model: mymodel.model
  delegate: Text {
     text: modelData
  }
}

要公开您的 C++ 类，请查看此页面。

推荐阅读