qt 中调用QML

来源：互联网发布：中国建筑业知乎编辑：程序博客网时间：2024/05/21 17:25

在QML中包含了很少的Element，因为够少，够简单，所以学起来很容易。在QML里面没有像Qt GUI程序里面类似QPushButton，QCheckBox之类标准控件。QML把我们能在屏幕上看到的内容（文字和图片）都浓缩为了Rectangle，Image和Text等等的几个简单元素，并通过一个稍微抽象点的MouseArea（鼠标区域）来响应我们的鼠标事件，通过Keys来响应我们的键盘输入。加上QML之间可以相互引用，这使得我们能通过非常简单的几个Rectangle做出非常精美的程序界面。
在QML中有几个非常好的特性，可以提高我们的写好一个漂亮界面的效率。这几个特性主要是下面几个：
1. 用于排版布局的Anchor系统，可以非常容易的实现动态布局；
anchor的说明如下图所示：

2. 状态机，可以非常方便的让程序在不同状态下做出相应相应；
3. 属性绑定，也是犀利的东西；
4. 动画元素非常多，使用QML的动画元素，你可以通过几句非常简单的代码，做出花哨的动画。
5. ……
虽然，QML很强大，但是现在还在成长期，在很多地方也存在不足。比如，我们现在应该还没办法使用MouseArea来捕获鼠标滚轮事件，至少我现在还没有找到比较简单的方法来实现。Image也不能显示内存中的二进制数据的图片，以及我们无法关闭Image的缓存机制。并且我们不能屏蔽WebView右键菜单，我们不能捕获到WebView的链接点击事件。以上所说的不足应该说是因为QML给我们提供的Element太简单造成的。虽然说可以通过C++来写QML的Element来解决相应的问题，但是毕竟比较麻烦，而且过于局限。
毕竟，QML相关技术是Qt主推的东西，也是趋势，所以我认为还是有必要学习她。

// main.h

#include <QApplication>
#include <QDeclarativeView>
#include <QDeclarativeContext>
// main.cpp
class Stopwatch : public QObject
{
Q_OBJECT
public:
Stopwatch();
Q_INVOKABLE bool isRunning() const;
public slots:
void start();
void stop();
private:
bool m_running;
};

复制代码

main.cpp

int main(int argc, char *argv[])
{
QApplication app(argc, argv);
QDeclarativeView view;
view.rootContext()->setContextProperty("stopwatch",
new Stopwatch);
view.setSource(QUrl::fromLocalFile("main.qml"));//qt调用qml
//view.setSource(QUrl("qrc:/main.qml"));
view.show();
return app.exec();
}

复制代码

// main.qml

import Qt 4.7
Rectangle {
width: 300
height: 300
radius: 20
Text {
id: helloText
text: "ImageView"
x: 80
y: 5
anchors.horizontalCenter: page.horizontalCenter
font.pointSize: 24; font.bold: true
}
MouseArea {
id: mouseArea; anchors.fill: parent
onClicked: {
if (stopwatch.isRunning())//qml调用c++方法
{
stopwatch.stop() ;
helloText.color = "black";
}
else
{
stopwatch.start();//qml调用c++方法
helloText.color = "red";
}
}
}
}