Qt的绘图API

🌟🌟hello,各位读者大大们你们好呀🌟🌟
🚀🚀系列专栏:【Qt的学习】
📝📝本篇内容:QPainter;图片类
⬆⬆⬆⬆上一篇:Qt之QSS
💖💖作者简介:轩情吖,请多多指教(>> •̀֊•́ ) ̖́-

1.QPainter

虽然 Qt 已经内置了很多的控件, 但是不能保证现有控件就可以应对所有场景.很多时候我们需要更强的 “⾃定制” 能力。Qt 提供了画图相关的 API, 可以允许我们在窗⼝上绘制任意的图形形状, 来完成更复杂的界⾯设计。所谓的 “控件” , 本质上也是通过画图的方式画上去的。

说明
QPainter “绘画者"或者"画家”.
用来绘图的对象,提供了一系列drawXXX方法,可以允许我们绘制各种图形.
QPaintDevice “画板”.
描述了QPainter把图形画到哪个对象上.像咱们之前用过的QWidget也是一种QPaintDevice(QWidget是QPaintDevice的子类).
QPen “画笔”.
描述了QPainter画出来的线是什么样的.
QBrush “画刷”.
描述了QPainter填充一个区域是什么样的.

绘图API的使用,一般不会在QWidget的构造函数中使用,而是要放到paintEvent事件中.


关于paintEvent 会在以下情况下被触发:

  • 控件首次创建.
  • 控件被遮挡,再解除遮挡.
  • 窗口最小化,再恢复.
  • 控件大小发生变化时.
  • 主动调用 repaint() 或者 update() 方法.(这两个方法都是QWidget的方法).

QPainter 在绘制时,是有一个默认的画笔的。在使用时也可以自定义画笔。在 Qt 中,QPen 类中定义了 QPainter 应该如何绘制形状、线条和轮廓。同时通过 QPen 类可以设置画笔的线宽、颜色、样式、画刷等。
画笔的颜色可以在实例化画笔对象时进行设置,画笔的宽度是通过 setWidth() 方法进行设置,画笔的风格是通过 setStyle() 方法进行设置,设置画刷主要是通过 setBrush() 方法。
在这里插入图片描述
在 Qt 中,画刷是使⽤ QBrush类 来描述,画刷⼤多⽤于填充。QBrush定义了QPainter的填充模式,具有样式、颜⾊、渐变以及纹理等属性。
画刷的格式中定义了填充的样式,使⽤ Qt::BrushStyle 枚举,默认值是 Qt::NoBrush,也就是不进⾏任何填充。可以通过 Qt 助⼿查找画刷的格式。
在这里插入图片描述

函数/方法声明 说明
QPainter painter(this) 创建画家对象,this 指定绘制设备(如当前控件),而非父对象。
painter.drawLine(int x1, int y1, int x2, int y2) 绘制直线,参数为起点 (x1,y1) 和终点 (x2,y2)
painter.drawLine(QPoint p1, QPoint p2) 重载版绘制直线,参数为起点 p1 和终点 p2QPoint 封装坐标)。
painter.drawRect(int x, int y, int w, int h) 绘制矩形,参数为左上角坐标 (x,y)、宽度 w、高度 h
painter.drawEllipse(int x, int y, int w, int h) 绘制椭圆/圆形(w=h 时为正圆),参数为外接矩形左上角 (x,y)、宽度 w、高度 h
painter.setFont(const QFont &font) 设置绘制文字的字体样式。
painter.drawText(int x, int y, const QString &text) (x,y) 位置绘制指定文本。
pen.setColor(const QColor &color) 设置画笔颜色(线条/轮廓颜色)。
pen.setWidth(int width) 设置画笔线条粗细。
pen.setStyle(Qt::PenStyle style) 设置画笔线条风格(如实线、虚线等)。
brush.setColor(const QColor &color) 设置画刷颜色(图形填充色)。
brush.setStyle(Qt::BrushStyle style) 设置画刷填充样式(如纯色、交叉线等)。
painter.setPen(const QPen &pen) 将自定义画笔应用到画家对象,后续绘图使用此画笔。
painter.setBrush(const QBrush &brush) 将自定义画刷应用到画家对象,后续绘图使用此画刷。
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
    void paintEvent(QPaintEvent *event);

private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

#include "widget.h"
#include "ui_widget.h"
#include <QPainter>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
}

Widget::~Widget()
{
    delete ui;
}

void Widget::paintEvent(QPaintEvent *event)
{
  QPainter painter(this);//这个是定义在栈上的,不考虑释放,这里指定的this,不是父对象,而是指定绘制的设备(往啥东西上画)
  //画直线
  painter.drawLine(20,20,20,200);//竖线
  painter.drawLine(20,20,200,20);//横线
  painter.drawLine(QPoint(200,20),QPoint(200,200));


  //绘制矩形
  painter.drawRect(20,300,200,200);

  //绘制圆形
  painter.drawEllipse(250,100,50,50);

  //绘制⽂字
  QFont font("微软雅黑",20);
  painter.setFont(font);
  painter.drawText(250,200,"hello world");


  QPen pen;//画笔
  pen.setColor(QColor(255,0,0));//设置颜色
  pen.setWidth(4);//设置画笔粗细
  pen.setStyle(Qt::DashLine);//设置线条的风格
  QBrush brush;//画笔
  brush.setColor(QColor(0, 255, 0));//设置填充色
  // brush.setStyle(Qt::SolidPattern);
  brush.setStyle(Qt::CrossPattern);//设置样式
  painter.setPen(pen);
  painter.setBrush(brush);
  painter.drawEllipse(250,400,50,50);

}


在这里插入图片描述
在这里插入图片描述

2.图片类

Qt 提供了四个类来处理图像数据:QImage、QPixmap、QBitmap 和 QPicture,它们都是常⽤的绘图设备。其中QImage主要⽤来进⾏ I/O 处理,它对 I/O 处理操作进⾏了优化,⽽且可以⽤来直接访问和操作像素;QPixmap 主要用来在屏幕上显示图像,它对在屏幕上 显示图像进⾏了优化;QBitmap是 QPixmap 的子类,⽤来处理颜⾊深度为1的图像,即只能显⽰⿊⽩两种颜⾊;QPicture ⽤来记录并
重演 QPainter 命令。这⼀节只讲解 QPixmap。

Qt QPainter 核心函数说明表

函数名 核心功能 最易踩的核心误区 误区纠正 & 关键提醒
rotate(angle) 当前绘图原点顺时针旋转坐标系方向(仅改方向,原点位置不变) 误以为旋转的是“原点”,或旋转的是“图片本身” 1. 原点位置全程不变,只改变x/y轴的正方向;
2. 旋转的是“绘图规则”,不是“图片”;
3. 180°旋转后x+向左、y+向上(方向完全颠倒)。
translate(dx, dy) 把绘图原点从当前位置平移到 (原x+dx, 原y+dy)(仅改原点,方向不变) 1. 误以为改了“窗口物理原点”;
2. 旋转后仍用正数平移
1. 仅改“画家参考的原点”,窗口左上角(0,0)永远不变;
2. 旋转180°后需用负数平移,才能把图片拉回窗口内。
drawPixmap(x,y,w,h,pix) 在(x,y)位置,绘制宽w、高h的图片 (x,y)始终跟随坐标系变化: 直接画可能出窗口,需配合translate调整。
save() / restore() 保存/恢复当前绘图状态(坐标系、画笔等) 忘记配对使用,导致后续绘图坐标系错乱 1. 旋转/平移前save,绘制后restore,一键还原默认状态;
2. 避免变换效果影响后续绘图。

总结(核心记忆点)

  1. rotate = 原地转身(方向变,原点不动);
  2. translate = 挪脚走路(原点变,方向不动);
  3. 旋转后位置不对 → 用translate挪原点,而非改旋转参数。

在这里插入图片描述

这边这个旋转可以看一下下面的图来

在这里插入图片描述

🌸🌸Qt的绘图API大概就讲到这里啦,博主后续会继续更新更多Qt的相关知识,干货满满,如果觉得博主写的还不错的话,希望各位小伙伴不要吝啬手中的三连哦!如有小伙伴需要Qt的安装包可以私信我,你们的支持是博主坚持创作的动力!💪💪

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐