Qt渲染漫談（一）
最近在看一些關(guān)于游戲引擎的東西，本來是有幾個(gè)游戲的小點(diǎn)子，其實(shí)實(shí)現(xiàn)起來還挺麻煩的，想找個(gè)游戲引擎看看能不能碼起來。輾轉(zhuǎn)之后發(fā)現(xiàn)了很多2D引擎，其中國產(chǎn)的要數(shù)cocos2dx用的好像是比較廣泛，但是好多人對(duì)此褒貶不一。于是下了準(zhǔn)備試試到底怎么樣，無奈搞了一早上，也有點(diǎn)小成果，但是想實(shí)現(xiàn)起來貌似還得花點(diǎn)功夫，想想還是找其他的算了。正好之前用過Qt，于是重新?lián)炱饋怼?/p>
在Qt上想要渲染性能好點(diǎn)，我想還是得用OpenGL這一類東西的，之前一直對(duì)OpenGL這類東西不是很清楚，于是研究了不少時(shí)間。我想很多人對(duì)這個(gè)什么顯示服務(wù)器，OpenGL等等這些東西也是云里霧里的，先來聊聊這些東西，豐富一下知識(shí)。
1、關(guān)于顯示服務(wù)器，最近看的最多的就是Ubuntu17.10把默認(rèn)顯示服務(wù)器改成了wayland這個(gè)東西。根據(jù)我的理解，有了顯示服務(wù)器，我們才可以用窗口系統(tǒng)，顯示服務(wù)器的客戶端就是窗口系統(tǒng)，顯示服務(wù)器為我們的窗口系統(tǒng)提供畫面繪制，輸入事件等功能，至于輸入事件，常見的就是鼠標(biāo)鍵盤事件了。
2、然后就是OpenGL，OpenGL是一個(gè)跨平臺(tái)的圖形接口，OpenGL是和顯卡有關(guān)系的，只有顯卡提供支持，才可以用OpenGL的，當(dāng)然OpenGL是和顯卡廠商有協(xié)商的。有了OpenGL，我們就可以用顯卡來處理關(guān)于圖形圖像的東西，然后交給顯示服務(wù)器進(jìn)行顯示。
3、但是這邊有個(gè)問題需要注意，就是OpenGL不能直接和顯示服務(wù)器進(jìn)行通信，也就是說我們用OpenGL處理的圖形圖像是不能直接給顯示服務(wù)器的，這中間得有一個(gè)東西來進(jìn)行處理，這個(gè)中間件根據(jù)平臺(tái)，windows上叫做wgl，linux上叫做glx，macos上是agl。好了，現(xiàn)在我們就可以用窗口來顯示OpenGL處理的圖形了，也就是我們常說的用OpenGL來進(jìn)行渲染。
4、之后為了將wgl，glx，agl這些東西統(tǒng)一起來，實(shí)現(xiàn)平臺(tái)統(tǒng)一，就誕生了glfw，glu等東西，這些東西封裝了wgl，glx，agl并且結(jié)合了各平臺(tái)的顯示服務(wù)器來創(chuàng)建窗口，可以讓我們用一套代碼來實(shí)現(xiàn)跨平臺(tái)使用OpenGL在窗口中進(jìn)行渲染。
5、然后問題又來了，因?yàn)镺penGL在各個(gè)操作系統(tǒng)上的接口有的不一致，如果在不同平臺(tái)上編譯可能不相互兼容，讓人用著不爽。于是又誕生了glew和glad這類東西來實(shí)現(xiàn)各個(gè)操作系統(tǒng)OpenGL接口的統(tǒng)一，結(jié)合上面提到的，就可以實(shí)現(xiàn)全面的跨平臺(tái)了，是不是很爽。
現(xiàn)在我們知道了，至少要做到上面的前3點(diǎn)，才可以用GPU加速渲染，我們?cè)賮砜纯催@些東西的應(yīng)用，其實(shí)無非就是各種引擎和圖形庫，比如：
1、Cocos2dx直接使用了第4點(diǎn)的glfw，加上OpenGL實(shí)現(xiàn)了UI和繪圖等等東西，變成一套游戲引擎。
2、Qt就比較牛了，他自己實(shí)現(xiàn)了第4、5兩點(diǎn)，所以實(shí)現(xiàn)了跨平臺(tái)。 但是沒有獨(dú)立出來，所以咱們也不能用。
但是Qt不都是用OpenGL渲染的，Qt中的顯示分為三類，QWidget，QGraphics，QQuick。
1、QWidget這一類中，基本上控件的實(shí)現(xiàn)都是對(duì)各個(gè)平臺(tái)上的對(duì)應(yīng)的控件的封裝。QWidget中使用QWindow來創(chuàng)建窗口，而單獨(dú)的QWindow內(nèi)是不能使用系統(tǒng)插件的，只提供窗口，所以理論上QWindow中是可以直接用OpenGL來進(jìn)行繪圖的。Qt為了以后的發(fā)展和2D，3D繪圖性能的提升以應(yīng)對(duì)游戲等開發(fā)需求，在Qt5.0以后將QWidget系的東西從gui模塊中單獨(dú)抽出來作為widgets模塊，這也在情理之中。
2、Qt為了提升針對(duì)大量簡(jiǎn)單組件的渲染性能，創(chuàng)造了QGraphics這一類東西，但是他們?nèi)匀皇菍儆趙idgets模塊的，也不一定是用OpenGL渲染，如果想用OpenGL渲染，是需要在QWidget和OpenGL搭一個(gè)橋梁，這就是QGLWidget。
3、QQuick這一類東西是正真使用OpenGL來進(jìn)行渲染的，而且還提供了多線程渲染支持，Qt為了方便使用，只提供了qml的接口，暴露出的也就QQuickItem這一個(gè)用于自定義控件的類。實(shí)際中，在類unix的環(huán)境下，QQuick中所有控件也是提供C++接口來實(shí)現(xiàn)編程的，只是Qt文檔中沒有，也沒有對(duì)應(yīng)的Qt模塊，需要自己包含頭文件。這類頭文件都是Qt私有的，頭文件格式基本都是*_p.h。并且還要鏈接QtQuick相關(guān)的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 }
這是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
我這邊的運(yùn)行結(jié)果大概是這樣的，里面圖片等路徑自行修改一下：
2017年12月20日更
這篇到現(xiàn)在時(shí)間很長(zhǎng)了，這段時(shí)間因?yàn)楦鞣N原因，很多東西都落下了，最近晚上一直在看源碼，對(duì)QtQuick這部分的機(jī)制，包括渲染方式等有了一定的了解。之前說把QtQuick剝離出來的，看來也是比較困難的，但是從某種意義上也是可以實(shí)現(xiàn)的，就是可能時(shí)間比較長(zhǎng)罷了。可能這段時(shí)間真的有點(diǎn)感覺自己老了點(diǎn)，所以把之前最后一段刪了，還是給自己減輕點(diǎn)壓力吧，估計(jì)還可以多活幾年，KeKe~，開玩笑的了。
往后應(yīng)該時(shí)間會(huì)比較充裕一點(diǎn)，可以多了解一點(diǎn)它內(nèi)部的代碼和機(jī)制，并分享出來。另外感覺這標(biāo)題不太好，順便改了。
浙公網(wǎng)安備 33010602011771號(hào)