文章目錄

• QML和C++混合編程 （一）
• • 簡介 ：
  • Chapter 1: Creating a New Type

QML和C++混合編程 （一）

簡介 ：

本教程介紹在C++應用程序中擴展使用QML。著重介紹了QML的核心特性：如屬性、信號和槽。還有通過插件來銷毀這些擴展。

翻譯來自Qt的官方的英文教程。

Qt QML 提供了一些API，使得可以通過C++進行擴展。你可以自行書寫這些擴展，來增加到你自己的QML類型中。簡而言之，QML的類型可以通過C++進行擴展。

該部分的內容可詳細參考《Integrating QML and C++》，該文檔下的兩片子目錄，你可能會更喜歡：
1、 Exposing Attributes of C++ Classes to QML
2、Defining QML Types from C++.

教程一的運行效果如下：

下面介紹如何來創建一個QML的新類型。

Chapter 1: Creating a New Type

通常我們會遇到這樣的一個任務：
擴展一個QML的新類型，而且該類型支持自定義的操作函數。
例如，該類型用來操作一些特殊的數據模型，或者自定義的圖像類型，或者系統操作類型如網絡通信的操作。

我們先從創建一個簡單的類型，名為“PieChart”開始吧。該類型包含兩個屬性： 名稱（name）、顏色（color）我們將該類型指定一個命名空間稱為“Chart”, 且版本號定義為v1.0。具體代碼定義如下： import Charts 1.0PieChart {width: 100; height: 100name: "A simple pie chart"color: "red"}

我們需要定義一個C++類來概括這個PieChart類型以及該類型的兩個屬性。因為QML的擴展需要用到Qt的Meta Object System，所以我們需要：
1、繼承QObject
2、通過Q_PROPERTY marco 來聲明該屬性。

這里我們在piechart.h 中定義

#include <QtQuick/QQuickPaintedItem>#include <QColor>class PieChart : public QQuickPaintedItem{Q_OBJECTQ_PROPERTY(QString name READ name WRITE setName)Q_PROPERTY(QColor color READ color WRITE setColor)public:PieChart(QQuickItem *parent = 0);QString name() const;void setName(const QString &name);QColor color() const;void setColor(const QColor &color);void paint(QPainter *painter);private:QString m_name;QColor m_color;};

該類型繼承了QQuickPaintedItem ，因為我們需要重載該QQuickPaintedItem ：:paint()。如果類型僅僅是為了數據處理，而不是圖形。那么可以簡單的繼承自QObject.如果我們僅僅是為了擴展QObject-based 類的功能函數，納悶我們繼承QObject就可以了。如果我們需要創建一個可視圖形項，但是該可視圖形項不需要自定義，那么我們可以繼承自QQuickItem.

在piechart.cpp中簡單的實現了 m_name 和m_color 的屬性值，然后重寫了paint()函數來繪制pie 圖形。而且關閉了 QGraphicsItem::ItemHasNoContents 的標志來使能繪制圖形。

PieChart::PieChart(QQuickItem *parent): QQuickPaintedItem(parent){}...void PieChart::paint(QPainter *painter){QPen pen(m_color, 2);painter->setPen(pen);painter->setRenderHints(QPainter::Antialiasing, true);painter->drawPie(boundingRect().adjusted(1, 1, -1, -1), 90 * 16, 290 * 16);}

這樣我們就定義好了PieChart 類。我們可以通過QML來使用它。文件app.qml創建了PieChart圖形項來顯示：

import Charts 1.0import QtQuick 2.0Item {width: 300; height: 200PieChart {id: aPieChartanchors.centerIn: parentwidth: 100; height: 100name: "A simple pie chart"color: "red"}Text {anchors { bottom: parent.bottom; horizontalCenter: parent.horizontalCenter; bottomMargin: 20 }text: aPieChart.name}}

注意到盡管color 的定義是一個字符串，它是自動通過QColor 對象來設定的。

我們需要創建C++應用程序，通過QQuickView來運行和顯示app.qml，該應用程序需要使用qmlRegisterType() 函數來注冊PieChart類型，這樣是為了有權允許使用QML的類型。

main.cpp 函數如下：

#include "piechart.h"#include <QtQuick/QQuickView>#include <QGuiApplication>int main(int argc, char *argv[]){QGuiApplication app(argc, argv);qmlRegisterType<PieChart>("Charts", 1, 0, "PieChart");QQuickView view;view.setResizeMode(QQuickView::SizeRootObjectToView);view.setSource(QUrl("qrc:///app.qml"));view.show();return app.exec();}

最后，我們來書寫工程文件.pro 來關聯相關文件和庫

QT += qml quickHEADERS += piechart.hSOURCES += piechart.cpp \main.cppRESOURCES += chapter1-basics.qrcDESTPATH = $$[QT_INSTALL_EXAMPLES]/qml/tutorials/extending-qml/chapter1-basicstarget.path = $$DESTPATHqml.files = *.qmlqml.path = $$DESTPATHINSTALLS += target qml

本篇翻譯子Qt官方教程
tutorials/extending-qml/chapter1-basics/

總結

以上是生活随笔為你收集整理的QML和C++混合编程--（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。