首页 > 代码库 > QML中使用C++类的实现
QML中使用C++类的实现
之前用Qt写过串口的小软件。STM32 IAP工具 和 用qt写的一个简单到不能在简单的上位机 。后来接触了QML,觉得传统的那种界面太那个了,写样式也麻烦。所以很早就想过用QML来为串口上位机做界面。无奈没搞懂QML到底是如何去调用C++的。百度了一堆文章,多半是翻译官方的例子。不知所云。直到最近在csdn上看到一篇文章 Qt Quick 之 QML 与 C++ 混合编程详解 ,终于有点懂了。不过,文章似乎有点长了。博客园上面也有见过,有朋友写过类似的文章。今天,总算实现了QML访问一个自定义类中的属性。故写下这篇文章。
例子很简单,main.qml访问stringt类中的一个属性并显示其内容:m_String
注意:Qt版本 5.4.0 | Creater版本 3.3.0
首先创建一个新的 Qt Quick Application-->选择controls 1.3。选择带controls的,生成的main.qml的根是ApplicationWindow 而另一种则是Window,其他的看起来没什么区别。具体要查文档咯
项目中有个MainForm.ui.qml。把他删掉。然后修改main.qml文件。
1 ApplicationWindow {2 title: qsTr("Hello World")3 width: 6404 height: 4805 visible: true //显示窗口6 7 8 }
然后创建一个stringt类继承QObject。如果想要让一个类可以被qml访问。这个类必须是继承QObject或其派生类。
使用宏Q_PROPERTY可以让方法被moc感知。stringt类的代码如下
1 #ifndef STRINGT_H 2 #define STRINGT_H 3 4 #include <QObject> 5 6 class stringt : public QObject 7 { 8 Q_OBJECT 9 Q_PROPERTY(QString Ttext READ Ttext WRITE setTtext)10 public:11 explicit stringt(QObject *parent = 0);12 ~stringt();13 14 QString Ttext(void) const;15 void setTtext(const QString str);16 signals:17 18 public slots:19 20 private:21 QString m_String;22 };23 24 #endif // STRINGT_H
上边是头文件,接下来是源文件
1 #include "stringt.h" 2 3 stringt::stringt(QObject *parent) 4 : QObject(parent) 5 , m_String("Text just") 6 { 7 8 } 9 10 stringt::~stringt()11 {12 13 }14 15 QString stringt::Ttext() const16 {17 return m_String;18 }19 20 void stringt::setTtext(const QString str)21 {22 m_String = str;23 }
接着就是main文件里面,注册这个类就可以了,用qmlRegisterType这个函数
1 #include <QApplication> 2 #include <QQmlApplicationEngine> 3 #include <QtQml> 4 #include "stringt.h" 5 6 int main(int argc, char *argv[]) 7 { 8 QApplication app(argc, argv); 9 10 qmlRegisterType<stringt>("m.stringT", 1, 0, "StringT");11 //要导入的类 包名 主版本号 次版本号 元素名12 QQmlApplicationEngine engine;13 engine.load(QUrl(QStringLiteral("qrc:/main.qml")));14 15 return app.exec();16 }
最后就是QML文件了。这里定义了两个矩形。点击左边的矩形后,右边的矩形会改变颜色和文本。
1 import QtQuick 2.4 2 import QtQuick.Controls 1.3 3 import QtQuick.Window 2.2 4 import QtQuick.Dialogs 1.2 5 import m.stringT 1.0 //导入类 6 7 ApplicationWindow { 8 title: qsTr("Hello World") 9 width: 64010 height: 48011 visible: true12 13 StringT{ //创建一个元素14 id: stringT15 }16 17 Rectangle {18 id: rect119 x: 12; y: 1220 width: 60; height: 6021 color: "lightsteelblue"22 MouseArea {23 id: rect1_area24 anchors.fill: parent25 onClicked:26 {27 rect2.color = "lightgreen"28 rect2_text.text = stringT.Ttext29 }30 }31 }32 33 Rectangle {34 id: rect235 x: rect1.x + rect1.width + 1036 y: rect1.y37 width: rect1.width; height: rect1.height38 border.color: "lightsteelblue"39 border.width: 340 radius: 341 Text {42 id: rect2_text43 text: qsTr("Hello")44 font.pixelSize: 1245 anchors.centerIn: parent46 }47 }48 }
效果大概是这样的。
QML中使用C++类的实现