Qt/Qt Quick 概述
< Qt
Qt Quick 包含一个名为 QML 的建模语言，用于构建图形用户界面。
在使用 Qt Creator 创建新的 Qt Quick 2 应用程序时，会添加默认的 QML 窗口。
它描述了一个显示 Hello World 的窗口，单击该窗口时会关闭。
import QtQuick 2.0
Rectangle {
width: 360
height: 360
Text {
text: qsTr("Hello World")
anchors.centerIn: parent
}
MouseArea {
anchors.fill: parent
onClicked: {
Qt.quit();
}
}
}
- Rectangle 有 5 个主要属性：border.color, border.width, color, gradient 和 radius；它们定义了矩形的形状和颜色。
- Text 显示 Hello World。
- MouseArea 在单击时退出应用程序。
- anchors 语句是 Item 类型的部分，它被其他可视类型（如 Rectangle 和 Text）继承。
window.qml:
此文件描述了一个包含以编程方式定义的三角形的窗口。Triangle 项目在 Shapes 库（版本 1.0）中定义。
import QtQuick 2.0
import Shapes 1.0
Item {
width: 400; height: 300
onWidthChanged: console.log("Width change: ", width)
Triangle {
anchors.top: parent.top;
anchors.left: parent.left;
anchors.right: parent.right;
height : parent.height /2
}
}
application.qrc:
此文件定义应用程序使用的资源；这里 window.qml 被添加到 gui 命名空间中。
<RCC>
<qresource prefix="/gui">
<file>window.qml</file>
</qresource>
</RCC>
main.cpp:
这是应用程序启动的地方。它包含 triangle.h 文件中定义的 TriangleItem：它通过函数 qmlRegisterType 在 Shapes 库中注册为 Triangle，版本为 1.0。
主窗口从 gui/window.qml 模板开始。
#include "triangle.h"
#include <QGuiApplication>
#include <QtQuick/QQuickView>
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
qmlRegisterType<TriangleItem>("Shapes", 1, 0, "Triangle");
QQuickView view;
// resize items when resizing window
view.setResizeMode(QQuickView::SizeRootObjectToView);
view.setSource(QUrl("qrc:///gui/window.qml"));
view.show();
return app.exec();
}
triangle.h:
三角形项目由几何形状（包含 3 个点）和材质（红色）组成。
红色三角形在 updatePaintNode 函数中绘制。
#ifndef TRIANGLE_H
#define TRIANGLE_H
#include <QQuickItem>
#include <QSGGeometry>
#include <QSGFlatColorMaterial>
class TriangleItem: public QQuickItem
{
Q_OBJECT
public:
TriangleItem(QQuickItem* parent = 0);
protected:
QSGNode* updatePaintNode(QSGNode*, UpdatePaintNodeData*);
private:
QSGGeometry m_geometry;
QSGFlatColorMaterial m_material;
};
#endif // TRIANGLE_H
triangle.cpp:
材质设置为 Qt::red 颜色。三角形顶点使用窗口边界（来自 boundingRect() 函数）定义。
然后将材质和几何形状分配给新的几何节点，该节点被添加到场景节点（QSGNode* n）中。
#include "triangle.h"
#include <QQuickWindow>
#include <QSGGeometryNode>
TriangleItem::TriangleItem(QQuickItem *parent):
QQuickItem(parent),
m_geometry(QSGGeometry::defaultAttributes_Point2D(), 3)
{
setFlag(ItemHasContents);
m_material.setColor(Qt::red);
}
QSGNode* TriangleItem::updatePaintNode(QSGNode* n, UpdatePaintNodeData*)
{
if (!n)
n = new QSGNode;
QSGGeometryNode* geomnode = new QSGGeometryNode();
QSGGeometry::Point2D* v = m_geometry.vertexDataAsPoint2D();
const QRectF rect = boundingRect();
v[0].x = rect.left();
v[0].y = rect.bottom();
v[1].x = rect.left() + rect.width()/2;
v[1].y = rect.top();
v[2].x = rect.right();
v[2].y = rect.bottom();
geomnode->setGeometry(&m_geometry);
geomnode->setMaterial(&m_material);
n->appendChildNode(geomnode);
return n;
}
application.pro:
这是 Qt 用于构建我们的小应用程序的项目定义文件。
QT += qml quick
TARGET = example
TEMPLATE = app
SOURCES += main.cpp \
triangle.cpp
HEADERS += \
triangle.h
RESOURCES += application.qrc
使用以下命令构建并运行应用程序
qmake
make
./example