環境：Windows Xp + Qt 4.8.4+QtCreator 2.6.2

三、場景（QGraphicsScene）

四、視圖（QGraphicsView）

（六）OpenGL渲染

QGraphicsScene提供了圖形視圖框架的場景，它有以下功能：

• 提供了一個管理大量圖形項的快速接口
• 向每個圖形項傳播事件
• 管理圖形項的狀態，比如選擇和焦點處理
• 提供無轉換的渲染功能，主要用於打印
  

我們新建空的Qt項目，項目名稱為graphicsView03，完成後添加main.cpp文件，更改其內容如下：

#include <QtGui>

int main(int argc,char* argv[ ])

{

   QApplication app(argc,argv);

   QGraphicsScene scene;

   scene.addText("Hello, world!");

   QGraphicsView view(&scene);

   view.show();

   return app.exec();

}

這裏使用addText()函數添加了一個文本圖形項。執行這條語句就相當於執行了下麵兩條語句：

QGraphicsTextItem*item = new QGraphicsTextItem("Hello, world!");

scene.addItem(item);

如果要刪除一個圖形項我們可以調用removeItem()函數，如：scene.removeItem(item);

一個場景分為三個層：圖形項層（ItemLayer）、前景層（ForegroundLayer）和背景層（BackgroundLayer）。場景的繪製總是從背景層開始，然後是圖形項層，最後是前景層。看下麵的例子：

scene.setForegroundBrush(QColor(255,255,255,100));

scene.setBackgroundBrush(Qt::green);

scene.setBackgroundBrush(QPixmap("../graphicsView03/yafeilinux.jpg"));

如果想進一步控製前景和背景層，我們可以重新實現drawForeground()函數和drawBackground()函數。

索引算法，是指在場景中進行圖形項查找的算法。QGraphicsScene中提供了兩種選擇，它們在一個枚舉變量QGraphicsScene::ItemIndexMethod中，分別是：

• QGraphicsSecne::BspTreeIndex ：應用Binary Space Partition tree，適合於大量的靜態圖形項。這個是默認值。
• QGraphicsScene::NoIndex ：不用索引，搜索場景中所有的圖形項，適合於經常進行圖形項的添加、移動和刪除等操作的情況。
  

我們可以使用setItemIndexMethod()函數進行索引算法的更改。

圖形項可以放到場景的任何位置，場景的大小默認是沒有限製的。而場景的邊界矩形僅用於場景內部進行索引的維護。因為如果沒有邊界矩形，場景就要搜索所有的圖形項，然後確定出其邊界，這是十分費時的。所以如果要操作一個較大的場景，我們應該給出它的邊界矩形。設置邊界矩形，可以使用setSceneRect()函數。

場景最大的優勢之一就是可以快速的鎖定圖形項的位置，即使有上百萬個圖形項，items()函數也能在數毫秒的時間內鎖定一個圖形項的位置。items()函數有幾個重載函數來方便的進行圖形項的查找。但是有時在場景的一個點可能重疊著幾個圖形項，這時我們可以使用itemAt()函數返回最上麵的一個圖形項。對於這些函數的使用，我們到後麵講視圖時再舉例講解。

QGraphicsView 提供了視圖窗口部件，它使場景的內容可視化。你可以給一個場景關聯多個視圖，從而給一個數據集提供多個視口。視圖部件是一個滾動區域，就是說，它可以提供一個滾動條來顯示大型的場景。如果要使用OpenGL，你可以使用QGraphicsView：：setViewport()函數來添加QGLWidget 。

我們新建空的Qt項目，項目名稱為graphicsView04，然後添加main.cpp文件，再新添一個C++ 類，類名為MyView，基類為QGraphicsView，類型信息選擇“繼承自QWidget”。

然後在myview.h中添加頭文件：#include <QtGui>

protected:

   void wheelEvent(QWheelEvent *event);

voidmousePressEvent(QMouseEvent *event);

我們到myview.cpp文件中進行函數的定義：

MyView::MyView(QWidget *parent) :

   QGraphicsView(parent)

{

   resize(400,400);

    setBackgroundBrush(QPixmap("../graphicsView04/01.jpg"));//其實就是設置場景的背景

   QGraphicsScene *scene = new QGraphicsScene(this);

   scene->setSceneRect(0,0,200,200);

   QGraphicsRectItem *item = new QGraphicsRectItem(0,0,20,20);

   item->setBrush(Qt::red);

   scene->addItem(item);

   setScene(scene);

}

void MyView::wheelEvent(QWheelEvent*event)  //滾輪事件

{

   if(event->delta() > 0)  //如果鼠標滾輪遠離使用者，則delta()返回正值

       scale(0.5,0.5);  //視圖縮放

   else scale(2,2);

}

void MyView::mousePressEvent(QMouseEvent*event)

{

   rotate(90);  //視圖旋轉順時針90度

}

這裏我們定義了鼠標的滾輪事件和按下事件，在滾輪事件中，利用delta()函數返回值的正負來判斷滾輪的移動方向，然後我們讓視圖進行縮放。

最後到main.cpp文件中，更改其內容如下：

#include "myview.h"

int main(int argc,char *argv[])

{

   QApplication app(argc,argv);

   MyView *view = new MyView;

   view->show();

   return app.exec();

}

上麵四幅圖分別是：正常，旋轉90度後，縮小後，放大後的效果。可以看到實現視圖的變換是十分簡單的。

我們在上麵講場景時就提到了場景邊框(SceneRect)，這裏再說說它在視圖中的作用。我們前麵說過，視圖是可以提供滾動條的，但是，這隻是在視圖窗口小於場景時才自動出現的。如果我們不定義場景邊框，那麼當場景中的圖形項移動到視圖可視窗口以外的地方時，視圖就會自動出現滾動條，但是即使是圖形項再次回到可視區域，滾動條也不會消失。為了解決這個問題，我們可以為場景設置邊框，這樣，當圖形項移動到場景邊框以外時，視圖是不會提供額外的滾動區域的。

       而當整個場景都可視時，也就是說視圖沒有滾動條時，我們可以通過setAlignment()函數來設置場景在視圖中的對齊方式，如左對齊Qt::AlignLeft ，向上對齊Qt::AlignTop ，中心對齊Qt::AlignCenter。更多的對齊方式，可以查看幫助中Qt::Alignment 關鍵字。默認的對齊方式是Qt::AlignCenter 。而且幾種對齊方式可以通過“按位或”操作一起使用。我們在上麵的程序中的myitem.cpp文件中的構造函數最後添加一行代碼：

setAlignment(Qt::AlignLeft | Qt::AlignTop);

在QGraphicView中提供了三種拖動模式，分別是：

• QGraphicsView::NoDrag ：忽略鼠標事件，不可以拖動。
• QGraphicsView::ScrollHandDrag ：光標變為手型，可以拖動場景進行移動。
• QGraphicsView::RubberBandDrag ：使用橡皮筋效果，進行區域選擇，可以選中一個區域內的所有圖形項。
  

我們可以利用setDragMode()函數進行相應設置。

下麵我們更改上麵的程序。在myview.cpp中的構造函數中的最後添加一行代碼：

setDragMode(QGraphicsView::ScrollHandDrag);//手型拖動

scene->setSceneRect(0,0,800,800);

這時運行程序，雖然出現了小手，但是並不能拖動場景。為什麼呢？我們在mousePressEvent()函數中添加一行代碼：

QGraphicsView::mousePressEvent(event);

我們在事件函數的最後添加了一行：QGraphicsView::mousePressEvent(event);這樣程序才能執行默認的事件。這也是我們下麵要說的事件傳播的內容的一部分。

在上麵我們看到必須在事件函數的最後將event參數傳遞出去，才能執行默認的事件操作。其實不止上麵那一種情況，在圖形視圖框架中，鼠標鍵盤等事件是從視圖進入的，視圖將它們傳遞給場景，場景再將事件傳遞給該點的圖形項，如果該點有多個圖形項，那麼就傳給最上麵的圖形項。所以要想使這個事件能一直傳播下去，我們就需要在重新實現事件處理函數時，在其最後將event參數傳給默認的事件處理函數。比如我們重寫了場景的鍵盤按下事件處理函數，那麼我們就在該函數的最後寫上QGraphicsScene：：keyPressEvent(event);一行代碼。

如果場景的背景需要大量耗時的渲染，可以利用CacheBackground來緩存背景，當下次需要渲染背景時，可以快速進行渲染。它的原理就是，把整個視口先繪製到一個pixmap上。但是這個隻適合較小的視口，也就是說，如果視圖窗口很大，而且有滾動條，那麼就不再適合緩存背景。我們可以使用setCacheMode(QGraphicsView::CacheBackground);來設置背景緩存。默認設置是沒有緩存QGraphicsView::CacheNone。

QGraphicsView默認使用一個QWidget作為視口部件，如果我們要使用OpenGL進行渲染，可以使用setViewport()函數來添加一個QGLWidget對象。看下麵的例子。

我們先在項目文件graphicsView04.pro中加入

QT += opengl

說明要使用OpenGL模塊，然後在myview.cpp文件中添加頭文件：

#include <QtOpenGL>

QGLWidget *widget =new QGLWidget(this);

setViewport(widget);

這樣便使用OpenGL進行渲染了。關於OpenGL，我們在後麵的3D繪圖部分再講。

在myview.cpp中的構造函數裏將以前那個item改名為item1，然後再加入一個item2和一個圖形項組對象group。更改後構造函數的部分代碼如下：

QGraphicsRectItem *item1 = newQGraphicsRectItem(0,0,20,20);

item1->setBrush(Qt::red);

item1->setPos(10,0);

scene->addItem(item1);

QGraphicsRectItem *item2 = newQGraphicsRectItem(0,0,20,20);

item2->setBrush(Qt::green);

item2->setPos(30,0);

scene->addItem(item2);

QGraphicsItemGroup *group = newQGraphicsItemGroup;  //新建圖形項組

group->addToGroup(item1);

group->addToGroup(item2);

scene->addItem(group);

setScene(scene);

qDebug() << "itemAt(10,0) :" <<itemAt(10,0); //輸出(10,0)點的圖形項

qDebug() << "itemAt(30,0) :" <<itemAt(30,0);

qDebug() <<"#################################"; //分割線

然後我們到myview.h文件中protected下聲明鍵盤按下事件槽函數：

void keyPressEvent(QKeyEvent *event);

再到myview.cpp中定義它，如下：

void MyView::keyPressEvent(QKeyEvent*event)

{

   qDebug() << items();  //輸出場景中所有的圖形項

   items().at(0)->setPos(100,0);

   items().at(1)->setPos(0,100);

   QGraphicsView::keyPressEvent(event); //執行默認的事件處理

}

可以看到，itemAt()函數可以輸出場景上任意點的圖形項。而items()函數可以輸出場景上所有的圖形項。這裏應該說明，items()函數返回的圖形項列表是按棧的降序排序的，也就是說，items().at(0)返回的是最後加入場景的圖形項。從上麵可以看出，最後加入的圖形項是item2，其實，因為我們使用了group，而item1和item2都在group裏，所以我們隻需將group加入場景中就可以了，前麵把item1和item2也加入場景是多餘的。我們可以將scene->addItem(item1);和scene->addItem(item2);兩行代碼刪掉。那麼這時加入場景的順序就是，先加入group，因為item1先加入group，所以下麵將item1加入場景，最後加入場景的是item2，這就是為什麼items.at(0)會是item2的原因。

       下麵再說圖形項組，其實圖形項組也是一個圖形項，它有圖形項所擁有的所有特性。其作用就是，將加入它的所有圖形項作為一個整體，對這個圖形項組進行操作，就相當於對齊中所有圖形項進行操作。圖形項組是加入它的所有圖形項的父圖形項，在上麵的輸出的parent信息中我們可以看到這一點。下麵我們將程序中的代碼更改如下：

void MyView::keyPressEvent(QKeyEvent*event)

{

   items().at(2)->setPos(100,100);

   QGraphicsView::keyPressEvent(event); //執行默認的事件處理

}

可以看到，兩個圖形項是同時移動的。我們要從圖形項組中移除一個圖形項，可以使用removeFromGroup()函數，它可以將給定的item從group中刪除，要注意這時item依然存在，它會回到group的父圖形項中，如果group沒有父圖形項，那麼item就會回到場景中。我們可以使用場景的removeItme()函數來刪除group，這樣也會將group中所有的圖形項從場景中刪除。還有一種辦法是利用場景的destroyItemGroup()函數，它會刪除group並銷毀它，但是group中的所有圖形項會回到group的父圖形項中，如果它沒有父圖形項，那麼所有圖形項就會回到場景中。

圖形視圖框架提供了兩個打印函數render()，一個是在QGraphicsScene中，一個是在QGraphicsView中，並且它們的函數原型是一模一樣的。不過它們實現的效果稍有不同。看一麵的例子。

void MyView::mousePressEvent(QMouseEvent*event)

{

    rotate(90); //視圖旋轉順時針90度

   QPixmap pixmap(400,400);  //必須指定大小

   QPainter painter(&pixmap);

   render(&painter,QRectF(0,0,400,400),QRect(0,0,400,400));  //打印視圖指定區域內容

    pixmap.save("../graphicsView04/save.png");

   QGraphicsView::mousePressEvent(event);

}

這裏我們使用了視圖的render()函數，其中的QRectF參數是指設備的區域，這裏是指pixmap。而QRect參數是指視圖上要打印的區域。我們利用QPixmap類的save()函數，將pixmap圖片保存到我們項目源碼目錄中，文件名為“save.png”。下麵是運行程序後，點擊鼠標，生成的圖片的效果：

   

scene()->render(&painter,QRectF(0,0,400,400),QRect(0,0,400,400));//打印場景內容

       圖形視圖框架是一個非常強大而且龐雜的係統，我們教程中也隻是很籠統的介紹了一些最基本最常用的內容。如果大家想係統學習該部分知識，想學習如何使用該框架輕鬆搭建一個遊戲，可以參考《Qt Creator快速入門》的第11章，以及《Qt 及Qt Quick開發實戰精解》的第二章。