自定义实现 PyQt5 下拉复选框 ComboCheckBox
一、前言
由于最近的项目需要具有复选功能,但过多的复选框会影响界面布局和美观,因而想到把 PyQt5 的下拉列表和复选框结合起来,但在 PyQt5 中并没有这样的组件供我们使用,所以想要自己实现一个下拉复选框,主要就是继承 QComboBox 类,然后将复选框 QCheckBox 加入其中,并实现相应的功能。
最终实现的下拉复选框效果如下:
二、代码实现
1.主要方法
在 PyQt5 中,有几个主要的方法需要了解一下,方法名称和对应的含义如下:
- QtWidgets.QComboBox.setView(itemView):设置组合框弹出窗口中使用的视图
,
组合框获取视图的所有权。 - QtWidgets.QcomboBox.setLineEdit(QLineEdit):设置组合框使用的行,而不是当前行编辑窗口小部件。
- QtWidgets.QListWidget.setItemWidget(item, widget):设置
要在给定的 item 中的 widget 组件。
2.具体代码
实现下拉复选框的思路为用 setView() 方法将 QComboBox 下拉列表的视图改为 QListWidget 组件,然后将 QCheckBox 复选框用在 QListWiget 中,具体代码如下:
class ComboCheckBox(QComboBox):
def __init__(self, items: list):
"""
initial function
:param items: the items of the list
"""
super(ComboCheckBox, self).__init__()
self.items = items # items list
self.box_list = [] # selected items
self.text = QLineEdit() # use to selected items
self.text.setReadOnly(True) q = QListWidget()
for i in range(len(self.items)):
self.box_list.append(QCheckBox())
self.box_list[i].setText(self.items[i])
item = QListWidgetItem(q)
q.setItemWidget(item, self.box_list[i])
self.box_list[i].stateChanged.connect(self.show_selected) self.setLineEdit(self.text)
self.setModel(q.model())
self.setView(q) def get_selected(self) -> list:
"""
get selected items
:return:
"""
ret = []
for i in range(len(self.items)):
if self.box_list[i].isChecked():
ret.append(self.box_list[i].text())
return ret def show_selected(self):
"""
show selected items
:return:
"""
self.text.clear()
ret = '; '.join(self.get_selected())
self.text.setText(ret)
其中 show_selected() 用于显示被选中的内容,get_selected() 则用于获取所有被选中的内容并返回。
3.增加全选
要增加全选功能,首先是要在最前面加一个全选的选择框,然后为这个全选的选择框绑定相应的方法,用于实现全选功能和取消全选功能,具体代码如下:
def all_selected(self):
"""
decide whether to check all
:return:
"""
# change state
if self.state == 0:
self.state = 1
for i in range(1, len(self.items)):
self.box_list[i].setChecked(True)
else:
self.state = 0
for i in range(1, len(self.items)):
self.box_list[i].setChecked(False)
self.show_selected()
4.修改样式
由于默认的样式并不美观,所以我们可以对控件的样式进行自定义,例如字体大小、字体粗细等等,例如:
q.setStyleSheet("font-size: 20px; font-weight: bold; height: 40px; margin-left: 5px")
self.setStyleSheet("width: 300px; height: 50px; font-size: 21px; font-weight: bold")
三、完整程序
完善后的下拉复选框的运行程序代码如下:
from PyQt5.QtWidgets import QComboBox, QLineEdit, QListWidgetItem, QListWidget, QCheckBox, \
QApplication, QVBoxLayout, QWidget
import sys class ComboCheckBox(QComboBox):
def __init__(self, items: list):
"""
initial function
:param items: the items of the list
"""
super(ComboCheckBox, self).__init__()
self.items = ["全选"] + items # items list
self.box_list = [] # selected items
self.text = QLineEdit() # use to selected items
self.state = 0 # use to record state q = QListWidget()
for i in range(len(self.items)):
self.box_list.append(QCheckBox())
self.box_list[i].setText(self.items[i])
item = QListWidgetItem(q)
q.setItemWidget(item, self.box_list[i])
if i == 0:
self.box_list[i].stateChanged.connect(self.all_selected)
else:
self.box_list[i].stateChanged.connect(self.show_selected) q.setStyleSheet("font-size: 20px; font-weight: bold; height: 40px; margin-left: 5px")
self.setStyleSheet("width: 300px; height: 50px; font-size: 21px; font-weight: bold")
self.text.setReadOnly(True)
self.setLineEdit(self.text)
self.setModel(q.model())
self.setView(q) def all_selected(self):
"""
decide whether to check all
:return:
"""
# change state
if self.state == 0:
self.state = 1
for i in range(1, len(self.items)):
self.box_list[i].setChecked(True)
else:
self.state = 0
for i in range(1, len(self.items)):
self.box_list[i].setChecked(False)
self.show_selected() def get_selected(self) -> list:
"""
get selected items
:return:
"""
ret = []
for i in range(1, len(self.items)):
if self.box_list[i].isChecked():
ret.append(self.box_list[i].text())
return ret def show_selected(self):
"""
show selected items
:return:
"""
self.text.clear()
ret = '; '.join(self.get_selected())
self.text.setText(ret) class UiMainWindow(QWidget):
def __init__(self):
super(UiMainWindow, self).__init__()
self.setWindowTitle('Test')
self.resize(600, 400)
combo = ComboCheckBox(["Python", "Java", "Go", "C++", "JavaScript", "PHP"])
layout = QVBoxLayout()
layout.addWidget(combo)
self.setLayout(layout) if __name__ == "__main__":
app = QApplication(sys.argv)
ui = UiMainWindow()
ui.show()
sys.exit(app.exec_())
自定义实现 PyQt5 下拉复选框 ComboCheckBox的更多相关文章
- 同上! 下拉复选框 点击当前的checkbox 选中后面li 添加到指定区域
(function() { $(".cxbtntj").click(function(){ console.log($("#jsLi1").attr(" ...
- finereport 下拉复选框多选
- Jquery 插件 chosen_v1.8.7 下拉复选框带搜索功能
地址:https://harvesthq.github.io/chosen/ 效果: 因为只需要这个功能,就只研究这个功能了,代码: <!doctype html> <html la ...
- 我的第一个jquery插件:下拉多选框
<!DOCTYPE HTML> <html> <head> <title> New Document </title> <meta n ...
- 品优购商城项目(二)AngularJS、自动代码生成器、select2下拉多选框
品优购商城想项目第二阶段 AngularJS.自动代码生成器.select2下拉多选框 完成了课程第三天.第四天的的任务. 1.学习了AngularJs前端的mvc分层思想,js部分分成control ...
- 使用jQuery为文本框、单选框、多选框、下拉框、下拉多选框设值及返回值的处理
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- angular2.x 下拉多选框选择组件
angular2.x - 5.x 的下拉多选框选择组件 ng2 -- ng5.最近在学angular4,经常在交流群看见很多人问 下拉多选怎么做... 今天就随便写的个. 组件源码 百度云 链接: ...
- 自己用ul模拟实现下拉多选框,
模拟实现下拉多选框 效果如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
- jquery--获取多选框的值、获取下拉多选框的值
获取多选框的值 var packageCodeList=new Array(); $('#server_id:checked').each(function(){ packageCodeList.pu ...
随机推荐
- Python---7函数(调用&定义函数)
函数 Python内置了很多有用的函数,我们可以直接调用. 要调用一个函数,需要知道函数的名称和参数,比如求绝对值的函数abs(),只有一个参数.可以直接从Python的官方网站查看文档: http: ...
- Python如何规避全局解释器锁(GIL)带来的限制
编程语言分类概念介绍(编译型语言.解释型语言.静态类型语言.动态类型语言概念与区别) https://www.cnblogs.com/zhoug2020/p/5972262.html Python解释 ...
- GCD学习 —— 三
学习学习dispatch_block,在向队列中添加任务时,可以直接在对应的函数中添加 block.但是如果想对任务进行操作,比如监听任务.取消任务,就需要获取对应的 block. 1 创建Blo ...
- Go基础学习(二)
数组[array] 数组定义[定义后长度不可变] 12 symbol := [...]string{USD: "$", EUR: "€", GBP: " ...
- 聊聊RabbitMQ那一些事儿之一基础应用
聊聊RabbitMQ那一些事儿之一基础应用 Hi,各位热爱技术的小伙伴您们好,今年的疫情害人啊,真心祝愿您和您的家人大家都平平安安,健健康康.年前到现在一直没有总结点东西,写点东西,不然久了自己感觉自 ...
- BEM命名及其在sass中的实践
Why use it 近几年web应用的发展可以用疯狂来形容,依靠浏览器的支持以及前端技术和框架的发展,很多应用已经把大量的逻辑从服务器端迁移到了浏览器端,使用前后端分离技术,浏览器端与用户进行交互来 ...
- zookeeper伪集群搭建
zookeeper伪集群搭建 1. 下载zookeeper: https://zookeeper.apache.org/ 2. 解压: tar -zxvf zookeeper-3.4.14.tar.g ...
- WEB渗透 - XSS
听说这个时间点是人类这种生物很重要的一个节点 cross-site scripting 跨站脚本漏洞 类型 存储型(持久) 反射型(非持久) DOM型 利用 先检测,看我们输入的内容是否有返回以及有无 ...
- 【vue】---- 图片懒加载
1.作用 在图片较多的页面中,页面加载性能较差.使用图片懒加载可以让图片出现在可视区域时再进行加载,从而提高用户体验. 2.原理 设置img标签的src属性为空或统一的图片路径(如加载中样式),监听页 ...
- web实验二 ---通过jQuery实现用户注册身份验证
通过jQuery实现用户注册身份验证,当每个文本框失去焦点时进行该文本框内容校验,并将校验信息在文本框右侧显示出结果. 具体校验要求: 1.用户名由6-18位字符组成 2.密码由6-18位字符组成,且 ...