入门 PyQt6 看过来（案例）13~ 制作一个颜色调节器

本文给大家带来一个利用pyqt制作的颜色调节器，通过拨动滚动条或者旋钮就可以调整rgb三色进行颜色的微调，效果如下：

本文实现的是不同的UI设计，实现的相同的功能，我们先分析以下思路：

  • 首先进行UI页面设计
  • 分析颜色如何进行调整的逻辑
  • 将改动的数据反馈到UI页面

先看左侧的滚动条的功能：

1 UI页面设计

首先，创建QLabel来显示颜色变换的舞台，并指定默认为红色背景，以及创建lb2来显示数据的变化。

		self.lb = QLabel()# 设置标签的背景色self.lb.setAutoFillBackground(True)palette = self.lb.palette()palette.setColor(self.lb.backgroundRole(), QColor(255, 0, 0))  # 红色背景self.lb.setPalette(palette)self.lb2=QLabel()self.lb2.setText("颜色值：(255, 0, 0)")

​

​

接下来，创建滑块，这里的滑块需要三个，分别代表红绿蓝的数据，并通过改变滑块来实现红绿蓝三色的数字变化。

		self.s1 = QScrollBar()self.s1.setMaximum(255)self.s1.sliderMoved.connect(self.sliderval)self.s2=QScrollBar()self.s2.setMaximum(255)self.s2.sliderMoved.connect(self.sliderval)self.s3 = QScrollBar()self.s3.setMaximum(255)self.s3.sliderMoved.connect(self.sliderval)

2 数据改变函数

咱们通过配置槽函数sliderval来修改颜色值，并以palette调色板的方式返回到self.lb上，就可以实现了颜色随数字的变化而变化了。

    def sliderval(self):print(self.s1.value(),self.s2.value(),self.s3.value())palette = self.lb.palette()palette.setColor(self.lb.backgroundRole(), QColor(self.s1.value(), self.s2.value(), self.s3.value()))  # 红色背景self.lb.setPalette(palette)self.lb2.setText("颜色值：(%s, %s, %s)" % (self.s1.value(),self.s2.value(),self.s3.value()))

​

3 完整代码

为了方便大家的实现和学习，完整代码贴上。（爱看不看，不看拉到！）

# -*- coding:utf-8 -*-
"""
------------------------------------------------
File Name: 滚动条.py
Description:
Author: lzq
date:2024-07-27 19:16
------------------------------------------------
"""
import sysfrom PyQt6.QtGui import QColor
from PyQt6.QtWidgets import QDialog, QPushButton, QVBoxLayout, QApplication, QWidget, QHBoxLayout, QScrollBar, QLabelclass MyWidget(QWidget):def __init__(self, parent=None):super(MyWidget, self).__init__(parent)self.setWindowTitle("滚动条QScrollBar测试")self.resize(500,150)self.lb = QLabel()# 设置标签的背景色self.lb.setAutoFillBackground(True)palette = self.lb.palette()palette.setColor(self.lb.backgroundRole(), QColor(255, 0, 0))  # 红色背景self.lb.setPalette(palette)self.lb2=QLabel()self.lb2.setText("颜色值：(255, 0, 0)")hbox=QHBoxLayout()self.s1 = QScrollBar()self.s1.setMaximum(255)self.s1.sliderMoved.connect(self.sliderval)self.s2=QScrollBar()self.s2.setMaximum(255)self.s2.sliderMoved.connect(self.sliderval)self.s3 = QScrollBar()self.s3.setMaximum(255)self.s3.sliderMoved.connect(self.sliderval)hbox.addWidget(self.lb)hbox.addWidget(self.lb2)hbox.addWidget(self.s1)hbox.addWidget(self.s2)hbox.addWidget(self.s3)self.setGeometry(500,200,500,300)self.setLayout(hbox)def sliderval(self):print(self.s1.value(),self.s2.value(),self.s3.value())palette = self.lb.palette()palette.setColor(self.lb.backgroundRole(), QColor(self.s1.value(), self.s2.value(), self.s3.value()))  # 红色背景self.lb.setPalette(palette)self.lb2.setText("颜色值：(%s, %s, %s)" % (self.s1.value(),self.s2.value(),self.s3.value()))if __name__=='__main__':app = QApplication(sys.argv)w = MyWidget()w.show()sys.exit(app.exec())

接下来我们来学习下右侧的旋钮实现的颜色调节器的功能：

4 同样先进性UI设计

先创建一个文本颜色标签，用来展示随着rgb变化而变化的颜色，这是舞台。

 		self.labelColor = QLabel()# 设置标签的背景色self.labelColor.setAutoFillBackground(True)palette = self.labelColor.palette()palette.setColor(self.labelColor.backgroundRole(), QColor(255, 0, 0))  # 红色背景self.labelColor.setPalette(palette)self.ltk = QLabel()self.ltext = QLabel()self.ltext.setText("颜色值：(255, 0, 0)")

接着创建旋钮，旋钮是QDial类的实例。我们在旋钮下方配置旋钮变化的数字标签。

		#左侧旋钮，代表红色self.dial = QDial()self.dial.setRange(0,255)self.dial.setNotchesVisible(True)self.dial.valueChanged.connect(self.onDialValueChanged)#左侧旋钮下标签文字，默认为0self.lb = QLabel('0', self)self.lb.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb.setFont(QFont('Arial Black', 16))#中间旋钮，代表绿色self.dial2 = QDial()self.dial2.setRange(0, 255)self.dial2.setNotchesVisible(True)self.dial2.valueChanged.connect(self.onDialValueChanged)#中间旋钮下标签文字，默认为0self.lb2 = QLabel('0', self)self.lb2.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb2.setFont(QFont('Arial Black', 16))#右侧旋钮，代表蓝色self.dial3 = QDial()self.dial3.setRange(0, 255)self.dial3.setNotchesVisible(True)self.dial3.valueChanged.connect(self.onDialValueChanged)#右侧旋钮下标签文字，默认为0self.lb3=QLabel('0',self)self.lb3.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb3.setFont(QFont('Arial Black',16))

此时，所有的按钮和页面都搞好了，但是有个问题，不知道你注意没有：

1 旋钮在上，文字在下。怎么实现？

2 旋钮和文字又和显示颜色的那部分控件位置不一样，怎么实现？

很简单，先回答问题1：我们通过添加垂直布局，就可以实现旋钮在上，文字在下了。不是很easy吗？

但是问题2呢？此时你就得考虑嵌套布局了。

看代码，这个是实现问题1的旋钮在上，文字在下布局。

		#创建水平布局，把所哟的旋钮在上文字在线的垂直布局当成儿子放进去hlayout = QHBoxLayout(self)vlayout = QVBoxLayout(self)vlayout.addWidget(self.dial)vlayout.addWidget(self.lb)vlayout2 = QVBoxLayout(self)vlayout2.addWidget(self.dial2)vlayout2.addWidget(self.lb2)vlayout3 = QVBoxLayout(self)vlayout3.addWidget(self.dial3)vlayout3.addWidget(self.lb3)hlayout.addLayout(vlayout)hlayout.addLayout(vlayout2)hlayout.addLayout(vlayout3)

这里是颜色显示处的布局：

 		textVlayout = QVBoxLayout()textVlayout.addWidget(self.labelColor)textVlayout.addWidget(self.ltext)textVlayout.addWidget(self.ltk)

此时，我们得到的布局有两个：按钮组对应的水平布局，和颜色显示组对应的垂直布局。如果我们现在再来一个大的布局，把这些孙子都装进去，那不就搞定了吗？

		#创建爷爷级布局，把前面的孙子儿子布局都装进去，就搞定了ww_layout = QVBoxLayout(self)ww_layout.addLayout(textVlayout)ww_layout.addLayout(hlayout)self.setLayout(ww_layout)

​

注意：布局这一块，很容易让人迷糊，因此要多思考，最好找张草稿纸画一下。

逻辑槽函数和第一个案例的滑块相似，不卖关子了，直接贴出来：

    def onDialValueChanged(self):self.lb.setText(str(self.dial.value()))self.lb2.setText(str(self.dial2.value()))self.lb3.setText(str(self.dial3.value()))palette = self.labelColor.palette()palette.setColor(self.labelColor.backgroundRole(), QColor(self.dial.value(), self.dial2.value(), self.dial3.value()))  # 红色背景self.labelColor.setPalette(palette)self.ltext.setText("颜色值：(%s, %s, %s)" % (self.dial.value(), self.dial2.value(), self.dial3.value()))

5 完整代码2

这时候就完成了所有的功能，完整代码列出来：

# -*- coding:utf-8 -*-
"""
------------------------------------------------
File Name: 旋钮.py
Description:
Author: lzq
date:2024-07-27 19:50
------------------------------------------------
"""
import sysfrom PyQt6.QtCore import Qt
from PyQt6.QtGui import QFont, QColor
from PyQt6.QtWidgets import QDialog, QPushButton, QVBoxLayout, QApplication, QWidget, QDial, QLabel, QHBoxLayoutclass MyWidget(QWidget):def __init__(self, parent=None):super(MyWidget, self).__init__(parent)self.setWindowTitle("QDial旋钮测试")self.resize(330,100)ww_layout = QVBoxLayout(self)self.labelColor = QLabel()# 设置标签的背景色self.labelColor.setAutoFillBackground(True)palette = self.labelColor.palette()palette.setColor(self.labelColor.backgroundRole(), QColor(255, 0, 0))  # 红色背景self.labelColor.setPalette(palette)self.ltk = QLabel()self.ltext = QLabel()self.ltext.setText("颜色值：(255, 0, 0)")textVlayout = QVBoxLayout()textVlayout.addWidget(self.labelColor)textVlayout.addWidget(self.ltext)textVlayout.addWidget(self.ltk)self.dial = QDial()self.dial.setRange(0,255)self.dial.setNotchesVisible(True)self.dial.valueChanged.connect(self.onDialValueChanged)self.lb = QLabel('0', self)self.lb.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb.setFont(QFont('Arial Black', 16))self.dial2 = QDial()self.dial2.setRange(0, 255)self.dial2.setNotchesVisible(True)self.dial2.valueChanged.connect(self.onDialValueChanged)self.lb2 = QLabel('0', self)self.lb2.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb2.setFont(QFont('Arial Black', 16))self.dial3 = QDial()self.dial3.setRange(0, 255)self.dial3.setNotchesVisible(True)self.dial3.valueChanged.connect(self.onDialValueChanged)self.lb3=QLabel('0',self)self.lb3.setAlignment(Qt.AlignmentFlag.AlignCenter)self.lb3.setFont(QFont('Arial Black',16))hlayout = QHBoxLayout(self)vlayout = QVBoxLayout(self)vlayout.addWidget(self.dial)vlayout.addWidget(self.lb)vlayout2 = QVBoxLayout(self)vlayout2.addWidget(self.dial2)vlayout2.addWidget(self.lb2)vlayout3 = QVBoxLayout(self)vlayout3.addWidget(self.dial3)vlayout3.addWidget(self.lb3)hlayout.addLayout(vlayout)hlayout.addLayout(vlayout2)hlayout.addLayout(vlayout3)# self.setLayout(hlayout)ww_layout.addLayout(textVlayout)ww_layout.addLayout(hlayout)self.setLayout(ww_layout)def onDialValueChanged(self):self.lb.setText(str(self.dial.value()))self.lb2.setText(str(self.dial2.value()))self.lb3.setText(str(self.dial3.value()))palette = self.labelColor.palette()palette.setColor(self.labelColor.backgroundRole(), QColor(self.dial.value(), self.dial2.value(), self.dial3.value()))  # 红色背景self.labelColor.setPalette(palette)self.ltext.setText("颜色值：(%s, %s, %s)" % (self.dial.value(), self.dial2.value(), self.dial3.value()))if __name__=='__main__':app = QApplication(sys.argv)w = MyWidget()w.show()sys.exit(app.exec())

本文到此结束，有本事你就别点赞，别关注我。路老师一生清贫，上有老下有小，让我一个人默默的付出吧！

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

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

SSL/TLS和SSL VPN

SSL/TLS和SSL VPN

1、SSL/TLS SSL安全套接字层：是一种加密协议，用于在网络通信中建立安全连接。它在应用层和传输层（TCP/IP）之间提供数据加密、服务器身份验证以及信息完整性验证 SSL只保护TCP流量，不保护UDP协议 TLS：传输层…
阅读更多...
VulnHub：cengbox1

VulnHub：cengbox1

靶机下载地址，下载完成后，用VirtualBox打开靶机并修改网络为桥接即可搭建成功。 信息收集 主机发现和端口扫描 扫描攻击机（192.168.31.218）同网段存活主机确认目标机ip，并对目标机进行全面扫描。 nmap 192.168.31.…
阅读更多...
【VS2019安装+QT配置】

【VS2019安装+QT配置】

【VS2019安装QT配置】 1. 前言2. 下载visual studio20193. visual studio2019安装4. 环境配置4.1 系统环境变量配置4.2 qt插件开发 5. Visual Studio导入QT项目6. 总结 1. 前言 前期安装了qt，发现creator编辑器并不好用，一点都不时髦。在李大师的指导下&…
阅读更多...
[网鼎杯 2020 朱雀组]Nmap（详细解读版）

[网鼎杯 2020 朱雀组]Nmap（详细解读版）

这道题考察nmap的一些用法,以及escapeshellarg和escapeshellcmd两个函数的绕过，可以看这里PHP escapeshellarg()escapeshellcmd() 之殇 (seebug.org) 两种解题方法： 第一种通过nmap的-iL参数读取扫描一个文件到指定文件中第二种是利用nmap的参数写入we…
阅读更多...
昇思25天学习打卡营第1天|快速入门-构建基于MNIST数据集的手写数字识别模型

昇思25天学习打卡营第1天|快速入门-构建基于MNIST数据集的手写数字识别模型

非常感谢华为昇思大模型平台和CSDN邀请体验昇思大模型！从今天起，我将以打卡的方式，结合原文搬运和个人思考，分享25天的学习内容与成果。为了提升文章质量和阅读体验，我会将思考部分放在最后，供大家探索讨论…
阅读更多...
java-数据结构与算法-02-数据结构-05-栈

java-数据结构与算法-02-数据结构-05-栈

文章目录 1. 栈1. 概述2. 链表实现3. 数组实现4. 应用 2. 习题E01. 有效的括号-Leetcode 20E02. 后缀表达式求值-Leetcode 120E03. 中缀表达式转后缀E04. 双栈模拟队列-Leetcode 232E05. 单队列模拟栈-Leetcode 225 1. 栈 1. 概述 计算机科学中，stack 是一种线性的…
阅读更多...
[python游戏开发]用Python代码制作中国象棋游戏，适合新手小白练手

[python游戏开发]用Python代码制作中国象棋游戏，适合新手小白练手

Pygame 做的中国象棋，一直以来喜欢下象棋，写了 python 就拿来做一个试试，水平有限，希望源码能帮助大家更好的学习 python。总共分为四个文件，chinachess.py 为主文件，constants.py 数据常量，pie…
阅读更多...
新版海螺影视主题模板M3.1全解密版本多功能苹果CMSv10后台自适应主题

新版海螺影视主题模板M3.1全解密版本多功能苹果CMSv10后台自适应主题

苹果CMS2022新版海螺影视主题M3.1版本，这个主题我挺喜欢的，之前也有朋友给我提供过原版主题，一直想要破解但是后来找了几个SG11解密的大哥都表示解密需要大几百大洋，所以一直被搁置了。这个版本是完全解密的，无需SG11加…
阅读更多...
前端模块化CommonJS、AMD、CMD、ES6

前端模块化CommonJS、AMD、CMD、ES6

在前端开发中，模块化是一种重要的代码组织方式，它有助于将复杂的代码拆分成可管理的小块，提高代码的可维护性和可重用性。CommonJS、AMD（异步模块定义）和CMD（通用模块定义）是三种不同的模块规范…
阅读更多...
1、hadoop环境搭建

1、hadoop环境搭建

1、环境配置 ip(/etc/sysconfig/network-scripts) # 网卡1 DEVICEeht0 TYPEEthernet ONBOOTyes NM_CONTROLLEDyes BOOTPROTOstatic IPADDR192.168.59.11 GATEWAY192.168.59.1 NETMASK 255.255.255.0 # 网卡2 DEVICEeht0 TYPEEthernet ONBOOTyes NM_CONTROLLEDyes BOOTPROTOdh…
阅读更多...
【React1】React概述、基本使用、脚手架、JSX、组件

【React1】React概述、基本使用、脚手架、JSX、组件

文章目录 1. React基础1.1 React 概述1.1.1 什么是React1.1.2 React 的特点声明式基于组件学习一次，随处使用1.2 React 的基本使用1.2.1 React的安装1.2.2 React的使用1.2.3 React常用方法说明React.createElement()ReactDOM.render()1.3 React 脚手架的使用1.3.1 React 脚手架…
阅读更多...
基于tkinter的学生信息管理系统之登录界面和主界面菜单设计

基于tkinter的学生信息管理系统之登录界面和主界面菜单设计

目录 一、tkinter的介绍 二、登陆界面的设计 1、登陆界面完整代码 2、部分代码讲解 3、登录的数据模型设计 4、效果展示 三、学生主界面菜单设计 1、学生主界面菜单设计完整代码 2、 部分代码讲解 3、效果展示 四、数据库的模型设计 欢迎大家进来学习和支持&#xff01…
阅读更多...
从食堂采购系统源码到成品：打造供应链采购管理平台实战详解

从食堂采购系统源码到成品：打造供应链采购管理平台实战详解

本篇文章，笔者将详细介绍如何从食堂采购系统的源码开始，逐步打造一个完备的供应链采购管理平台，帮助企业实现采购流程的智能化和高效化。 一、需求分析与规划 一般来说，食堂采购系统需要具备以下基本功能： 1.供应商…
阅读更多...
第15周 Zookeeper分布式锁与变种多级缓存

第15周 Zookeeper分布式锁与变种多级缓存

1. Zookeeper介绍 1.1 介绍 1.2 应用场景简介 1.3 zookeeper工作原理 1.4 zookeeper特点
阅读更多...
AI的欺骗游戏：揭示多模态大型语言模型的易受骗性

AI的欺骗游戏：揭示多模态大型语言模型的易受骗性

人工智能咨询培训老师叶梓 转载标明出处 多模态大型语言模型（MLLMs）在处理包含欺骗性信息的提示时容易生成幻觉式响应。尤其是在生成长响应时，仍然是一个未被充分研究的问题。来自 Apple 公司的研究团队提出了MAD-Bench，一个包含8…
阅读更多...
DLMS/COSEM中公开密钥算法的使用_椭圆曲线加密法

DLMS/COSEM中公开密钥算法的使用_椭圆曲线加密法

1.概述 椭圆曲线密码涉及有限域上的椭圆曲线上的算术运算。椭圆曲线可以定义在任何数字域上(实数、整数、复数)，但在密码学中，椭圆曲线最常用于有限素数域。 素数域上的椭圆曲线由一组实数(x, y)组成，满足以下等式: 方程的所有解的集合构成…
阅读更多...
内网漏扫工具fscan

内网漏扫工具fscan

一、介绍： fscan是一款内网综合扫描工具，方便一键自动化、全方位漏扫扫描。支持主机存活探测、端口扫描、常见服务的爆破、ms17010、redis批量写公钥、计划任务反弹shell、读取win网卡信息、web指纹识别、web漏洞扫描、netbios探测、域控识别等功能。 …
阅读更多...
Pytorch使用教学8-张量的科学运算

Pytorch使用教学8-张量的科学运算

在介绍完PyTorch中的广播运算后，继续为大家介绍PyTorch的内置数学运算： 首先对内置函数有一个功能印象，知道它的存在，使用时再查具体怎么用其次，我还会介绍PyTorch科学运算的注意事项与一些实用小技巧 1 基本数学运算…
阅读更多...
【高中数学/反比例函数/增减区间】从熟悉的y=1/x到陌生的y=x/(1-x)的演变

【高中数学/反比例函数/增减区间】从熟悉的y=1/x到陌生的y=x/(1-x)的演变

【题目】 求yx/(1-x)的递增区间？ 【解答】 此问题只要能画出yx/(1-x)的大致图像就能解答，首先我们需要将分式化简： yx/(1-x)(x-11)/(1-x)-11/(1-x) 从新的函数式中我们可以判断这也是一个反比例函数，可以从y1/x演变过来。 下…
阅读更多...
vue2和el-input无法修改和写入，并且不报错

vue2和el-input无法修改和写入，并且不报错

文章目录 一. 业务场景描述二. 原因分析三.解决方案3.1 方案一 原生标签（不建议）3.2 方案二 父子传递（不建议）3.3 方案三 vuex，pinia 状态传值（不建议）3.4 方案四 vue初始化属性 （建…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023