标题的「数据」可以是：
类的对象、类的属性、类的方法、信号，或者就是单纯的某个值。

QML 与 C++ 通过 QQmlContext 通讯。

一般传输数据时机是：QQmlEngine 构造好了，但没有加载任何 qml 文档之前。

单纯一个值

  1. QQmlApplicationEngine engine;
  2. engine.rootContext()->setContextProperty("cppVal", 50);
  4. // QML
  5. title: cppVal

类的对象和类的方法

类的方法必须是以下两种之一：

  • Q_INVOKABLE 标记的 public 函数
  • public 槽函数

C++ 函数的参数中的 QObject* 类型，相当于 QML 中的对象 id 或引用对象的 var 值。
C++ 函数的返回值也会转换成对应的 js 类型。

  1. public:
  2.     Q_INVOKABLE int cppFunc(int a, int b);
  4. CppData cd;
  5. engine.rootContext()->setContextProperty("cppObj", &cd);
  7. //QML
  8. title: cppObj.cppFunc(4, 8)

类的信号

在 QML 中，可以通过 Connections 对象来接收 C++ 的信号
C++ 定义的信号的参数名（val），QML 可以直接用

可以看到，QML 想调用类的方法或者接收类的信号，都是要传一个类的对象给 QML .

  1. // C++
  2. signals:
  3.     void cppSignal(int val);
  5. int CppData::cppFunc(int a, int b)
  6. {
  7.     emit cppSignal(88);
  8.     return a + b;
  9. }
  11. // QML
  12. Connections {
  13.   target: cppObj
  14.     onCppSignal: {
  15.       console.log(val);
  16.     }
  17. }
  19. Component.onCompleted: {
  20.     cppObj.cppFunc(4, 9)
  21.     win.show()
  22.   }

还有一种方法在 QML 中接收 C++ 的信号：
把 C++ 的类注册到元对象系统，这时这个类就相当于一个组件，在组件内使用 onSignal 来处理。

类的属性

类的属性可以分三种：基本类型如 int，对象类型如 Persion，列表类型

由于 QList 不是 QObject 的派生类，强大的元对象系统鞭长莫及。应该使用 QQmlListProperty 替代。

基本类型

  1. // 法一（较繁琐）
  2. Q_PROPERTY(QString qmlName READ name WRITE setName NOTIFY nameChanged)
  4. signals:
  5.     void nameChanged();
  7. public:
  8.     QString name() const;
  9.     void setName(const QString &name);
  11. private:
  12.     QString m_name;
  14. // 法二（简洁）
  15. Q_PROPERTY(QString qmlName MEMBER m_name NOTIFY nameChanged)
  17. signals:
  18.     void nameChanged();
  19. private:
  20.     QString m_name

对象类型

  1. class Compose : public QObject
  2. {
  3.     Q_OBJECT
  4.     Q_PROPERTY(int qmlAttr MEMBER attr)
  5. public:
  6.     explicit Compose(QObject *parent=nullptr): QObject(parent){}
  7. private:
  8.     int attr;
  9. };
  11. class CppData : public QObject
  12. {
  13.     Q_OBJECT
  14.     Q_PROPERTY(Compose *qmlCompose MEMBER compose)
  15. public:
  16.     explicit CppData(QObject *parent = nullptr) : QObject(parent)
  17.     {
  18.         compose = new Compose(this);
  19.     }
  21. private:
  22.     Compose *compose;
  23. };
  25. // main.cpp
  26. qmlRegisterType<Compose>("ZZ", 1, 0, "A");
  27. qmlRegisterType<CppData>("ZZ", 1, 0, "B");
  29. // QML
  30. import ZZ 1.0
  31. B {
  32.     id: b
  33.     qmlCompose: A {
  34.         qmlAttr: 56
  35.     }
  36. }
  38. B {
  39.     id: bb
  40.     qmlCompose{        // 分组属性，生命周期由父对象控制
  41.         qmlAttr: 57
  42.     }
  43. }
  45. Component.onCompleted: {
  46.     console.log(b.qmlCompose.qmlAttr)
  47. }

列表类型

一般情况下数据都是从 cpp 中获取，所以这里只讨论使用 cpp 作为数据模型的情况。
可以粗略分为三种：

QStringList
  1. //C++
  2. QStringList aa;
  3. aa << "aaaaa" << "bbbb" << "ccccc";
  4. engine.rootContext()->setContextProperty("aa", QVariant::fromValue(aa));
  6. //QML
  7. delegate: Text{text:modelData}    // 或者 model.modelData

QList
  1. // C++
  2. Q_PROPERTY(QString data MEMBER m_data NOTIFY dataChanged)
  3. Q_PROPERTY(int number MEMBER m_number NOTIFY numberChanged)
  5. QList<QObject*> ls;
  6. ls.append(new Name("aaa", 1));
  7. ls.append(new Name("bbb", 2));
  8. ls.append(new Name("ccc", 3));
  9. engine.rootContext()->setContextProperty("ls", QVariant::fromValue(ls));
  11. // QML
  12. delegate: Text {text: model.modelData.data + ": " + number}

继承 QAbstractListModel

还是先来说说使用 QML作为数据模型的情况，关键是了解 role 概念：

  1.   ListModel {
  2.       id: fruitModel
  4.       ListElement {
  5.           name: "Apple"     // 这是一个 role, 不是属性
  6.           cost: 2.45        // 这又是一个 role
  7.       }
  8.       ListElement {
  9.           name: "Orange"
  10.           cost: 3.25
  11.       }
  12.   }
  14. ListView {
  15.     anchors.fill: parent
  16.     model: fruitModel
  17.       delegate: Row {
  18.         Text { text: "Fruit: " + name }            // 在 delegate 中访问 role 的两种方式
  19.         Text { text: "Cost: $" + model.cost }
  20.       }
  21. }

在 QAbstractListModel 的基类 QAbstractItemModel 有一个 public 的虚函数：

  1. // 定义一堆 role
  2. enum AbstractListRoles{
  3.     NameRole=Qt::UserRole+1,
  4.     ColorRole,
  5.     NumberRole
  6.   };
  8. // 给每个 role 起个名称，方便 qml 中使用
  9. QHash<int, QByteArray> QAbstractItemModel::roleNames() const
  10. {
  11.     QHash<int,QByteArray> roles;
  12.     roles.insert(AbstractListRoles::NameRole,"myname");
  13.     roles.insert(AbstractListRoles::ColorRole,"mycolor");
  14.     roles.insert(AbstractListRoles::NumberRole,"mynumber");
  15.     return roles;
  16. }

维护 QList 列表，实现 data、rowcount 方法

  1. private:
  2.     QList<AbstractList> m_abstractList;     //抽象列表类容器
  4. int AbstractListModel::rowCount(const QModelIndex &parent) const
  5. {
  6.     Q_UNUSED(parent);
  7.     return m_abstractList.count();
  8. }
  10. QVariant AbstractListModel::data(const QModelIndex &index, int role) const
  11. {
  12.   if(index.row()<0||index.row()>=m_abstractList.count())
  13.       return QVariant();
  14.   const AbstractList &abstractList=m_abstractList[index.row()];
  15.   if(role==AbstractListRoles::NameRole)
  16.       return abstractList.name();
  17.   else if(role==AbstractListRoles::ColorRole)
  18.       return abstractList.color();
  19.   else if(role==AbstractListRoles::NumberRole)
  20.           return abstractList.number();
  21.   return QVariant();
  22. }

参考文档：
https://blog.csdn.net/qq_35173114/article/details/80873842