Qt 视图框架示例 Colliding Mice 的翻译
目錄名字
- Qt 視圖框架示例 Colliding Mice 的翻譯
- 簡介:
- Mouse Class 定義
- Mouse Class 定義
- The Main() 函數
Qt 視圖框架示例 Colliding Mice 的翻譯
簡介:
該示例程序介紹了怎樣在Qt的視圖框架里創建動畫以及沖突檢測。視圖框架提供了QGraphicsScene class 場景類來管理2D圖形對象.一個QGraphicsView widget 來是顯示這些圖形項,并且支持視圖的縮放和旋轉。
在該示例中, Mouse class 自定義了一些Mice 的圖形項,main() 函數提供了應用程序的窗體。
首先我們來學習Mouse 類是如何實現動畫和沖突檢測的。然后我們學習main()函數是如何將mice 圖形項添加到場景中。
Mouse Class 定義
The mouse class繼承自QGraphicsItem. QGraphicsItem是視圖框架中所有圖形項的基類。它提供了一個輕量級的框架來創建用戶自定義的一些圖形項。
class Mouse : public QGraphicsItem{public:Mouse();QRectF boundingRect() const override;QPainterPath shape() const override;void paint(QPainter *painter, const QStyleOptionGraphicsItem *option,QWidget *widget) override;protected:void advance(int step) override;private:qreal angle = 0;qreal speed = 0;qreal mouseEyeDirection = 0;QColor color;};當我們創建自定義圖形項的時候,我們必須要重寫兩個虛函數
1、 boundingRect(), 繪圖的邊界
2、 paint(), 繪圖
我們還重寫了兩個函數shape()和advance().
1、shape():mice 圖形項的準確形狀。默認情況下,返回的是bounding rectangle.
2、advance():實現動畫
Mouse Class 定義
構造函數:初始化一些私有變量
Mouse::Mouse() : color(QRandomGenerator::global()->bounded(256),QRandomGenerator::global()->bounded(256),QRandomGenerator::global()->bounded(256)){setRotation(QRandomGenerator::global()->bounded(360 * 16));}這里我們用QRandomGenerator. 來實現Mice的不同膚色。
setRotation()來改變Mice 的方向。
QGraphicsScene 會在幀的推進中會調用每一圖形項的advance()功能,這里我們重寫了這個advance()方法,于是Mice會 一幀幀的動起來了。
void Mouse::advance(int step){if (!step)return;QLineF lineToCenter(QPointF(0, 0), mapFromScene(0, 0));if (lineToCenter.length() > 150) {qreal angleToCenter = std::atan2(lineToCenter.dy(), lineToCenter.dx());angleToCenter = normalizeAngle((Pi - angleToCenter) + Pi / 2);if (angleToCenter < Pi && angleToCenter > Pi / 4) {// Rotate leftangle += (angle < -Pi / 2) ? 0.25 : -0.25;} else if (angleToCenter >= Pi && angleToCenter < (Pi + Pi / 2 + Pi / 4)) {// Rotate rightangle += (angle < Pi / 2) ? 0.25 : -0.25;}} else if (::sin(angle) < 0) {angle += 0.25;} else if (::sin(angle) > 0) {angle -= 0.25;}因為advance()被調用兩次,第一次是step=0;然后是step=1;前一次不作任何動作。同時,我們要保證mice待在一個半徑是150像素的圓內。
mapFromScene() 是完成從圖形項坐標到場景坐標的映射。const QList<QGraphicsItem *> dangerMice = scene()->items(QPolygonF()<< mapToScene(0, 0)<< mapToScene(-30, -50)<< mapToScene(30, -50));for (const QGraphicsItem *item : dangerMice) {if (item == this)continue;QLineF lineToMouse(QPointF(0, 0), mapFromItem(item, 0, 0));qreal angleToMouse = std::atan2(lineToMouse.dy(), lineToMouse.dx());angleToMouse = normalizeAngle((Pi - angleToMouse) + Pi / 2);if (angleToMouse >= 0 && angleToMouse < Pi / 2) {// Rotate rightangle += 0.5;} else if (angleToMouse <= TwoPi && angleToMouse > (TwoPi - Pi / 2)) {// Rotate leftangle -= 0.5;}}if (dangerMice.size() > 1 && QRandomGenerator::global()->bounded(10) == 0) {if (QRandomGenerator::global()->bounded(1))angle += QRandomGenerator::global()->bounded(1 / 500.0);elseangle -= QRandomGenerator::global()->bounded(1 / 500.0);}然后我們要實現老鼠的碰撞的處理
speed += (-50 + QRandomGenerator::global()->bounded(100)) / 100.0;qreal dx = ::sin(angle) * 10;mouseEyeDirection = (qAbs(dx / 5) < 1) ? 0 : dx / 5;setRotation(rotation() + dx);setPos(mapToParent(0, -(3 + sin(speed) * 3)));}最后,我們計算mice的速度,和方向然后設定一個新的坐標。
QGraphicsItem::setPos() 函數會設定一個父窗體的坐標系統的位置。
應為圖形項是沒有父對象的,所以需要mapToParent() 將坐標映射到需要設置的父窗體的坐標系中。如果沒有設定父窗體,默認是映射到場景的坐標系中。
QRectF Mouse::boundingRect() const{qreal adjust = 0.5;return QRectF(-18 - adjust, -22 - adjust,36 + adjust, 60 + adjust);}boundingRect() 定義了圖形項的矩形邊界。Qt中的視圖框架是通過該函數的返回值類決定是否需要重畫圖形項。
void Mouse::paint(QPainter *painter, const QStyleOptionGraphicsItem *, QWidget *){// Bodypainter->setBrush(color);painter->drawEllipse(-10, -20, 20, 40);// Eyespainter->setBrush(Qt::white);painter->drawEllipse(-10, -17, 8, 8);painter->drawEllipse(2, -17, 8, 8);// Nosepainter->setBrush(Qt::black);painter->drawEllipse(QRectF(-2, -22, 4, 4));// Pupilspainter->drawEllipse(QRectF(-8.0 + mouseEyeDirection, -17, 4, 4));painter->drawEllipse(QRectF(4.0 + mouseEyeDirection, -17, 4, 4));// Earspainter->setBrush(scene()->collidingItems(this).isEmpty() ? Qt::darkYellow : Qt::red);painter->drawEllipse(-17, -12, 16, 16);painter->drawEllipse(1, -12, 16, 16);// TailQPainterPath path(QPointF(0, 20));path.cubicTo(-5, 22, -5, 22, 0, 25);path.cubicTo(5, 27, 5, 32, 0, 30);path.cubicTo(-5, 32, -5, 42, 0, 35);painter->setBrush(Qt::NoBrush);painter->drawPath(path);}paint()函數執行實際的圖形項的繪制。繪制時的坐標系都是圖形項自身的坐標系。
mice 的耳朵在碰撞是會顯示紅色。沒有碰撞時是灰黑色。
在Qt的視圖框架里通過shape-shape 交互來檢測識別碰撞沖突,所以shape()函數里返回的shape值必須要準確。
QPainterPath Mouse::shape() const{QPainterPath path;path.addRect(-10, -20, 20, 40);return path;}當shapes 變得復雜的時候,shape-shape 重疊檢測也會變得復雜,這會耗費計算的時間。重寫collidesWithItem()該函數可以自定義沖突的算法。
接著我們來看main()函數
The Main() 函數
int main(int argc, char **argv){QApplication app(argc, argv);首先我們創建一個應用程序,并且創建一個場景。
QGraphicsScene scene;
scene.setSceneRect(-300, -300, 600, 600);
QGraphicsScene提供了放置QGraphicsItems 的一個容器。該容器提供了一些函數方法來更好的顯示,管理圖形項。
當我們創建了一個場景,我們推介設定該場景的大小。若過沒有設定大小,場景的大小會隨著圖形項的增加,而不斷增大。
場景會給每一個圖形項一個索引號,也可以不設定索引號。索引號可以快速的定位到圖形項。
scene.setItemIndexMethod(QGraphicsScene::NoIndex);
QgrapbhicsScene使用下標來高效的管理item的位置,默認的使用BSP樹,適用于一個大型的場景,其中的item都是靜止不變的,可以選擇調用setItemIndexMethod().來禁用下標,可是查看itemIndexMethod來獲取更多的信息
for (int i = 0; i < MouseCount; ++i) {Mouse *mouse = new Mouse;mouse->setPos(::sin((i * 6.28) / MouseCount) * 200,::cos((i * 6.28) / MouseCount) * 200);scene.addItem(mouse);}//創建mice 圖形項
for (int i = 0; i < MouseCount; ++i) {Mouse *mouse = new Mouse;mouse->setPos(::sin((i * 6.28) / MouseCount) * 200,::cos((i * 6.28) / MouseCount) * 200);scene.addItem(mouse);}//然后將這些圖形項添加到場景中
QGraphicsView view(&scene);view.setRenderHint(QPainter::Antialiasing);view.setBackgroundBrush(QPixmap(":/images/cheese.jpg"));為了能夠歐看到場景,我們需要創建一個場景的窗體,QGraphicsView 類 可以提供一個自帶滾動條的窗體。我們確保圖形的渲染是抗鋸齒的。通過背景刷繪制一個背景。
view.setCacheMode(QGraphicsView::CacheBackground);view.setViewportUpdateMode(QGraphicsView::BoundingRectViewportUpdate);view.setDragMode(QGraphicsView::ScrollHandDrag);設置緩存機制。QGraphicsView 可以預渲染像素化的圖形。
設定拖拽模式。ScrollHandDrag 該模式下,當鼠標拖拽時會變為手型,同時滾動條會隨之變化。
view.setWindowTitle(QT_TRANSLATE_NOOP(QGraphicsView, "Colliding Mice"));view.resize(400, 300);view.show();QTimer timer;QObject::connect(&timer, &QTimer::timeout, &scene, &QGraphicsScene::advance);timer.start(1000 / 33);return app.exec();}最后設定窗體的標題,創建一個定時器,設定定時器的超時事件來調用場景的幀的步進。
總結
以上是生活随笔為你收集整理的Qt 视图框架示例 Colliding Mice 的翻译的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Qt 2D painting Demo
- 下一篇: Qt 图形视图框架中的事件处理和传播