Qt渲染漫談（一）

最近在看一些關於遊戲引擎的東西，原本是有幾個遊戲的小點子，其實實現起來還挺麻煩的，想找個遊戲引擎看看能不能碼起來。展轉以後發現了不少2D引擎，其中國產的要數cocos2dx用的好像是比較普遍，可是好多人對此褒貶不一。因而下了準備試試到底怎麼樣，無奈搞了一早上，也有點小成果，可是想實現起來貌似還得花點功夫，想一想仍是找其餘的算了。正好以前用過Qt，因而從新撿起來。

 

在Qt上想要渲染性能好點，我想仍是得用OpenGL這一類東西的，以前一直對OpenGL這類東西不是很清楚，因而研究了很多時間。我想不少人對這個什麼顯示服務器，OpenGL等等這些東西也是雲裏霧裏的，先來聊聊這些東西，豐富一下知識。

一、關於顯示服務器，最近看的最多的就是Ubuntu17.10把默認顯示服務器改爲了wayland這個東西。根據個人理解，有了顯示服務器，咱們才能夠用窗口系統，顯示服務器的客戶端就是窗口系統，顯示服務器爲咱們的窗口系統提供畫面繪製，輸入事件等功能，至於輸入事件，常見的就是鼠標鍵盤事件了。

二、而後就是OpenGL，OpenGL是一個跨平臺的圖形接口，OpenGL是和顯卡有關係的，只有顯卡提供支持，才能夠用OpenGL的，固然OpenGL是和顯卡廠商有協商的。有了OpenGL，咱們就能夠用顯卡來處理關於圖形圖像的東西，而後交給顯示服務器進行顯示。

三、可是這邊有個問題須要注意，就是OpenGL不能直接和顯示服務器進行通訊，也就是說咱們用OpenGL處理的圖形圖像是不能直接給顯示服務器的，這中間得有一個東西來進行處理，這個中間件根據平臺，windows上叫作wgl，linux上叫作glx，macos上是agl。好了，如今咱們就能夠用窗口來顯示OpenGL處理的圖形了，也就是咱們常說的用OpenGL來進行渲染。

四、以後爲了將wgl，glx，agl這些東西統一塊兒來，實現平臺統一，就誕生了glfw，glu等東西，這些東西封裝了wgl，glx，agl而且結合了各平臺的顯示服務器來建立窗口，可讓咱們用一套代碼來實現跨平臺使用OpenGL在窗口中進行渲染。

五、而後問題又來了，由於OpenGL在各個操做系統上的接口有的不一致，若是在不一樣平臺上編譯可能不相互兼容，讓人用着不爽。因而又誕生了glew和glad這類東西來實現各個操做系統OpenGL接口的統一，結合上面提到的，就能夠實現全面的跨平臺了，是否是很爽。

 

如今咱們知道了，至少要作到上面的前3點，才能夠用GPU加速渲染，咱們再來看看這些東西的應用，其實無非就是各類引擎和圖形庫，好比：

一、Cocos2dx直接使用了第4點的glfw，加上OpenGL實現了UI和繪圖等等東西，變成一套遊戲引擎。

二、Qt就比較牛了，他本身實現了第四、5兩點，因此實現了跨平臺。 可是沒有獨立出來，因此我們也不能用。

 

可是Qt不都是用OpenGL渲染的，Qt中的顯示分爲三類，QWidget，QGraphics，QQuick。

一、QWidget這一類中，基本上控件的實現都是對各個平臺上的對應的控件的封裝。QWidget中使用QWindow來建立窗口，而單獨的QWindow內是不能使用系統插件的，只提供窗口，因此理論上QWindow中是能夠直接用OpenGL來進行繪圖的。Qt爲了之後的發展和2D，3D繪圖性能的提高以應對遊戲等開發需求，在Qt5.0之後將QWidget系的東西從gui模塊中單獨抽出來做爲widgets模塊，這也在情理之中。

二、Qt爲了提高針對大量簡單組件的渲染性能，創造了QGraphics這一類東西，可是他們仍然是屬於widgets模塊的，也不必定是用OpenGL渲染，若是想用OpenGL渲染，是須要在QWidget和OpenGL搭一個橋樑，這就是QGLWidget。

三、QQuick這一類東西是正真使用OpenGL來進行渲染的，並且還提供了多線程渲染支持，Qt爲了方便使用，只提供了qml的接口，暴露出的也就QQuickItem這一個用於自定義控件的類。實際中，在類unix的環境下，QQuick中全部控件也是提供C++接口來實現編程的，只是Qt文檔中沒有，也沒有對應的Qt模塊，須要本身包含頭文件。這類頭文件都是Qt私有的，頭文件格式基本都是*_p.h。而且還要連接QtQuick相關的QtQuickTemplate2和QtQuickControls2庫。好比下面是在mac下的一段直接用QQuick C++的控件使用。

 1 #include <QGuiApplication>
 2 #include <QQmlApplicationEngine>
 3 
 4 #include <QQuickView>
 5 #include <QQuickItem>
 6 #include <QObject>
 7 
 8 #include "QtQuick/private/qquickimage_p.h"
 9 #include "QtQuick/private/qquickrectangle_p.h"
10 #include "QtQuickTemplates2/private/qquickbutton_p.h"
11 #include "QtQuickTemplates2/private/qquicklabel_p.h"
12 
13 int main(int argc, char *argv[])
14 {
15     QGuiApplication app(argc, argv);
16 
17     QQuickView view;
18     view.resize(600, 800);
19 
20     QQuickItem* parentItem = view.contentItem();
21 
22     QQuickImage* imgItem = new QQuickImage(parentItem);
23     imgItem->setSource(QUrl::fromLocalFile("/Users/Bearyin/Pictures/P30429-143922.jpg"));
24     imgItem->setSize(QSizeF(600, 800));
25 
26 
27     QObject::connect(&view, &QQuickView::widthChanged, [&](int){
28         imgItem->setSize(view.size());
29     });
30 
31     QObject::connect(&view, &QQuickView::heightChanged, [&](int){
32         imgItem->setSize(view.size());
33     });
34 
35 
36     QQuickRectangle* rectItem = new QQuickRectangle;
37     rectItem->setSize(QSizeF(100, 100));
38     rectItem->setColor(QColor(255, 255, 0));
39 
40     QQuickLabel* labelItem = new QQuickLabel;
41     labelItem->setText("Hello World");
42     labelItem->setColor(QColor(255, 0, 0));
43 //    labelItem->setPosition(QPointF(200, 200));
44     labelItem->setSize(QSize(100, 100));
45     labelItem->setBackground(rectItem);
46 
47 
48     QQuickButton* btItem = new QQuickButton(parentItem);
49     btItem->setSize(QSizeF(100, 100));
50     btItem->setPosition(QPointF(0, 0));
51     btItem->setBackground(labelItem);
52     btItem->setText("Hello World");
53 
54 
55     QObject::connect(btItem, &QQuickButton::clicked, [&](){
56         rectItem->setColor(QColor(0, 255, 0));
57     });
58 
59     view.show();
60 
61 
62     return app.exec();
63 }

View Code

這是pro文件：

 1 QT += quick
 2 CONFIG += c++11
 3 
 4 QT_PRIVATE += core-private gui-private qml-private quick-private
 5 
 6 DEFINES += QT_DEPRECATED_WARNINGS
 7 
 8 SOURCES += main.cpp
 9 
10 qnx: target.path = /tmp/$${TARGET}/bin
11 else: unix:!android: target.path = /opt/$${TARGET}/bin
12 !isEmpty(target.path): INSTALLS += target
13 
14 
15 INCLUDEPATH += \
16 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtQuick.framework/Versions/5/Headers/5.9.2/QtQuick \
17 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtQuickTemplates2.framework/Versions/5/Headers/5.9.2/QtQuickTemplates2 \
18 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtQml.framework/Versions/5/Headers/5.9.2 \
19 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtCore.framework/Versions/5/Headers/5.9.2 \
20 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtGui.framework/Versions/5/Headers/5.9.2 \
21 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtQuick.framework/Versions/5/Headers/5.9.2 \
22 /Users/Bearyin/Software/Qt5.9.2/5.9.2/clang_64/lib/QtQuickTemplates2.framework/Versions/5/Headers/5.9.2
23 
24 LIBS += -framework QtQuickTemplates2

View Code

 我這邊的運行結果大概是這樣的，裏面圖片等路徑自行修改一下：

  

 

2017年12月20日更

這篇到如今時間很長了，這段時間由於各類緣由，不少東西都落下了，最近晚上一直在看源碼，對QtQuick這部分的機制，包括渲染方式等有了必定的瞭解。以前說把QtQuick剝離出來的，看來也是比較困難的，可是從某種意義上也是能夠實現的，就是可能時間比較長罷了。可能這段時間真的有點感受本身老了點，因此把以前最後一段刪了，仍是給本身減輕點壓力吧，估計還能夠多活幾年，KeKe~，開玩笑的了。

日後應該時間會比較充裕一點，能夠多瞭解一點它內部的代碼和機制，並分享出來。另外感受這標題不太好，順便改了。