【qt小系统】使用qt实现透明的3D魔方效果

   摘要：本文主要是利用 QOpenGLWidget
实现的3D魔方效果，可实现自动宣传及鼠标拖动，可根据自己喜好贴差异的配景图及编写内容。代码实现了一个带有旋转立方体的 OpenGL
小部件，立方体的六个面上分别绘制了一些笔墨。
  由于本人能力有限，难免有疏漏之处。
  文中源码文件【获取方式】：关注公众号：利哥AI实例探险，
  给公众号发送 “qt3D魔方” 获取下载方式，关注发送关键字即可获取下载方式，免费，无套路，关注即可！
  原文地址：【qt小系统】使用qt实现透明的3D魔方效果
系统演示

基本介绍

• 初始化时，代码加载立方体多少形状和纹理，准备好 OpenGL 的基本配置和着色器。
  
• 鼠标移动控制立方体的旋转，通过捕获鼠标事件计算旋转轴和速度。
  
• 使用定时器逐步低沉旋转速度，模拟摩擦力的效果。
  
• 在每一帧中，代码重新计算并设置投影矩阵，绑定纹理，并最终绘制立方体。
  
• 立方体表面的纹理图像由 InitCube() 动态天生，使用 QPainter 绘制带有随机颜色和字体的笔墨。
  通过这些技术和逻辑，代码实现了一个可以根据鼠标输入旋转的立方体，每一面都表现了差异的图像和笔墨。
  

• 使用 initializeGL() 方法初始化 OpenGL 上下文，包括设置深度测试和背面剔除。
  
• 使用 paintGL() 方法进行绘制，负责绘制立方体的每一帧画面。
  
• 通过重载 mousePressEvent 和 mouseMoveEvent 方法，代码捕获并处置惩罚鼠标按下和移动事件，以计算并更新立方体的旋转角度。
  
• 计算鼠标移动的方向和距离，将其转化为旋转轴和旋转速度。
  
• 使用 timerEvent() 方法每隔肯定时间触发一次，逐步减少旋转速度，实现类似摩擦力的效果，从而使立方体旋转逐渐停止。
  
• 使用 initShaders() 方法加载和编译顶点着色器和片段着色器，构建并绑定着色器程序。这一步为后续在 OpenGL 管线中使用着色器进行绘制做了准备。
  
• 使用 initTextures() 方法加载纹理，将其绑定到立方体的各个面。设置纹理的缩小和放大过滤模式，以及纹理的包裹模式（Repeat）。
  
• 使用 GeometryEngine 类管理立方体的多少形状，并在 paintGL() 方法中调用其 rawCubeGeometry() 方法绘制立方体。
  
• InitCube() 方法将预定义的笔墨转换为图像，并将多个图像归并成一个纹理，用于立方体的表面。使用 QPainter 类在图像上绘制笔墨，笔墨的字体和颜色是随机天生的。
  
• 使用 QMatrix4x4 进行模型视图变换和透视投影计算，在 resizeGL() 和 paintGL() 方法中设置合适的投影矩阵。
  

核心代码

vshader.glsl文件

1. #ifdef GL_ES
2. // Set default precision to medium
3. precision mediump int;
4. precision mediump float;
5. #endif
7. uniform mat4 mvp_matrix;
9. attribute vec4 a_position;
10. attribute vec2 a_texcoord;
12. varying vec2 v_texcoord;
14. //! [0]
15. void main()
16. {
17.     // Calculate vertex position in screen space
18.     gl_Position = mvp_matrix * a_position;
20.     // Pass texture coordinate to fragment shader
21.     // Value will be automatically interpolated to fragments inside polygon faces
22.     v_texcoord = a_texcoord;
23. }
24. //! [0]

复制代码

fshader.glsl文件

1. #ifdef GL_ES
2. // Set default precision to medium
3. precision mediump int;
4. precision mediump float;
5. #endif
7. uniform sampler2D texture;
9. varying vec2 v_texcoord;
11. //! [0]
12. void main()
13. {
14.     // Set fragment color from texture
15.     gl_FragColor = texture2D(texture, v_texcoord);
16. }
17. //! [0]

复制代码

主要部门代码，代码比较长，有须要的可以到文章摘要中获取下载方式，免费下载使用。

1. #include "DlgCube.h"
4. #include <QMouseEvent>
5. #include <math.h>
6. #include <QPen>
7. #include <QPainter>
8. #include <QTime>
11. DlgCube::DlgCube(int width, int height, QWidget *parent) :
12.     QOpenGLWidget(parent),
13.     geometries(0),
14.     texture(0),
15.     angularSpeed(0)
16. {
17.     this->setFixedSize(width, height);
18. }
21. DlgCube::~DlgCube()
22. {
23.     // Make sure the context is current when deleting the texture
24.     // and the buffers.
25.     makeCurrent();
26.     delete texture;
27.     delete geometries;
28.     doneCurrent();
29. }
32. void DlgCube::mousePressEvent(QMouseEvent *e)
33. {
34.     // Save mouse press position
35.     mousePressPosition = QVector2D(e->localPos());
36. }
39. void DlgCube::mouseMoveEvent(QMouseEvent *e)
40. {
41.     //qDebug()<<e->pos();
42.     // Mouse release position - mouse press position
43.     QVector2D diff = QVector2D(e->localPos()) - mousePressPosition;
44.     // Rotation axis is perpendicular to the mouse position difference
45.     // vector
46.     QVector3D n = QVector3D(diff.y(), diff.x(), 0.0).normalized();
47.     // Accelerate angular speed relative to the length of the mouse sweep
48.     qreal acc = diff.length() / 100.0;
49.     // Calculate new rotation axis as weighted sum
50.     rotationAxis = (rotationAxis * angularSpeed + n * acc).normalized();
51.     // Increase angular speed
52.     angularSpeed += acc;
54.     mousePressPosition = QVector2D(e->localPos());
55. }
57. void DlgCube::timerEvent(QTimerEvent *)
58. {
59.     // Decrease angular speed (friction)
60.     angularSpeed *= 0.95;
61.     // Stop rotation when speed goes below threshold
62.     if (angularSpeed < 0.01) {
63.         angularSpeed = 0.0;
64.     } else {
65.         // Update rotation
66.         rotation = QQuaternion::fromAxisAndAngle(rotationAxis, angularSpeed) * rotation;
67.         // Request an update
68.         update();
69.     }
70. }
72. void DlgCube::initializeGL()
73. {
74.     initializeOpenGLFunctions();
75.     //球 后 widget 的背景色
76. //    glClearColor(1, 1, 1, 0);
77.     initShaders();
78.     initTextures();
79.     // Enable depth buffer
80.     glEnable(GL_DEPTH_TEST);
81.     // Enable back face culling
82.     glEnable(GL_CULL_FACE);
83.     geometries = new GeometryEngine;
84.     // Use QBasicTimer because its faster than QTimer
85.     timer.start(12, this);
86. }
89. void DlgCube::initShaders()
90. {
91.     // Compile vertex shader
92.     if (!program.addShaderFromSourceFile(QOpenGLShader::Vertex, ":/vshader.glsl"))
93.         close();
94.     // Compile fragment shader
95.     if (!program.addShaderFromSourceFile(QOpenGLShader::Fragment, ":/fshader.glsl"))
96.         close();
97.     // Link shader pipeline
98.     if (!program.link())
99.         close();
100.     // Bind shader pipeline for use
101.     if (!program.bind())
102.         close();
103. }
106. void DlgCube::initTextures()
107. {
108.     // Load cube.png image
109.     texture = new QOpenGLTexture(myImage.mirrored());
110.     // Set nearest filtering mode for texture minification
111.     texture->setMinificationFilter(QOpenGLTexture::Nearest);
113.     // Set bilinear filtering mode for texture magnification
114.     texture->setMagnificationFilter(QOpenGLTexture::Linear);
115.     // Wrap texture coordinates by repeating
116.     // f.ex. texture coordinate (1.1, 1.2) is same as (0.1, 0.2)
117.     texture->setWrapMode(QOpenGLTexture::Repeat);
118. }
121. void DlgCube::resizeGL(int w, int h)
122. {
123.     // Calculate aspect ratio
124.     qreal aspect = qreal(w) / qreal(h ? h : 1);
127.     // Set near plane to 3.0, far plane to 7.0, field of view 45 degrees
128.     //fov 可以调节大小
129.     const qreal zNear = 2.5, zFar = 7.0, fov = 45.0;
132.     // Reset projection
133.     projection.setToIdentity();
136.     // Set perspective projection
137.     projection.perspective(fov, aspect, zNear, zFar);
138. }
141. void DlgCube::paintGL()
142. {
143.     // Clear color and depth buffer
144.     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
145.     texture->bind();
146.     // Calculate model view transformation
147.     QMatrix4x4 matrix;
148.     matrix.translate(0.0, 0.0, -5.0);
149.     matrix.rotate(rotation);
150.     // Set modelview-projection matrix
151.     program.setUniformValue("mvp_matrix", projection * matrix);
152.     // Use texture unit 0 which contains cube.png
153.     program.setUniformValue("texture", 0);
154.     // Draw cube geometry
155.     geometries->drawCubeGeometry(&program);
156. }
159. void DlgCube::InitCube()
160. {
161.     m_which_color = 0;
162.     tip_1.clear(); tip_2.clear(); tip_3.clear(); tip_4.clear(); tip_5.clear(); tip_6.clear();
163.     tip_1.push_back("<静夜思>");
164.     tip_1.push_back("床前明月光");
165.     tip_1.push_back("疑是地上霜");
166.     tip_1.push_back("举头望明月");
167.     tip_1.push_back("低头思故乡");
170.     tip_2.push_back("<江雪>");
171.     tip_2.push_back("千山鸟飞绝");
172.     tip_2.push_back("万径人踪灭");
173.     tip_2.push_back("孤舟蓑笠翁");
174.     tip_2.push_back("独钓寒江雪");
177.     tip_3.push_back("<闻乐天授江州司马>");
178.     tip_3.push_back("残灯无焰影幢幢");
179.     tip_3.push_back("此夕闻君谪九江");
180.     tip_3.push_back("垂死病中惊坐起");
181.     tip_3.push_back("暗风吹雨入寒窗");
184.     tip_4.push_back("问世间情是何物");
185.     tip_4.push_back("直教生死相许");
186.     tip_4.push_back("天南地北双飞客");
187.     tip_4.push_back("老翅几回寒暑");
188.     tip_4.push_back("欢乐趣");
191.     tip_5.push_back("离别苦");
192.     tip_5.push_back("就中更有痴儿女");
193.     tip_5.push_back("君应有语");
196.     tip_6.push_back("渺万里层云，千山暮雪，只影向谁去?");
197.     //merge
198.     QString str = QString(":image/edge.png");
199.     QImage resultImg(str);
200.     //
201.     QPainter painter;
202.     painter.begin(&resultImg);
203.     //在新区域画图
204.     painter.drawImage(  0,   0, Text_To_Image(0));
205.     painter.drawImage(396,   0, Text_To_Image(1));
206.     painter.drawImage(792,   0, Text_To_Image(2));
207.     painter.drawImage(  0, 400, Text_To_Image(3));
208.     painter.drawImage(396, 400, Text_To_Image(4));
209.     painter.drawImage(792, 400, Text_To_Image(5));
210.     painter.end();
211.     QString strResultImg = QString("./tiledball.png");
212.     resultImg.save(strResultImg);
213.     myImage = resultImg;
214. }
217. void DlgCube::MoveLittle()
218. {
219.     //move 初始位置露出一个角
220.     QVector2D diff = QVector2D(QPoint(180,180));
221.     QVector3D n = QVector3D(diff.y(), diff.x(), 0.0).normalized();
222.     qreal acc = diff.length() / 100.0;
223.     rotationAxis = (rotationAxis * angularSpeed + n * acc).normalized();
224.     angularSpeed += acc;
225. }
228. QImage DlgCube::Text_To_Image(int count)
229. {
230.     QVector <QString> tip;
231.     QImage img;
232.     switch(count)
233.     {
234.     case 0:tip = tip_1; img.load(":image/11.png");break;
235.     case 1:tip = tip_2; img.load(":image/22.png");break;
236.     case 2:tip = tip_3; img.load(":image/33.png");break;
237.     case 3:tip = tip_4; img.load(":image/44.png");break;
238.     case 4:tip = tip_5; img.load(":image/55.png");break;
239.     case 5:tip = tip_6; img.load(":image/66.png");break;
240.     default:break;
241.     }
242.     QPainter painter;
243.     painter.begin(&img);
246.     QFont font;
247.     font.setBold(true);
250.     int tip_size = tip.size()>8?8:tip.size();
251.     for(int i=0;i<tip_size;i++)
252.     {
253.         switch (m_which_color%2)
254.         {
255.         case 0:font.setFamily("Noto Sans S Chinese Thin");break;
256.         case 1:font.setFamily("Noto Sans S Chinese Bold");break;
257.         default:break;
258.         }
259.         font.setPixelSize(random_fontpixsize(tip[i].length()));
260.         painter.setFont(font);
261.         QPen pen = random_Color();
262.         painter.setPen(pen);
263.         //左右各留20px
264.         int x = 20 + qrand()%((360 - tip[i].length()*font.pixelSize())+1);
265.         if(x<0)
266.             x = 5;
267.         //y会在实际图上向下偏移10个坐标
268.         int y = 380/tip_size*i + qrand()%((380/tip_size - font.pixelSize())+1);
269.         painter.drawText(QRect(x, y, 380,380), Qt::AlignLeft|Qt::AlignTop,tip[i]);
270.     }
273.     painter.end();
274.     return img;
275. }
278. QPen DlgCube::random_Color()
279. {
280.     QPen pen;
281.     switch (m_which_color % 4) {
282.     case 0:pen.setColor(QColor(151,255,244));
283.         break;
284.     case 1:pen.setColor(QColor(255,195,109));
285.         break;
286.     case 2:pen.setColor(QColor(124,204,255));
287.         break;
288.     case 3:pen.setColor(QColor(255,255,255));
289.         break;
290.     default:
291.         break;
292.     }
293.     m_which_color++;
294.     return pen;
295. }
298. int DlgCube::random_fontpixsize(int fontlen)
299. {
300.     if(0 == fontlen)
301.         return 1;
302.     int size = (380 / fontlen / 2) + qrand()%(380 / fontlen / 2);
303.     //字体大小 25<size<38
304.     if (size > 38)
305.         size = 33 + qrand() % 6;
308.     if(size < 25)
309.         size = 25 + qrand() % 6;
312.     return  size;
313. }

复制代码

往期文章回顾
【深度学习】物体检测/实例分割/物体追踪/姿态估计/定向边框/图像分类检测演示系统【含源码】【深度学习】YOLOV8数据标注及模型训练方法团体流程介绍及演示【深度学习】行人跌倒举动检测软件系统【深度学习】火警检测软件系统【深度学习】吸烟举动检测软件系统【深度学习】数竹签演示软件系统【深度学习】菜品目标检测软件系统QT5集成FTP实现文件及文件夹的下载QT集成开源日记库示例python源码加密之Cython方案简单示例【python源码加密】Cython针对python工程多层级目录处置惩罚办法http服务网络请求如何确保数据安全(含python示例源码)http请求数据传输时确保完整性和保密性方案(含源码)QT集成百度在线地图JS API实现交互及特定效果【qt小游戏】小老鼠闯迷宫小游戏（附源码）【qt小系统】传感器云平台3D散点图（附源码）【qt小系统】通过qt折线图实现论文内容-快餐店排队效能分析【qt小系统】使用qt实现透明的3D魔方效果 竣事语

由于本人能力有限，难免有疏漏之处！
文中源码文件【获取方式】：关注公众号：利哥AI实例探险
给公众号发送 “qt3D魔方” 获取下载方式，免费，无套路，关注即可！！！
原文地址：【qt小系统】使用qt实现透明的3D魔方效果

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。