码迷,mamicode.com
首页 > 其他好文 > 详细

【PyQt5-Qt Designer】工具箱(QToolBox)控件的使用

时间:2019-01-05 20:05:21      阅读:1002      评论:0      收藏:0      [点我收藏+]

标签:type   reading   继承   edit   obj   bin   nec   frame   enabled   

工具箱(QToolBox)+toolButton+tabWidget

总体介绍

QToolBox类提供了一列选项卡的小部件(选项卡内含项目)。

 

工具箱是一个小部件,它将选项卡一个一个的显示,当前项目显示在当前选项卡下方。每个选项卡在选项卡列中都有一个索引位置。一个选项卡的项目是一个QWidget。

 

每个项目都有一个itemText(),一个可选的itemIcon(),一个可选的itemToolTip()和一个widget()。项目的属性可以通过setItemText(),setItemIcon()和setItemToolTip()来改变。每个项目都可以使用setItemEnabled()单独启用或禁用。

 

项目使用addItem()添加,或使用insertItem()插入特定位置。项目总数由count()给出。可以删除项目,或使用removeItem()从工具箱中删除项目。通过组合removeItem()和insertItem(),您可以将项目移动到不同的位置。

 

当前项目小部件的索引由currentIndex()返回,并用setCurrentIndex()设置。可以使用indexOf()来找到特定项目的索引,并且item()返回给定索引处的项目。

 

currentChanged()信号在当前项目改变时发出。

 

更多详细的介绍,请见官网:QToolBox Class | Qt Widgets 5.10

类的归属

PyQt5->QtWidgets->QToolBox

继承:QFrame

小例子

我们先通过一个视频来看一下今天的完成效果:

https://v.vzuu.com/video/942417282891333632
技术分享图片
  • 核心代码
class Example(QToolBox):

    def initUI(self):
        self.resize(280,500)
        self.setWindowTitle(微信公众号:学点编程吧--QToolBox)
        self.setWindowFlags(Qt.Dialog)

        favorites =[
                        [
                            {des:百度搜索, pic:image/se/baidu.ico},
                            {des:搜狗搜索, pic:image/se/sougo.ico},
                            {des:必应搜索, pic:image/se/bing.ico},
                            {des:360搜索, pic:image/se/360.ico},
                            {des:谷歌搜索, pic:image/se/google.ico},
                            {des:雅虎搜索, pic:image/se/yahoo.ico}
                        ],
                        [
                            {des:腾讯视频, pic:image/v/tengxun.ico},
                            {des:搜狐视频, pic:image/v/sohuvideo.ico},
                            {des:优酷视频, pic:image/v/youku.ico},
                            {des:土豆视频, pic:image/v/tudou.ico},
                            {des:AcFun弹幕, pic:image/v/acfun.ico},
                            {des:哔哩哔哩, pic:image/v/bilibili.ico}
                        ]
        ]
        for item in favorites:
            groupbox = QGroupBox()
            vlayout = QVBoxLayout(groupbox)
            vlayout.setAlignment(Qt.AlignCenter) 
            for category in item:
                toolButton = QToolButton()
                toolButton.setText(category[des])
                toolButton.setIcon(QIcon(category[pic]))
                toolButton.setIconSize(QSize(64, 64))
                toolButton.setAutoRaise(True)
                toolButton.setToolButtonStyle(Qt.ToolButtonTextUnderIcon)
                vlayout.addWidget(toolButton)
                name = category[des]  
                toolButton.clicked.connect(Branded Short Domain Powered by Bitly)
                if name == 雅虎搜索:
                    self.addItem(groupbox,搜索引擎)
                else:
                    self.addItem(groupbox,视频网站)
    def run(self):
        if self.sender().text() == 百度搜索:
            webbrowser.open(https://www.baidu.com)
        elif self.sender().text() == 搜狗搜索:
            webbrowser.open(https://www.sogou.com/)
        #...下面的代码和上面差不多,不再描述

在这个例子当中我们实现了以下的功能:

  1. 将按钮分类搜索和视频两类,并分别集合到不同选项卡中。
  2. 点击按钮会打开对应的网址
  • 代码解析
favorites =[
                [
                    {des:百度搜索, pic:image/se/baidu.ico},
                    {des:搜狗搜索, pic:image/se/sougo.ico},
                    {des:必应搜索, pic:image/se/bing.ico},
                    {des:360搜索, pic:image/se/360.ico},
                    {des:谷歌搜索, pic:image/se/google.ico},
                    {des:雅虎搜索, pic:image/se/yahoo.ico}
                ],
                [
                    {des:腾讯视频, pic:image/v/tengxun.ico},
                    {des:搜狐视频, pic:image/v/sohuvideo.ico},
                    {des:优酷视频, pic:image/v/youku.ico},
                    {des:土豆视频, pic:image/v/tudou.ico},
                    {des:AcFun弹幕, pic:image/v/acfun.ico},
                    {des:哔哩哔哩, pic:image/v/bilibili.ico}
                ]
        ]

因为在程序中我们涉及到了12个按钮,每个按钮显示的图标和名称是不一样的,如果我建立12个按钮对象,再分别设置太麻烦了。

因此 我将不同的部分抽取出来,每一个按钮对应一个字典,而每一类按钮又组合成一个列表,最后将两个不同的列表组合成一个大的列表。

for item in favorites:

将favorites列表中的item进行遍历,每个item代表一个众多按钮的集合,也就是QToolBox的选项卡。

groupbox = QGroupBox()
vlayout = QVBoxLayout(groupbox)
vlayout.setAlignment(Qt.AlignCenter)

我们新建一个组合框,并对其进行垂直布局,布局方式为居中。

QGroupBox小部件提供了一个带有标题的组合框。一个组合框提供了一个框架,顶部的标题,一个键盘快捷键,并显示其内部的各种其他小部件(这点就是我们用到的)。

Qt.AlignCenter是一种对齐方式,我们在

学点编程吧:PyQt5系列教程(21):标签(QLabel)?zhuanlan.zhihu.com  中介绍过,这里就不在详解了。

for category in item:
    toolButton = QToolButton()
    toolButton.setText(category[des])
    toolButton.setIcon(QIcon(category[pic]))
    toolButton.setIconSize(QSize(64, 64))
    toolButton.setAutoRaise(True)
    toolButton.setToolButtonStyle(Qt.ToolButtonTextUnderIcon)
    vlayout.addWidget(toolButton)

这里我们对每个按钮集合中项目进行遍历。新建QToolBox对象,并设置其相应的属性:显示的名称(是“优酷”还是“哔哩哔哩”)、图标及大小、按钮是否自动浮起、让按钮显示的名称在按钮下方,同时将这个按钮增加到垂直布局当中。

更多关于QToolButton的介绍,请参见

学点编程吧:PyQt5系列教程(23):工具按钮(QToolButton)?zhuanlan.zhihu.com

    name = category[des]
    if name == 雅虎搜索:
        self.addItem(groupbox,搜索引擎)
    else:
        self.addItem(groupbox,视频网站)

当我们遍历完一个按钮集合的时候,此时我们判断最后一个按钮显示的文字是“搜索引擎”还是“视频网站”,并将这一系列的按钮增加到一个选项卡中。

toolButton.clicked.connect(self.run)
def run(self):
    if self.sender().text() == 百度搜索:
        webbrowser.open(https://www.baidu.com)
    elif self.sender().text() == 搜狗搜索:
        webbrowser.open(https://www.sogou.com/)
    #...下面的代码和上面差不多,不在描述

这个就是一个常规的信号与槽函数的调用,当我们点击按钮的时候会打开相应的网站。

 

我参照了上面大佬的代码自己用eric6 敲了一遍

效果如下:

技术分享图片

完整代码:

技术分享图片
  1 # -*- coding: utf-8 -*-
  2 
  3 # Form implementation generated from reading ui file ‘D:\360Downloads\Python编程\PyQt5教程\PyQt5学习资料\PyQt5内容显示系列控件\eric6-QToolBox\toolBox.ui‘
  4 #
  5 # Created by: PyQt5 UI code generator 5.11.3
  6 #
  7 # WARNING! All changes made in this file will be lost!
  8 
  9 from PyQt5 import QtCore, QtGui, QtWidgets
 10 
 11 class Ui_Dialog(object):
 12     def setupUi(self, Dialog):
 13         Dialog.setObjectName("Dialog")
 14         Dialog.resize(513, 465)
 15         Dialog.setSizeGripEnabled(True)
 16         self.verticalLayout = QtWidgets.QVBoxLayout(Dialog)
 17         self.verticalLayout.setObjectName("verticalLayout")
 18         self.tabWidget = QtWidgets.QTabWidget(Dialog)
 19         self.tabWidget.setMinimumSize(QtCore.QSize(0, 361))
 20         self.tabWidget.setStyleSheet("font: 75 14pt \"微软雅黑\";")
 21         self.tabWidget.setObjectName("tabWidget")
 22         self.tabWidgetPage1 = QtWidgets.QWidget()
 23         self.tabWidgetPage1.setObjectName("tabWidgetPage1")
 24         self.gridLayout_2 = QtWidgets.QGridLayout(self.tabWidgetPage1)
 25         self.gridLayout_2.setObjectName("gridLayout_2")
 26         self.toolButton = QtWidgets.QToolButton(self.tabWidgetPage1)
 27         icon = QtGui.QIcon()
 28         icon.addPixmap(QtGui.QPixmap("../image/se/百度.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 29         self.toolButton.setIcon(icon)
 30         self.toolButton.setIconSize(QtCore.QSize(80, 80))
 31         self.toolButton.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 32         self.toolButton.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 33         self.toolButton.setAutoRaise(True)
 34         self.toolButton.setObjectName("toolButton")
 35         self.gridLayout_2.addWidget(self.toolButton, 1, 0, 1, 1)
 36         self.toolButton_2 = QtWidgets.QToolButton(self.tabWidgetPage1)
 37         icon1 = QtGui.QIcon()
 38         icon1.addPixmap(QtGui.QPixmap("../image/se/360.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 39         self.toolButton_2.setIcon(icon1)
 40         self.toolButton_2.setIconSize(QtCore.QSize(80, 80))
 41         self.toolButton_2.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 42         self.toolButton_2.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 43         self.toolButton_2.setAutoRaise(True)
 44         self.toolButton_2.setObjectName("toolButton_2")
 45         self.gridLayout_2.addWidget(self.toolButton_2, 1, 1, 1, 1)
 46         self.toolButton_3 = QtWidgets.QToolButton(self.tabWidgetPage1)
 47         icon2 = QtGui.QIcon()
 48         icon2.addPixmap(QtGui.QPixmap("../image/se/bing.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 49         self.toolButton_3.setIcon(icon2)
 50         self.toolButton_3.setIconSize(QtCore.QSize(80, 80))
 51         self.toolButton_3.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 52         self.toolButton_3.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 53         self.toolButton_3.setAutoRaise(True)
 54         self.toolButton_3.setObjectName("toolButton_3")
 55         self.gridLayout_2.addWidget(self.toolButton_3, 1, 2, 1, 1)
 56         self.toolButton_4 = QtWidgets.QToolButton(self.tabWidgetPage1)
 57         icon3 = QtGui.QIcon()
 58         icon3.addPixmap(QtGui.QPixmap("../image/se/sougo.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 59         self.toolButton_4.setIcon(icon3)
 60         self.toolButton_4.setIconSize(QtCore.QSize(80, 80))
 61         self.toolButton_4.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 62         self.toolButton_4.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 63         self.toolButton_4.setAutoRaise(True)
 64         self.toolButton_4.setObjectName("toolButton_4")
 65         self.gridLayout_2.addWidget(self.toolButton_4, 2, 0, 1, 1)
 66         self.toolButton_5 = QtWidgets.QToolButton(self.tabWidgetPage1)
 67         icon4 = QtGui.QIcon()
 68         icon4.addPixmap(QtGui.QPixmap("../image/se/谷歌.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 69         self.toolButton_5.setIcon(icon4)
 70         self.toolButton_5.setIconSize(QtCore.QSize(80, 80))
 71         self.toolButton_5.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 72         self.toolButton_5.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 73         self.toolButton_5.setAutoRaise(True)
 74         self.toolButton_5.setObjectName("toolButton_5")
 75         self.gridLayout_2.addWidget(self.toolButton_5, 2, 1, 1, 1)
 76         self.toolButton_6 = QtWidgets.QToolButton(self.tabWidgetPage1)
 77         icon5 = QtGui.QIcon()
 78         icon5.addPixmap(QtGui.QPixmap("../image/se/yahoo.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 79         self.toolButton_6.setIcon(icon5)
 80         self.toolButton_6.setIconSize(QtCore.QSize(80, 80))
 81         self.toolButton_6.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 82         self.toolButton_6.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
 83         self.toolButton_6.setAutoRaise(True)
 84         self.toolButton_6.setObjectName("toolButton_6")
 85         self.gridLayout_2.addWidget(self.toolButton_6, 2, 2, 1, 1)
 86         icon6 = QtGui.QIcon()
 87         icon6.addPixmap(QtGui.QPixmap("../image/ico/China Flag.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 88         self.tabWidget.addTab(self.tabWidgetPage1, icon6, "")
 89         self.tabWidgetPage11 = QtWidgets.QWidget()
 90         self.tabWidgetPage11.setObjectName("tabWidgetPage11")
 91         self.gridLayout = QtWidgets.QGridLayout(self.tabWidgetPage11)
 92         self.gridLayout.setObjectName("gridLayout")
 93         self.toolButton_7 = QtWidgets.QToolButton(self.tabWidgetPage11)
 94         icon7 = QtGui.QIcon()
 95         icon7.addPixmap(QtGui.QPixmap("../image/v/tengxun.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
 96         self.toolButton_7.setIcon(icon7)
 97         self.toolButton_7.setIconSize(QtCore.QSize(80, 80))
 98         self.toolButton_7.setPopupMode(QtWidgets.QToolButton.InstantPopup)
 99         self.toolButton_7.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
100         self.toolButton_7.setAutoRaise(True)
101         self.toolButton_7.setObjectName("toolButton_7")
102         self.gridLayout.addWidget(self.toolButton_7, 0, 0, 1, 1)
103         self.toolButton_8 = QtWidgets.QToolButton(self.tabWidgetPage11)
104         icon8 = QtGui.QIcon()
105         icon8.addPixmap(QtGui.QPixmap("../image/se/搜狐.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
106         self.toolButton_8.setIcon(icon8)
107         self.toolButton_8.setIconSize(QtCore.QSize(80, 80))
108         self.toolButton_8.setPopupMode(QtWidgets.QToolButton.InstantPopup)
109         self.toolButton_8.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
110         self.toolButton_8.setAutoRaise(True)
111         self.toolButton_8.setObjectName("toolButton_8")
112         self.gridLayout.addWidget(self.toolButton_8, 0, 1, 1, 1)
113         self.toolButton_9 = QtWidgets.QToolButton(self.tabWidgetPage11)
114         icon9 = QtGui.QIcon()
115         icon9.addPixmap(QtGui.QPixmap("../image/se/优酷.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
116         self.toolButton_9.setIcon(icon9)
117         self.toolButton_9.setIconSize(QtCore.QSize(80, 80))
118         self.toolButton_9.setPopupMode(QtWidgets.QToolButton.InstantPopup)
119         self.toolButton_9.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
120         self.toolButton_9.setAutoRaise(True)
121         self.toolButton_9.setObjectName("toolButton_9")
122         self.gridLayout.addWidget(self.toolButton_9, 0, 2, 1, 1)
123         self.toolButton_10 = QtWidgets.QToolButton(self.tabWidgetPage11)
124         icon10 = QtGui.QIcon()
125         icon10.addPixmap(QtGui.QPixmap("../image/se/bilibli.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
126         self.toolButton_10.setIcon(icon10)
127         self.toolButton_10.setIconSize(QtCore.QSize(80, 80))
128         self.toolButton_10.setPopupMode(QtWidgets.QToolButton.InstantPopup)
129         self.toolButton_10.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
130         self.toolButton_10.setAutoRaise(True)
131         self.toolButton_10.setObjectName("toolButton_10")
132         self.gridLayout.addWidget(self.toolButton_10, 1, 0, 1, 1)
133         self.toolButton_11 = QtWidgets.QToolButton(self.tabWidgetPage11)
134         icon11 = QtGui.QIcon()
135         icon11.addPixmap(QtGui.QPixmap("../image/se/土豆.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
136         self.toolButton_11.setIcon(icon11)
137         self.toolButton_11.setIconSize(QtCore.QSize(80, 80))
138         self.toolButton_11.setPopupMode(QtWidgets.QToolButton.InstantPopup)
139         self.toolButton_11.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
140         self.toolButton_11.setAutoRaise(True)
141         self.toolButton_11.setObjectName("toolButton_11")
142         self.gridLayout.addWidget(self.toolButton_11, 1, 1, 1, 1)
143         self.toolButton_12 = QtWidgets.QToolButton(self.tabWidgetPage11)
144         icon12 = QtGui.QIcon()
145         icon12.addPixmap(QtGui.QPixmap("../image/se/acfun.png"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
146         self.toolButton_12.setIcon(icon12)
147         self.toolButton_12.setIconSize(QtCore.QSize(80, 80))
148         self.toolButton_12.setPopupMode(QtWidgets.QToolButton.InstantPopup)
149         self.toolButton_12.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
150         self.toolButton_12.setAutoRaise(True)
151         self.toolButton_12.setObjectName("toolButton_12")
152         self.gridLayout.addWidget(self.toolButton_12, 1, 2, 1, 1)
153         icon13 = QtGui.QIcon()
154         icon13.addPixmap(QtGui.QPixmap("../image/ico/UK Flag.ico"), QtGui.QIcon.Normal, QtGui.QIcon.Off)
155         self.tabWidget.addTab(self.tabWidgetPage11, icon13, "")
156         self.verticalLayout.addWidget(self.tabWidget)
157 
158         self.retranslateUi(Dialog)
159         self.tabWidget.setCurrentIndex(1)
160         QtCore.QMetaObject.connectSlotsByName(Dialog)
161 
162     def retranslateUi(self, Dialog):
163         _translate = QtCore.QCoreApplication.translate
164         Dialog.setWindowTitle(_translate("Dialog", "toolButton+tabWidget控件"))
165         self.toolButton.setText(_translate("Dialog", "百度"))
166         self.toolButton_2.setText(_translate("Dialog", "360"))
167         self.toolButton_3.setText(_translate("Dialog", "必应"))
168         self.toolButton_4.setText(_translate("Dialog", "搜狗"))
169         self.toolButton_5.setText(_translate("Dialog", "谷歌"))
170         self.toolButton_6.setText(_translate("Dialog", "雅虎"))
171         self.tabWidget.setTabText(self.tabWidget.indexOf(self.tabWidgetPage1), _translate("Dialog", "搜索引擎"))
172         self.toolButton_7.setText(_translate("Dialog", "腾讯视频"))
173         self.toolButton_8.setText(_translate("Dialog", "搜狐视频"))
174         self.toolButton_9.setText(_translate("Dialog", "优酷视频"))
175         self.toolButton_10.setText(_translate("Dialog", "Bilibili"))
176         self.toolButton_11.setText(_translate("Dialog", "土豆"))
177         self.toolButton_12.setText(_translate("Dialog", "AcFun"))
178         self.tabWidget.setTabText(self.tabWidget.indexOf(self.tabWidgetPage11), _translate("Dialog", "视频网站"))
179 
180 
181 if __name__ == "__main__":
182     import sys
183     app = QtWidgets.QApplication(sys.argv)
184     Dialog = QtWidgets.QDialog()
185     ui = Ui_Dialog()
186     ui.setupUi(Dialog)
187     Dialog.show()
188     sys.exit(app.exec_())
ui界面代码

 

技术分享图片
 1 # -*- coding: utf-8 -*-
 2 from PyQt5.QtCore import pyqtSlot
 3 from PyQt5.QtWidgets import QDialog, QApplication
 4 from Ui_toolBox import Ui_Dialog
 5 import sys, webbrowser
 6 
 7 
 8 class Dialog(QDialog, Ui_Dialog):
 9 
10     def __init__(self, parent=None):
11         super(Dialog, self).__init__(parent)
12         self.setupUi(self)
13     
14     @pyqtSlot()
15     def on_toolButton_clicked(self):
16         webbrowser.open(https://www.baidu.com)
17 
18     @pyqtSlot()
19     def on_toolButton_2_clicked(self):
20         webbrowser.open(https://www.so.com/)
21     
22     @pyqtSlot()
23     def on_toolButton_3_clicked(self):
24         webbrowser.open(http://cn.bing.com/)
25         
26     @pyqtSlot()
27     def on_toolButton_4_clicked(self):
28         webbrowser.open(https://www.sogou.com/)
29     
30     @pyqtSlot()
31     def on_toolButton_5_clicked(self):
32         webbrowser.open(https://www.google.com/)
33 
34     @pyqtSlot()
35     def on_toolButton_6_clicked(self):
36         webbrowser.open(https://www.yahoo.com/)
37 
38     @pyqtSlot()
39     def on_toolButton_7_clicked(self):
40         webbrowser.open(https://v.qq.com/)
41         
42     @pyqtSlot()
43     def on_toolButton_8_clicked(self):
44         webbrowser.open(https://film.sohu.com)
45     
46     @pyqtSlot()
47     def on_toolButton_9_clicked(self):
48         webbrowser.open(http://www.youku.com/)
49     
50     @pyqtSlot()
51     def on_toolButton_10_clicked(self):
52         webbrowser.open(https://www.bilibili.com/)
53     
54     @pyqtSlot()
55     def on_toolButton_11_clicked(self):
56         webbrowser.open(http://www.tudou.com/)
57     
58     @pyqtSlot()
59     def on_toolButton_12_clicked(self):
60         webbrowser.open(http://www.acfun.cn/)
61     
62 
63 if __name__ == "__main__":
64     app = QApplication(sys.argv)
65     ui = Dialog()
66     ui.show()
67     sys.exit(app.exec_())
68     
69     
逻辑界面

 

【PyQt5-Qt Designer】工具箱(QToolBox)控件的使用

标签:type   reading   继承   edit   obj   bin   nec   frame   enabled   

原文地址:https://www.cnblogs.com/XJT2018/p/10225640.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!