QT 2D绘图 缺乏、安全感 2022-03-26 07:41 334阅读 0赞 ### 文章目录 ### * 基础知识 * 基本绘制和填充 * 绘制文字 * * 代码 * 效果 * 绘制路径 * * 代码 * 效果 * 绘制图像 * * 四种常见的绘制图像的方法 * 代码 * 效果 * 双缓冲绘图 * * 效果显示 # 基础知识 # * 主要的三个类 * QPainter * QWidget * QPixmap * QPicture * QPrinter * QOpenGLPaintDevice * QPainterDevice * QPainterEngine **三者关系图** QPainter QPainEngine QPaintDevice # 基本绘制和填充 # 绘图系统由QPainter完成具体的绘制操作,QPainter可以绘制一切想要的图形,QPainter可以在继承自QPainterDevice类的任何对象上进行绘制操作 [Qt 之图形(QPainter 的基本绘图) 看这里][Qt _QPainter _] # 绘制文字 # 可参考[Qt 之图形(绘制文本)][Qt] ## 代码 ## QPainter painter(this); QRectF rect(10.0, 10.0, 380.0, 280.0); painter.setPen(Qt::red); painter.drawRect(rect); painter.setPen(Qt::blue); painter.setPen(Qt::blue); painter.drawText(rect, Qt::AlignHCenter, QStringLiteral("你好")); painter.drawText(rect, Qt::AlignLeft, QStringLiteral("左对齐")); painter.drawText(rect, Qt::AlignRight, QStringLiteral("右对齐")); painter.drawText(rect, Qt::AlignVCenter, QStringLiteral("中间左侧对齐")); painter.drawText(rect, Qt::AlignBottom, QStringLiteral("底部对齐")); painter.drawText(rect, Qt::AlignCenter, QStringLiteral("中间对齐")); painter.drawText(rect, Qt::AlignBottom | Qt::AlignRight, QStringLiteral("底部 | 右侧对齐")); ## 效果 ## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70] # 绘制路径 # 详细看这里[Qt 之图形(QPainterPath)][Qt _QPainterPath] ## 代码 ## QPainter painter(this); painter.setRenderHint(QPainter::Antialiasing); painter.setPen(Qt::red); QPainterPath path; path.moveTo(50, 250); path.lineTo(50, 230); path.cubicTo(QPointF(105, 40), QPointF(115, 80), QPointF(120, 60)); path.lineTo(130, 130); path.addEllipse(QPoint(130, 130), 30, 30); painter.setBrush(Qt::red); painter.drawPath(path); path.translate(200, 0); painter.setPen(Qt::darkBlue); painter.drawPath(path); ## 效果 ## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 1] # 绘制图像 # ## 四种常见的绘制图像的方法 ## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 2] ## 代码 ## QPainter painter; //绘制image QImage image(100, 100, QImage::Format_ARGB32); painter.begin(&image); painter.setPen(QPen(Qt::green, 3)); painter.setBrush(Qt::yellow); painter.drawRect(10, 10, 60, 60); painter.drawText(10, 10, 60, 60, Qt::AlignCenter, QStringLiteral("QImage")); painter.setBrush(QColor(0, 0, 0, 100)); painter.drawRect(50, 50, 40, 40); painter.end(); //绘制pixmap QPixmap pix(100, 100); painter.begin(&pix); painter.setPen(QPen(Qt::green, 3)); painter.setBrush(Qt::yellow); painter.drawRect(10, 10, 60, 60); painter.drawText(10, 10, 60, 60, Qt::AlignCenter, QStringLiteral("QPixmap")); painter.setBrush(QColor(0, 0, 0, 100)); painter.drawRect(50, 50, 40, 40); painter.end(); //绘制bitmap QBitmap bit(100, 100); painter.begin(&bit); painter.setPen(QPen(Qt::green, 3)); painter.setBrush(Qt::yellow); painter.drawRect(10, 10, 60, 60); painter.drawText(10, 10, 60, 60, Qt::AlignCenter, QStringLiteral("QBitmap")); painter.setBrush(QColor(0, 0, 0, 100)); painter.drawRect(50, 50, 40, 40); painter.end(); //绘制picture QPicture picture; painter.begin(&picture); painter.setPen(QPen(Qt::green, 3)); painter.setBrush(Qt::yellow); painter.drawRect(10, 10, 60, 60); painter.drawText(10, 10, 60, 60, Qt::AlignCenter, QStringLiteral("QPicture")); painter.setBrush(QColor(0, 0, 0, 100)); painter.drawRect(50, 50, 40, 40); painter.end(); painter.begin(this); painter.drawImage(50, 20, image); painter.drawPixmap(200, 20, pix); painter.drawPixmap(50, 170, bit); painter.drawPicture(200, 170, picture); ## 效果 ## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 3] ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 4] ## 双缓冲绘图 ## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 5]\#\#\# 代码 在头文件加入 private: QPixmap pix; QPixmap tempPix; QPoint startPoint; QPoint endPoint; //是否正在绘图的标志 bool isDrawing; protected: void mousePressEvent(QMouseEvent *event); void mouseMoveEvent(QMouseEvent *event); void mouseReleaseEvent(QMouseEvent *event); void paintEvent(QPaintEvent *event); 在cpp文件加入 void ch10_4_1::mousePressEvent(QMouseEvent *event) { if (event->button() == Qt::LeftButton) { startPoint = event->pos(); isDrawing = true; } } void ch10_4_1::mouseMoveEvent(QMouseEvent *event) { if (event->button() & Qt::LeftButton){ endPoint = event->pos(); tempPix = pix; update(); } } void ch10_4_1::mouseReleaseEvent(QMouseEvent *event) { if (event->button() == Qt::LeftButton){ endPoint = event->pos(); isDrawing = false; update(); } } void ch10_4_1::paintEvent(QPaintEvent *event) { int x = startPoint.x(); int y = startPoint.y(); int width = endPoint.x() - x; int height = endPoint.y() - y; QPainter painter; painter.begin(&tempPix); painter.drawRect(x, y, width, height); painter.end(); painter.begin(this); painter.drawPixmap(0, 0, tempPix); if (! isDrawing) { pix = tempPix; } } 其中的ch10\_4\_1为类名 **这里先在临时缓冲区进行绘图,然后将其绘制到界面上,最后判断是否已经完成绘图,如果是,则将临时缓冲区内容复制到缓冲区中,这样就完成了整个矩形的绘制** 如果想实现Windows桌面上的拖动鼠标出现的橡皮筋选择框,可以使用QRubberBand类来实现橡皮筋线。 ### 效果显示 ### ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 6] [Qt _QPainter _]: https://blog.csdn.net/liang19890820/article/details/51154216 [Qt]: https://blog.csdn.net/liang19890820/article/details/51227894 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70]: /images/20220326/e8d74b20f1ff417e8eeea5e5f52fd60f.png [Qt _QPainterPath]: https://blog.csdn.net/liang19890820/article/details/51393152 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 1]: /images/20220326/b349beddd8d64e10947bfb91aa9aa04f.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 2]: /images/20220326/0ca489701c88486aa6cbf7d60aa87bb6.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 3]: /images/20220326/db4b025eba174b4f92f450129ebc6839.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 4]: /images/20220326/2ec3906f513b496cbbabb5ca2fab934c.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 5]: /images/20220326/7a994f7546dc4320827441734853ca42.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N0eTk0NQ_size_16_color_FFFFFF_t_70 6]: /images/20220326/1384a8a81e394b41957deab11f8d2cea.png
相关 Qt实现2D绘图 一、介绍 Qt中提供了强大的2D绘图系统,可以使用相同的API在屏幕和绘图设备上进行绘制,它主要基于`QPainter`、`QPaintDevice`和`QPaintEn 太过爱你忘了你带给我的痛/ 2024年04月08日 09:36/ 0 赞/ 89 阅读
相关 【Qt】2D绘图之双缓冲绘图 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 绘制矩形 04. 青旅半醒/ 2022年11月13日 00:48/ 0 赞/ 247 阅读
相关 【Qt】2D绘图之涂鸦板 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 程序设计(基本功能) Dear 丶/ 2022年11月12日 15:59/ 0 赞/ 198 阅读
相关 【Qt】2D绘图之绘图中其它问题 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 重绘事件 04. 怼烎@/ 2022年11月12日 14:57/ 0 赞/ 218 阅读
相关 【Qt】2D绘图之绘制图片 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 简单绘制图片 04 - 日理万妓/ 2022年11月12日 10:58/ 0 赞/ 239 阅读
相关 【Qt】2D绘图之绘制路径 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 绘制简单路径 04 男娘i/ 2022年11月12日 10:52/ 0 赞/ 345 阅读
相关 【Qt】2D绘图之坐标系统 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. Qt坐标系统 04 约定不等于承诺〃/ 2022年11月12日 09:52/ 0 赞/ 230 阅读
相关 【Qt】2D绘图之渐变填充 00. 目录 文章目录 00. 目录 01. 概述 02. 开发环境 03. 线性渐变 04. 刺骨的言语ヽ痛彻心扉/ 2022年11月12日 09:45/ 0 赞/ 257 阅读
还没有评论,来说两句吧...