Qt QWidget 抗锯齿圆角窗口的一个实现方案(支持子控件)

news2024/10/7 14:24:39

QWidget抗锯齿圆角窗口的一个实现方案

由于 QWidget::setMask 接口设置圆角不支持抗锯齿,所以通常会使用透明窗口加圆角背景,但圆角背景不能满足对子控件的裁剪,子控件与圆角区域重叠的部分还是能显示出来。当然对于大多数窗口,留出足够的边距也是可以接受。

对一些特殊场景,比如QComboBox的列表框,UI设计师强烈要求圆角,列表与它的容器不能有边距,常规办法就很难做到。笔者在经过长时间的研究,有了一个可能的方案。

最终实现效果如下图,可以看到,列表项区域,滚动条区域也能够正常显示圆角。
抗锯齿圆角

注意,该方案可能不适用一些场景:

  1. 特殊的平台或Qt配置
  2. 复杂窗口且有性能要求
  3. 窗口尺寸较大(可以优化)
  4. 有嵌入式窗口、OpenGL、QWindow等

方案

基本原理

Qt的每个独立窗口,默认都是在一张图片上,层叠绘制所有子控件。通常我们自绘控件时,几乎不会使用QPainter::setCompositionMode设置其他混合模式,会出现比较奇怪的效果。但如果使用透明背景窗口,使用混合模式其实跟在QPixmap或QImage上绘制一样。

另外一点,当一个控件重绘时,由于底层的绘制会影响到上层透明合成,所以Qt会从下到上按顺序绘各个控件的脏区域。

所以理论上,如果在一个窗口上增加一个全尺寸的遮罩,重绘时使用混合模式就可以实现对一些像素的清除,且支持抗锯齿。

代码步骤

  1. 创建一个QWidget作为遮罩

    遮罩置于顶层,鼠标设置透传(WA_TransparentForMouseEvents)

    遮罩跟随窗口尺寸大小同步变化,保持一致。安装事件过滤器即可(installEventFilter)

  2. 重写paintEvent,利用混合模式清除圆角像素

    以下绘制逻辑比较直接,建议优化

	//创建一个图片,填充透明色
	QPixmap pix(this->size());
	pix.fill(QColor(0,0,0,0));
	// 在改图片上填充一个圆角区域,需要设置抗锯齿
	QPainter painter(&pix);
	painter.setRenderHint(QPainter::Antialiasing);
	QPainterPath path;
	//这里圆角区域需要根据dpi、size调整
	path.addRoundedRect(QRectF(pix.rect()).adjusted(0.5, 0.5, -0.5, -0.5), 10, 10); 
	painter.fillPath(path, Qt::white);
	painter.end();
	// 在窗口上绘制该圆角图片
	painter.begin(this);
	painter.setRenderHint(QPainter::Antialiasing);
	// 该混合模式会根据source像素的透明度,调整目标的透明度
	painter.setCompositionMode(QPainter::CompositionMode_DestinationIn);
	painter.drawPixmap(0, 0, pix);
	// 恢复默认混合模式,绘制边框,如果没有则不用
	painter.setCompositionMode(QPainter::CompositionMode_SourceOver);
	painter.setPen(QPen(QColor(0xCA64EA), 1.0));
	painter.drawPath(path);

优化方向

  1. 性能优化

    上面的示例,使用了一整张图片对窗口像素进行混合模式的运算,且每次子控件重绘都会引起遮罩的重绘,性能比较差。可以考虑仅在四周设置圆角的遮罩。

  2. 圆角绘制优化

    本文使用了一个不透明的圆角区域对窗口设置裁剪,圆角的参数是固定在代码里的。实际QSS是可以设置窗口的圆角,因此可以借助QSS来生成一张圆角图片,就避免代码里包含固定数值。

    具体实现原理可以参考之前的文章,这里不具体展示了:
    QComboBox文字居中的一种解决办法
    Qt实现一个支持QSS的Switch Button
    Qt借助隐藏控件和QSS绘制重复元素

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/455001.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux-初学者系列——篇幅7_文本编辑和处理命令

文本编辑和处理命令-目录 一、系统基本编辑命令安装vim软件工具包语法格式: 1、vim编辑命令模式01 普通模式02 编辑模式03 命令模式 2、编辑文件技巧01 批量删除多行指定信息02 批量增加多列指定信息03 编辑常见问题错误1:没有指定编辑信息错误2&#xf…

Kubernetes Service、Ingress、Ingress Controller

Kubernetes 网络模型 Kubernetes 对网络设施的基本要求 Pod 能够与所有其它节点上的 Pod 相互通信, 且不需要网络地址转译(NAT) 节点上的代理(比如:系统守护进程、kubelet)可以和节点上的所有 Pod 相互通…

基于Html+Css的图片展示25

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…

SLAM论文速递【SLAM—— RDS-SLAM:基于语义分割方法的实时动态SLAM—4.24(1)

论文信息 题目: RDS-SLAM:Real-Time Dynamic SLAM Using Semantic Segmentation Methods RDS-SLAM:基于语义分割方法的实时动态SLAM论文地址: https://ieeexplore.ieee.org/stamp/stamp.jsp?arnumber9318990发表期刊: IEEE Access ( Volum…

如何发起一次完整的HTTP的请求流程

目录 💡 预备知识 🔊 浏览器端发起 HTTP 请求流程 1、构建请求 2、查找缓存 3、准备IP地址和端口 4、等待TCP队列 5、建立TCP连接 6、发送HTTP请求 🔊 服务器端处理 HTTP 请求流程 1、返回请求 2、断开连接 3、重定向 HTTP 是一种…

【hello Linux】文件时间

目录 1. 简单介绍文件的三个时间: 2. 查看文件时间的命令: 3. makefile的时间编译原理: Linux🌷 1. 简单介绍文件的三个时间: 在Linux中,记录着文件的三方面时间: 1. Access:记…

适合小白的docker实战演示——docker基础入门命令

一、docker简单背景介绍 docker是dotCloud公司开源的一个基于LXC(LXC为Linux Container的简写。Linux Container 容器是一种内核虚拟化技术,可以提供轻量级的虚拟化,以便隔离进程和资源)的高级容器引擎,源码托管在Gith…

JAVA——线程池

目录 一、线程池的概念 二、Java标准库中的线程池 三、ThreadPoolExecutor 类的参数 四、线程池的拒绝策略 五、模拟实现线程池 一、线程池的概念 线程池顾名思义就是集中存储线程的地方——联想一下水池。 线程池是一种多线程处理形式,处理过程中将任务添加到…

PostMan笔记(五)数据监控与压力测试

1. 数据监控 1.1 说明 Postman提供了一种方便的方式来监控API请求和响应数据,以便在测试和开发过程中查看和分析API的性能和功能。数据监控允许您在实时和历史记录中查看API请求和响应数据,并使用图表和统计信息对其进行可视化分析。 1.2 怎么使用数据…

KuiperInfer深度学习推理框架-源码阅读和二次开发(2):算子开发流程(以sigmoid为例)

前言:KuiperInfer是一个从零实现一个高性能的深度学习推理库,中文教程已经非常完善了。本系列博客主要是自己学习的一点笔记和二次开发的教程,欢迎更多的AI推理爱好者一起来玩。这篇写一下算子开发流程,以sigmoid算子为例&#xf…

音视频技术开发周刊 | 290

每周一期,纵览音视频技术领域的干货。 新闻投稿:contributelivevideostack.com。 TCSVT 2022 | 基于环路多帧预测的深度视频压缩 本文基于端到端深度视频压缩框架,提出了一种环路多帧预测模块(in-loop frame prediction module&a…

UV坐标应用范例——计算屏幕坐标作为UV

迷幻角色背景 大家好,我是阿赵。 之前介绍过了经典的Shader写法,物体顶点坐标在顶点程序转换到裁剪空间,然后在片段程序里面通过模型的UV进行贴图采样,然后把颜色显示在模型上面。 之前也介绍过经典的顶点程序应用,树木…

26.Spring-AOP(切面编程)

目录 一、Spring-AOP。 (1)AOP的简介。 (2)AOP的底层实现-动态代理。 (2.1)JDK的动态代理。 (2.2)cglib的动态代理。 (3)AOP的相关概念。 &#xff0…

【Linux】5、使用 Linux 快捷按键小技巧

目录 一、CTRL C二、CTRL D三、history 命令四、CTRL R五、光标移动快捷方式六、清屏 一、CTRL C 🥁 ① 可用于强制停止某些程序的运行 🥁 ② 若命令输入错误,可用它退出当前命令 二、CTRL D 🥁 ① 退出登录的账户 &#…

WEB APIs day2

一、Dom事件基础 1.事件监听&#xff08;绑定&#xff09; 1.1 事件监听 一旦绑定后&#xff0c;这个函数不会立即执行的&#xff0c;事件什么时候触发什么时候执行 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8">…

Pyinstaller打包python文件太大?教你三个小技巧有效减小文件体积

简介 有时候需要在未安装Python环境的平台上运行py程序&#xff0c;使用pyinstaller打包很方便&#xff0c;但打包后的可执行文件实在是太大了。原因在于打包时pyinstaller本就已经关联了很多的python内联模块&#xff0c;加上我们项目中存在过多第三方类库&#xff0c;打包的…

优思学院|质量人如何利用ChatGPT提升工作效率?

在许多人知道怎么用ChatGPT之后&#xff0c;不少人开始思考如何利用这个工具来提升自己的工作效率。 质量人也不例外&#xff0c;在质量管理中&#xff0c;有许多重复的任务需要人手去完成。这些任务可能包括检查文档、审查流程、跟踪错误等。这些任务既耗费时间&#xff0c;又…

MAVEN环境变量配置(Windows 11)

1、直接在搜索框中搜&#xff1a;编辑系统环境变量 2、点击环境变量 3、 在系统变量里面新建系统变量 变量名&#xff1a;MAVEN_HOME 变量值&#xff1a;路径一定要写到maven的bin目录下 以下这种写法是错误的 4、新建系统变量完成 5、 往下滑 找到path&#xff0c;可以双击…

【Python】实战:生成无关联单选问卷 csv《跌倒风险评估量表》

目录 一、适用场景 二、业务需求 三、Python 文件 &#xff08;1&#xff09;创建文件 &#xff08;2&#xff09;代码示例 四、csv 文件 一、适用场景 实战场景&#xff1a; 问卷全部为单选题问卷问题全部为必填问题之间无关联关系每个问题的答案分数不同根据问卷全部问…

亚马逊云科技CodeWhisperer正式可用,面向个人开发者免费开放

亚马逊云科技致力于推动生成式AI技术的普惠化&#xff1a;亚马逊云科技将这些技术从研究和实验领域释放出来&#xff0c;不只是少数初创公司和资金雄厚的大型科技公司&#xff0c;而是让更多公司都能从中受益。因此&#xff0c;亚马逊云科技宣布数项创新&#xff0c;帮助客户更…