当前位置: 首页 > article >正文

Qt:绘图API

目录

初识绘图

绘图API的使用

绘制形状(QPaintEvent)

绘制文字(画笔QPen)

内部填充(画刷QBrush)

绘制图片(QPixmap)


初识绘图

我们前面学习 Qt 主要是学 Qt 的各种控件,本质上都是画出来的
都是一些常用的东西,Qt 已经提前画好了,拿过来就能使用

实际开发中,很可能现有的控件无法满足需求,就需要自己 diy 一些控件/效果
Qt 提供的 绘图 API 就是为了解决上述问题的
实际开发中大部分情况下不需要使用 绘图 API

绘图API核心类:


画图相关的操作,一般不会放到 QWidget 的构造函数中调用执行,而是 Qt 提供了一个 paintEvent
事件处理函数,在这里进行调用

在出现下面的情况时,都能够自动触发到 QPaintEvent 事件:

  • 1.控件首次创建的时候
    比如往 QWidget 上画画
    QWidget 创建之前,画的东西当然不生效
    首次创建 QWidget 就能显示出画的东西来
  • 2.控件被遮挡, 再解除遮挡
    这个时机进行绘制也是很重要的,否则绘制的内容就会在被遮挡之后就没了
  • 3.窗口被最小化,再还原
  • 4.控件大小发生改变的时候
  • 5.主动在代码中调用 repaint 或者 update触发事件.(都是 QWidget 提供的成员函数)

因此 paintEvent 函数也就能够自动被调用


绘图API的使用

绘制形状(QPaintEvent)

在 widget.h 中需要重写 PaintEvent 函数:

函数定义如下:

上述函数的注意事项:

  • (void)event;是为了不报警告,因为下面的程序没有用到参数 event
  • 这是定义在栈上的变量,不需要考虑释放的问题,此处指定的 this,不是 父对象,而是指定绘制的设备(往啥东西上画)
  • drawLine后面的参数表示起点和终点的横纵坐标

此时效果为一条斜线:

也可以画矩形:

效果为:

也可以画圆形,前两个参数表示圆心的位置坐标,后两个参数表示圆的外接矩形的宽度和高度

正圆形:

椭圆形:

椭圆形的效果为:


绘制文字(画笔QPen)

在上述画形状的地方改为下面的代码,就可以绘制文字了:

注意理解这里的坐标的位置
此处的 0 横坐标,表示的是 文字最左侧的位置
此处的 100 纵坐标,表示的是文字的"基线位置" (整个字从上到下大约第二个三等分点的位置),也就是下图中红色线的位置:

效果为:

如果觉得字体不符合预期,也可以设置字体和字体大小:

此时效果如下:


通过画笔对象 QPen 设置绘制的形状的颜色信息:
颜色、粗细、样式

还可以设置样式:

下面设置圆形的颜色、粗细、样式:

效果为:


内部填充(画刷QBrush)

画刷QBrush 主要是起到内部填充的效果

除了颜色,还有风格:

在上述画笔的代码中,添加画刷的相关代码:

此时效果为:

上述是采用实心的方式填充的,下面采用其他方式填充:

 

效果为:

此时绿色填充中间就变为绿色的网格线了


绘制图片(QPixmap)

Qt提供了四个类来处理图像数据:Qlmage、QPixmap、QBitmap和 QPicture

它们都是常用的绘图设备

  • 其中Qlmage主要用来进行I/0 处理,它对I/0处理操作进行了优化,而且可以用来直接访问和操作像素
  • OPixmap 主要用来在屏幕上显示图像,它对在屏幕上显示图像进行了优化
  • QBitmap是 QPixmap 的子类,用来处理颜色深度为1的图像,即只能显示黑白两种颜色
  • QPicture 用来记录并重演 OPainter 命令

下面以 QPixmap 为例, 只讲解 QPixmap

先创建一个项目,再创建 qrc 文件,将前面的 cat.png 导入进项目中

同样重写 paintEvent 函数:

效果为:

除了能进行基础的绘制,还能进行图片缩放:

  • 100,100:指的是距离窗口左上角的偏移
  • 400,300:指的是图片缩放的长宽比例

效果为:

还可以进行图片旋转:

  • painter.rotate(180) 是绕着 0,0 坐标系原点进行的旋转,此时旋转的效果看不到小猫图片,因为已经旋转到窗口外面了:

    为了让图片能够显示出来,可以把坐标系原点(Painter 的起点) 平移一下
  • painter.translate(-800, -600) 表示将原点平移到 -800,-600 的位置
    因为原本的坐标系是向右和向下增长的, 现在旋转180度变为向左和向上增长,想让图片显示出来,就需要将图片向右和向下平移,所以x和y需要减小,也就是 -800,-600,此时效果为:

运行程序,效果为:


Qt:绘图API到此学习结束


http://www.kler.cn/a/586210.html

相关文章:

  • 20250314-vue-Props3
  • Free QWQ - 世界首个免费无限制分布式 QwQ API
  • Milvus 中常见相似度度量方法
  • 考研复习,主动学习”与“被动接收”的结合之道
  • Android自动化测试工具
  • 高级java每日一道面试题-2025年2月26日-框架篇[Mybatis篇]-Mybatis是如何将sql执行结果封装为目标对象并返回的?都有哪些映射形式 ?
  • linux 下 ohmyzsh,miniconda 全局安装
  • 本地化语音识别CapsWriter结合内网穿透远程会议录音秒变文字稿
  • Java高频面试之集合-11
  • Day08 实例:3个网站实例探究算法对于密文加密的影响
  • Kafka 消费者组的重平衡
  • 深度学习优化-Gradient Checkpointing
  • ORACLE 19.8版本遭遇ORA-600 [kqrHashTableRemove: X lock].宕机的问题分析
  • CSS:不设定高度的情况,如何让flex下的两个元素的高度一致
  • 历次科技泡沫对人工智能发展的启示与规避措施
  • Python----计算机视觉处理(opencv:图片灰度化)
  • Unity屏幕适配——立项时设置
  • Python使用FastAPI结合Word2vec来向量化200维的语言向量数值
  • 缓存使用的具体场景有哪些?缓存的一致性问题如何解决?缓存使用常见问题有哪些?
  • 蓝思科技冲刺港股上市,双重上市的意欲何为?