Qt之QGraphicsView进阶篇,请把这些学完再去面试

437 阅读6分钟
QDialog *dialog = new QDialog(nullptr, Qt::CustomizeWindowHint | Qt::WindowTitleHint);
dialog->setWindowOpacity(0.8);
dialog->setWindowTitle("operation");
dialog->setLayout(new QVBoxLayout);
QPushButton *m_zoomInBtn = new QPushButton("zoomIn");
QPushButton *m_zoomOutBtn = new QPushButton("zoomOut");
QPushButton *m_rotateLeftBtn = new QPushButton("rotateLeft");
QPushButton *m_rotateRightBtn = new QPushButton("rotateRight");
dialog->layout()->addWidget(m_zoomInBtn);
dialog->layout()->addWidget(m_zoomOutBtn);
dialog->layout()->addWidget(m_rotateLeftBtn);
dialog->layout()->addWidget(m_rotateRightBtn);
scene.addWidget(dialog);

MyGraphicsView view; // 定义一个视图,并把场景添加到视图
view.setScene(&scene);
view.resize(1024, 768);
view.show();

// 点击按钮实现视图的缩放和旋转
QObject::connect(m_zoomInBtn, &QPushButton::clicked, [&]() { view.zoomIn(); });
QObject::connect(m_zoomOutBtn, &QPushButton::clicked, [&]() { view.zoomOut(); });
QObject::connect(m_rotateLeftBtn, &QPushButton::clicked, [&]() { view.rotateLeft(); });
QObject::connect(m_rotateRightBtn, &QPushButton::clicked, [&]() { view.rotateRight(); });

return a.exec();

}


![在这里插入图片描述](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/db56c3052a174f978ebda700714e9c6d~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=dAup%2FQ1exSE9dZWWTsP5YmlNOIU%3D)


## 打印


Qt中对打印的支持是有一个独立的 printsupport 模块来完成的,所以要想在程序中使用Qt的打印功能,必须先在pro文件中添加:  
 QT += printsupport


图形视图通过它的展示函数:QGraphicsScene::render() 和 QGraphicsView::render() 提供单线(single-line)打印。这些函数提供相同的API,通过将 QPainter 传递给展示函数,你可以打印场景、视图的全部或部分内容。


场景和视图的渲染函数的不同在于 QGraphicsScene::render() 使用场景坐标,而 QGraphicsView::render() 使用视图坐标。QGraphicsScene::render() 经常用于打印未变换场景中的整块,例如一块图形数据或是打印一个文本文档。 QGraphicsView::render() 适合用于打印屏幕快照(screenshots),缺省情况下它展示视图端口中的当前内容。


官方示例:![在这里插入图片描述](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/d8b1040b18f845158239dfc668eac8fe~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=W6ekwTq%2FaoWs4MA6Aoe5CiblSao%3D)![在这里插入图片描述](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/5ec42150ea884ad086efe86714c6f3af~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=4dFzCYxrINqCa%2Bq43v1RSnI3c6A%3D)


## 拖拽和碰撞检测


由于 QGraphicsView 继承自 QWidget,所以 GraphicsView 同样提供了拖拽功能。此外,GraphicsView 框架也为场景、图元提供拖拽支持。当视图接收到拖拽事件,GraphicsView 框架会将拖拽事件翻译为 QGraphicsSceneDragDropEvent 事件,再发送到场景,场景接管事件,再把事件发送到光标下接受拖拽的第一个图元。


为了在场景中获取拖拽事件,你需要重新实现QGraphicsScene::dragEnterEvent() 和在 QGraphicsItem 的子类里任何与你特定场景需要的事件处理器。items 也可以通过调用 QGraphicsItem::setAcceptDrops() 获得拖拽支持,为了处理将要进行的拖拽,你需要重新实现 dropEvent、dragdragEnterEvent、dragLeaveEvent、dropMoveEvent、mousePressEvent、mouseReleaseEvent 和 mouseMoveEvent。


为了处理碰撞时的行为,我们需要创建 QGrahicsItem 的一个子类,然后重新实现 boundingRect 和 paint。boundingRect 用于返回图元绘制所需要的估测区域,而 paint 实现实际的绘图操纵。


这里展示一个小例子,外面一圈是 colorItem 实现了拖拽,中间是个 dropItem 实现了碰撞检测。当我把某个 colorItem 拖拽并触碰到 dropItem 时,dropItem 的颜色就会变成 colorItem 的颜色。代码太多就不放了,感兴趣的小伙伴可以在最下面示例中下载源代码。


![在这里插入图片描述](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/5386bfb1ea4f467087bf17231d26776c~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=%2BAvyUfmK4kLZsLfeFVC0wSfwPPc%3D)


## 光标与工具提示


像QWidget一样,QGraphicsItem也支持光标 QgraphicsItem::setCursor() 与工具提示 QGraphicsItem::setToolTip()。当光标进入到item的区域,光标与工具提示被 QGraphicsView 激活,通过调用 QGraphicsItem::contains()来检测。你也可以直接在视图上设置一个缺省光标 QGraphicsView::setCursor()。


## 动画


GraphicsView 框架支持多种层次的动画,使用动画框架可以很容易制作出动画。GraphicsView 框架支持的动画实现种类如下:


* 图元需要继承自 QGraphicsObject,并且需要联结 QPropertyAnimation属性;
* 创建继承自 QObject 和 QGraphicsItem 的图元,图元可以设置自己的定时器,通过在QObject::timeEvent() 中增加步进的方式来控制动画;
* 通过调用 QGraphicsScene::advance() 来推进场景,依次调用QGraphicsItem::advance();


## OpenGL渲染


为了使用 OpenGL 渲染,你要设置一个新的 QGLWidget 作为QGraphicsView 的视口 QGraphicsView::setViewPort()。假如你让 OpenGL 提供反锯齿功能,你需要 OpenGL 采样缓冲支持。



QGraphicsView view; view.setViewport(new QGLWidget(QGLFormat(QGL::SampleBuffers))); view.setViewportUpdateMode(QGraphicsView::FullViewportUpdate); view.setScene(new OpenGLScene); view.show();


## Item组


通过把一个图元做为另一个图元的孩子,可以得到图元组的大多数本质特性:所有图元会一起移动,所有变换会从父到子传递。


另外,QGraphicsItemGroup 是一个特殊的图元。为了增加和删除图元,它使用一个有用接口合并了子图元的事件处理。把一个图元加到QGraphicsItemGroup 仍会保留图元的原始位置与变换,而给一个图元重新指定父图元则会让图元根据其新的父亲重新定位。可以用QGraphicsScene::createItemGroup() 创建图元组。


## 图形组件和布局


QT4.4 通过 QGraphicsWidget 支持图形和图元布局。QGraphicsWidget 类似于 QWidget,但 QGraphicsWidget 并不从 QPaintDevice 继承,而是继承自 QGraphicsItem。QGraphicsWidget 支持事件、信号与槽、大小和策略。通过 QGraphicsLinearLayout、QGraphicsGridLayout 可以对图形组件进行布局管理。


QGraphicsWidget 继承了 QWidget 和 QGraphicsItem 的优点,如 QWidget的样式、字体、调色板、布局方向以及 QGraphicsItem 的图形、独立精度和变换支持。


QGraphicsLayout 是专为 QGraphicsWidget 特殊设计的第二代布局框架。QGraphicsLayout 的API类似于 QLayout。通过 QGraphicsLinearLayout 和QGraphicsGridLayout 可以管理组件与子布局。


## 嵌入组件


图形视图框架为嵌入任何组件到场景提供了无缝支持。可以嵌入简单的组件,如 QLineEdit、QPushButton,或是复杂的组件如 QTableWidget,甚至是主窗口。


要嵌入组件到场景,只需要调用 QGraphicsScene::addWidget(),或是创建一个 QGraphicsProxyWidget 实例,手动嵌入组件。通过 QGraphicsProxyWidget,图形视图框架可以深度整合客户组件特性,如光标、工具提示、鼠标、平板和键盘事件、子组件、动画、弹拉框、组件输入焦点和激活。QGraphicsProxyWidget 甚至整合了嵌入组件的 tab 顺序,可以通过 tab 选择嵌入的组件。甚至可以嵌入一个 QGraphicsView 到场景。


## 示例


1. 拖拽和碰撞检测示例  
 [github 源代码下载](https://gitee.com/vip204888)
2. 网上的一个3D模型示例  
 [github 源代码下载](https://gitee.com/vip204888)


![在这里插入图片描述](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/6256c0cd8e084328aa3133e26ed3f0d5~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=819%2BK3TTpe10r8N28edQ7R%2FGo18%3D)


#### 更多请参考


* [Qt之QGraphicsView入门篇](https://gitee.com/vip204888)
* [Qt之QGraphicsView实战篇](https://gitee.com/vip204888)







**收集整理了一份《2024年最新物联网嵌入式全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升的朋友。**
![img](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/b060a395de3e40429d506953cbe95d60~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=DiqW0GUsowEPe7mS60OoSjpTRB8%3D)
![img](https://p3-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/3d141455cb7c4cf7bbd6a0d97a69ff80~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg5py65Zmo5a2m5Lmg5LmL5b-DQUk=:q75.awebp?rk3s=f64ab15b&x-expires=1771856403&x-signature=JKdhUsY7%2BGTtHizb89%2BumPfPl4M%3D)

**[如果你需要这些资料,可以戳这里获取](https://gitee.com/vip204888)**

**一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人**

**都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!**