QML(14)——QML与C++交互方式总结1/3（qml调用C++的public函数）

一、效果

qml文件中，可以调用C++类的公共函数

 

 

 

二、步骤

1、C++类文件

创建C++文件时，一定要勾选下面3项

 

MyQmlClass.h

 

#ifndef MYQMLCLASS_H

#define MYQMLCLASS_H

 

#include <QObject>

 

class MyQmlClass : public QObject {

  Q_OBJECT

  

 public:

  explicit MyQmlClass(QObject *parent = nullptr);

 

  // 【函数前加上Q_INVOKABLE】

  Q_INVOKABLE void setValue(int value);

  Q_INVOKABLE int getValue();

 

 private:

  int m_Value;

  

};

 

#endif  // MYQMLCLASS_H

 

MyQmlClass.cpp

 

 

#include "myqmlclass.h"

#include <QDebug>

 

MyQmlClass::MyQmlClass(QObject *parent)

    : QObject(parent), m_Value(0){}

 

void MyQmlClass::setValue(int value) { m_Value = value; }

 

int MyQmlClass::getValue() {

  qDebug() << "MyQmlClass::getValue";

  return m_Value;

}

 

 

 

 

2、注册

注册有两种方式

方式1:  engine.rootContext()->setContextProperty("myQml", &myQmlImp);

main.cpp

 

 

#include <QGuiApplication>

#include <QQmlApplicationEngine>

#include <QQmlContext>

#include "myqmlclass.h"

 

int main(int argc, char *argv[]) {

#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)

  QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

#endif

 

  QGuiApplication app(argc, argv);

 

  QQmlApplicationEngine engine;

 

  //【 方式1：创建一个C++对象，注册给qml使用 】

  MyQmlClass myQmlImp;

  engine.rootContext()->setContextProperty("myQml", &myQmlImp);

 

 

  const QUrl url(QStringLiteral("qrc:/main.qml"));

  QObject::connect(

      &engine, &QQmlApplicationEngine::objectCreated, &app,

      [url](QObject *obj, const QUrl &objUrl) {

        if (!obj && url == objUrl) QCoreApplication::exit(-1);

      },

      Qt::QueuedConnection);

  engine.load(url);

 

  return app.exec();

}

方式2：qmlRegisterType<MyQmlClass>("MyClass.module", 1, 0, "MyQml");

main.cpp

 

 

#include <QGuiApplication>

#include <QQmlApplicationEngine>

#include <QQmlContext>

 

#include "myqmlclass.h"

 

int main(int argc, char *argv[]) {

#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)

  QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

#endif

 

  QGuiApplication app(argc, argv);

 

  QQmlApplicationEngine engine;

  

  //【方式2: 把整个C++类注册到qml，作为qml的一个组件对象】

  qmlRegisterType<MyQmlClass>("MyClass.module", 1, 0, "MyQml");

 

  const QUrl url(QStringLiteral("qrc:/main.qml"));

  QObject::connect(

      &engine, &QQmlApplicationEngine::objectCreated, &app,

      [url](QObject *obj, const QUrl &objUrl) {

        if (!obj && url == objUrl) QCoreApplication::exit(-1);

      },

      Qt::QueuedConnection);

  engine.load(url);

 

  return app.exec();

}

 

 

3、qml中使用

3.1

如果注册时使用方式1，qml中可以直接使用 注册名.function(）

使用这种方式时，IDE不会自动提示相关关键字，但是完成后运行实现了效果。

Register01.qml

 

import QtQuick 2.0

import QtQuick.Controls 2.15

 

Item {

 

    Column {

        anchors.centerIn: parent

        spacing: 10

 

        Label {

            id: title

            width: 200

            height: 50

            font.pixelSize: 20

            // Column中元素尺寸一定要固定，否则对齐也会失效！

            horizontalAlignment: Text.AlignHCenter

            verticalAlignment: Text.AlignVCenter

            text: "方式一"

        }

 

        Label {

            id: getLabel

            width: 200

            height: 50

            verticalAlignment: Text.AlignVCenter

            text: "label"

        }

        Button {

            id: getBtn

            width: 200

            height: 50

            text: "get"

            onClicked: {

                //【方式1 调用】

                getLabel.text = myQml.getValue()

            }

        }

 

        TextField {

            id: setLabel

            width: 200

            height: 50

            placeholderText: "enter value"

        }

 

        Button {

            id: setBtn

            width: getBtn.width

            height: getBtn.height

            text: "set"

            onClicked: {

                //【方式1 调用】

                myQml.setValue(setLabel.text)

            }

        }

    }

}

main.qml

 

import QtQuick 2.15

import QtQuick.Window 2.15

import QtQuick.Controls 2.15

 

Window {

    width: 640

    height: 480

    visible: true

    title: qsTr("Hello World")

 

    Loader {

        id: contentPane

        anchors.fill: parent

    }

 

    Component.onCompleted: contentPane.source = "qrc:/Register01.qml"

}

3.2

如果注册时使用方式2，使用C++类就像QML 的组件一样，需要导库，创建，调用

import QtQuick 2.0

import QtQuick.Controls 2.15

// 【方式2 导入库】

import MyClass.module 1.0

 

Item {

 

    // 【方式2 创建对象】

    MyQml {

        id: myQmlObj

    }

    Column {

        anchors.centerIn: parent

        spacing: 10

 

        Label {

            id: title

            width: 200

            height: 50

            font.pixelSize: 20

            // Column中元素尺寸一定要固定，否则对齐也会失效！

            horizontalAlignment: Text.AlignHCenter

            verticalAlignment: Text.AlignVCenter

            text: "方式二"

        }

 

        Label {

            id: getLabel

            width: 200

            height: 50

            verticalAlignment: Text.AlignVCenter

            text: "label"

        }

 

        Button {

            id: getBtn

            width: 200

            height: 50

            text: "get"

            onClicked: {

                // 【方式2 使用id名调用】

                getLabel.text = myQmlObj.getValue()

            }

        }

 

        TextField {

            id: setLabel

            width: getLabel.width

            height: getLabel.height

            placeholderText: "enter value"

        }

 

        Button {

            id: setBtn

            width: getBtn.width

            height: getBtn.height

            text: "set"

            onClicked: {

                myQmlObj.setValue(setLabel.text)

            }

        }

    }

}

main.qml

 

import QtQuick 2.15

import QtQuick.Window 2.15

import QtQuick.Controls 2.15

 

Window {

    width: 640

    height: 480

    visible: true

    title: qsTr("Hello World")

 

    Loader {

        id: contentPane

        anchors.fill: parent

    }

 

    Component.onCompleted: contentPane.source = "qrc:/Register01.qml"

}

 

https://blog.csdn.net/wangpailiulanqi8/article/details/124625817