Python 使用PyQt5进行界面程序开发
目的：使用PyQt5进行界面程序开发
- 环境：
- 问题：
- 解决方案：
- 步骤：
- 附代码如下：
环境：
系统：win10
IDE: Pycharm 2018.1.4
Python版本： 3.6.4
问题：
之前进行Python界面程序开发使用的Tkinter ，生成界面较为粗糙，美化较复杂。
解决方案：
使用PyQt5进行界面开发，使用QSS进行界面样式美化，开发效率较高，复杂度小。
步骤：
- Pycharm 新建一个项目(示例项目为Test)。
- 添加PyQt解释器： 点击Pycharm标题栏中的File -> setting->Project: -> Project Interpreter，在右侧窗口添加解释器, 如下图。
PyQt5是QT的解释器。
pyqt-tools包含QTDesiner, 可以使用图形界面直接操作生成UI。
PyInstaller是打包成执行档工具(如windows下exe)
- 想要使用QTDesigner，还需要配置一下才可使用，具体方法如下：
参照链接：https://blog.csdn.net/px41834/article/details/79383985
1. 打开File->Setting->Tools->External Tools, 点击加号进行配置添加，如下图。
2. 先加qtdesinger的参数program:E:\python_study\qtstudy\venv\Lib\site-packages\pyqt5-tools\designer.exe,这个是我的需要换成你自己的，arguments: F i l e D i r FileDir FileDir$FileName$ ,working directory: F i l e D i r FileDir FileDir,后面这个可以和我一样。
3. 再点加号，添加pyuic5的参数，这个是把qt的UI文件转换成.py文件的工具，program:E:\python_study\qtstudy\venv\Scripts\pyuic5.exe，这个也需要改成你自己的，
arguments: F i l e N a m e FileName FileName -o F i l e N a m e W i t h o u t E x t e n s i o n FileNameWithoutExtension FileNameWithoutExtension.py ,working directory: F i l e D i r FileDir FileDir,后面这个可以和我一样。
4. 再点加号，添加pyrcc的参数，这个是将资源文件如图片等转成python代码能识别的文件，这个参数基本和pyuic5的是一样的。
5. 以上都配置好(如下图)，就可以使用QTDesigner了。
6. Pycharm标题栏点击Tool->External Tools，并选择QtDesigner，如下两图。
7. 点击create，在窗口右边可选择QT控件，拖动到Dialog窗口，便可编辑自己想要的窗口， 如下两图(操作跟QT一模一样)。
- 使用QTDesigner创建窗口并在项目中使用。
- 创建一个窗口保存名为testQUI.ui，位置可以自己选定。
- 对生成的testQUI.ui文件点击右键，在弹出的菜单中选择External Tools-> pyuic5，既可以从ui文件生成py文件。
- 新建一个测试的入口文件，导入刚才生成的testQUI.py，并运行测试效果如下两图。
- 使用PyQt5进行页面开发(具体使用方式跟QT类似)， 推荐一个参考链接： https://zmister.com/archives/477.html。根据该链接，修改了一个页面如下图，仅供参考。
附代码如下：
# coding:utf-8
import sys
import os
import qtawesome
from PyQt5 import QtCore, QtGui, QtWidgets
# 主窗体及UI
from PyQt5.QtWidgets import QStackedWidget, QFrame, QWidget, QHBoxLayout, QFileDialog, QToolTip, QMessageBox, QComboBox
class MainUi(QtWidgets.QMainWindow):
def __init__(self):
super().__init__()
self.init_ui()
def init_ui(self):
# 主窗口及布局
self.setFixedSize(960, 700)
self.main_widget = QtWidgets.QWidget() # 创建窗口主部件
self.main_layout = QtWidgets.QGridLayout() # 创建主部件的网格布局
self.main_widget.setLayout(self.main_layout) # 设置窗口主部件布局为网格布局
self.main_widget.setFixedSize(960, 700); # 禁止调整窗口大小
# 左侧部件及布局
self.left_widget = QtWidgets.QWidget() # 创建左侧部件
self.left_widget.setObjectName('left_widget')
self.left_layout = QtWidgets.QGridLayout() # 创建左侧部件的网格布局层
self.left_widget.setLayout(self.left_layout) # 设置左侧部件布局为网格
# 右侧部件及布局
self.right_stacked_Widget = QStackedWidget()
self.right_stacked_Widget.setObjectName('right_stacked_Widget')
self.main_layout.addWidget(self.left_widget, 0, 0, 12, 2) # 左侧部件在第0行第0列，占8行3列
self.main_layout.addWidget(self.right_stacked_Widget, 0, 2, 12, 10) # 右侧部件在第0行第3列，占8行9列
self.setCentralWidget(self.main_widget) # 设置窗口主部件
# 主窗口美化
self.setWindowOpacity(0.9) # 设置窗口透明度
self.setAttribute(QtCore.Qt.WA_TranslucentBackground) # 设置窗口背景透明
self.setWindowFlag(QtCore.Qt.FramelessWindowHint) # 隐藏边框
self.main_layout.setSpacing(0) #去除左侧部件和右侧部件中的缝隙
# 左侧部件的组件布局
# 1. 顶部三个按钮
self.left_close = QtWidgets.QPushButton("") # 关闭按钮
self.left_visit = QtWidgets.QPushButton("") # 空白按钮
self.left_mini = QtWidgets.QPushButton("") # 最小化按钮
self.left_close.clicked.connect(self.close) # 关闭窗口
self.left_mini.clicked.connect(self.showMinimized) # 最小化窗口
# 2. 左侧菜单栏选项(隐藏不使用的按钮)
self.left_label_1 = QtWidgets.QPushButton("功能列表")
self.left_label_1.setObjectName('left_label')
self.left_label_2 = QtWidgets.QPushButton("系统设置")
self.left_label_2.setObjectName('left_label')
self.left_label_3 = QtWidgets.QPushButton("")
self.left_label_3.setObjectName('left_label')
self.left_button_1 = QtWidgets.QPushButton(qtawesome.icon('fa.upload', color='white'), "上传")
self.left_button_1.setObjectName('left_button')
self.left_button_1.clicked.connect(self.left_button1_clicked)
self.left_button_2 = QtWidgets.QPushButton(qtawesome.icon('fa.download', color='white'), "下载")
self.left_button_2.setObjectName('left_button')
self.left_button_3 = QtWidgets.QPushButton(qtawesome.icon('fa.file', color='white'), "打开")
self.left_button_3.setObjectName('left_button')
self.left_button_4 = QtWidgets.QPushButton(qtawesome.icon('fa.star', color='white'), "一")
self.left_button_4.setObjectName('left_button')
self.left_button_5 = QtWidgets.QPushButton(qtawesome.icon('fa.star', color='white'), "二")
self.left_button_5.setObjectName('left_button')
self.left_button_6 = QtWidgets.QPushButton(qtawesome.icon('fa.star', color='white'), "三")
self.left_button_6.setObjectName('left_button')
self.left_button_7 = QtWidgets.QPushButton()
self.left_button_7.setObjectName('left_button')
self.left_button_8 = QtWidgets.QPushButton()
self.left_button_8.setObjectName('left_button')
self.left_button_9 = QtWidgets.QPushButton()
self.left_button_9.setObjectName('left_button')
self.left_xxx = QtWidgets.QPushButton(" ")
# 禁用不展示的按钮, 按钮名称为空，然后设置按钮不可点击, 这样实现按钮占位，避免布局不协调(暂未找到较好方法)
# self.left_button_2.setDisabled(True)
# self.left_button_3.setDisabled(True)
# self.left_label_2.setDisabled(True)
# self.left_button_4.setDisabled(True)
# self.left_button_5.setDisabled(True)
# self.left_button_6.setDisabled(True)
self.left_label_3.setDisabled(True)
self.left_button_7.setDisabled(True)
self.left_button_8.setDisabled(True)
self.left_button_9.setDisabled(True)
self.left_layout.addWidget(self.left_mini, 0, 0, 1, 1)
self.left_layout.addWidget(self.left_visit, 0, 1, 1, 1)
self.left_layout.addWidget(self.left_close, 0, 2, 1, 1)
self.left_layout.addWidget(self.left_label_1, 1, 0, 1, 3)
self.left_layout.addWidget(self.left_button_1, 2, 0, 1, 3)
self.left_layout.addWidget(self.left_button_2, 3, 0, 1, 3)
self.left_layout.addWidget(self.left_button_3, 4, 0, 1, 3)
self.left_layout.addWidget(self.left_label_2, 5, 0, 1, 3)
self.left_layout.addWidget(self.left_button_4, 6, 0, 1, 3)
self.left_layout.addWidget(self.left_button_5, 7, 0, 1, 3)
self.left_layout.addWidget(self.left_button_6, 8, 0, 1, 3)
self.left_layout.addWidget(self.left_label_3, 9, 0, 1, 3)
self.left_layout.addWidget(self.left_button_7, 10, 0, 1, 3)
self.left_layout.addWidget(self.left_button_8, 11, 0, 1, 3)
self.left_layout.addWidget(self.left_button_9, 12, 0, 1, 3)
# 左侧部件美化
# 1. 左侧顶部三个按钮美化
self.left_close.setFixedSize(15, 15) # 设置关闭按钮的大小
self.left_visit.setFixedSize(15, 15) # 设置按钮大小
self.left_mini.setFixedSize(15, 15) # 设置最小化按钮大小
self.left_close.setStyleSheet(
'''QPushButton{background:#F76677;border-radius:5px;}QPushButton:hover{background:red;}''')
self.left_visit.setStyleSheet(
'''QPushButton{background:#F7D674;border-radius:5px;}QPushButton:hover{background:yellow;}''')
self.left_mini.setStyleSheet(
'''QPushButton{background:#6DDF6D;border-radius:5px;}QPushButton:hover{background:green;}''')
# 2. 左侧部件菜单美化及整体美化
self.left_widget.setStyleSheet('''
QPushButton{border:none;color:white;}
QPushButton#left_label{
border:none;
border-bottom:1px solid SteelBlue;
font-size:18px;
font-weight:700;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
QPushButton#left_button:hover{border-left:4px solid red;font-weight:700;}
QWidget#left_widget{
background:SteelBlue;
border-top:1px solid white;
border-bottom:1px solid white;
border-left:1px solid white;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
}
''')
# 右侧边栏
# 1. 默认页面(form1)
self.form1 = QWidget()
self.right_stacked_Widget.addWidget(self.form1)
self.formLayout1 = QtWidgets.QGridLayout(self.form1)
# 1.1 搜索框
self.right_bar_widget = QtWidgets.QWidget() # 右侧顶部搜索框部件
self.right_bar_layout = QtWidgets.QGridLayout() # 右侧顶部搜索框网格布局
self.right_bar_widget.setLayout(self.right_bar_layout)
self.search_icon = QtWidgets.QLabel(chr(0xf002) + ' ' + '搜索 ')
self.search_icon.setFont(qtawesome.font('fa', 16))
self.right_bar_widget_search_input = QtWidgets.QLineEdit()
self.right_bar_widget_search_input.setPlaceholderText("输入功能菜单，回车进行搜索")
self.right_bar_layout.addWidget(self.search_icon, 0, 0, 1, 1)
self.right_bar_layout.addWidget(self.right_bar_widget_search_input, 0, 1, 1, 8)
self.formLayout1.addWidget(self.right_bar_widget, 0, 0, 1, 9)
# 1.2 推荐栏
self.right_recommend_label = QtWidgets.QLabel("今日推荐")
self.right_recommend_label.setObjectName('right_lable')
self.right_recommend_widget = QtWidgets.QWidget() # 推荐封面部件
self.right_recommend_layout = QtWidgets.QGridLayout() # 推荐封面网格布局
self.right_recommend_widget.setLayout(self.right_recommend_layout)
self.recommend_button_1 = QtWidgets.QToolButton()
self.recommend_button_1.setText("可馨HANM") # 设置按钮文本
self.recommend_button_1.setIcon(QtGui.QIcon('./r1.jpg')) # 设置按钮图标
self.recommend_button_1.setIconSize(QtCore.QSize(100, 100)) # 设置图标大小
self.recommend_button_1.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon) # 设置按钮形式为上图下文
self.recommend_button_2 = QtWidgets.QToolButton()
self.recommend_button_2.setText("那首歌")
self.recommend_button_2.setIcon(QtGui.QIcon('./r2.jpg'))
self.recommend_button_2.setIconSize(QtCore.QSize(100, 100))
self.recommend_button_2.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.recommend_button_3 = QtWidgets.QToolButton()
self.recommend_button_3.setText("伟大的渺小")
self.recommend_button_3.setIcon(QtGui.QIcon('./r3.jpg'))
self.recommend_button_3.setIconSize(QtCore.QSize(100, 100))
self.recommend_button_3.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.recommend_button_4 = QtWidgets.QToolButton()
self.recommend_button_4.setText("荣耀征战")
self.recommend_button_4.setIcon(QtGui.QIcon('./r4.jpg'))
self.recommend_button_4.setIconSize(QtCore.QSize(100, 100))
self.recommend_button_4.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.recommend_button_5 = QtWidgets.QToolButton()
self.recommend_button_5.setText("猎场合辑")
self.recommend_button_5.setIcon(QtGui.QIcon('./r5.jpg'))
self.recommend_button_5.setIconSize(QtCore.QSize(100, 100))
self.recommend_button_5.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.right_recommend_layout.addWidget(self.recommend_button_1, 0, 0)
self.right_recommend_layout.addWidget(self.recommend_button_2, 0, 1)
self.right_recommend_layout.addWidget(self.recommend_button_3, 0, 2)
self.right_recommend_layout.addWidget(self.recommend_button_4, 0, 3)
self.right_recommend_layout.addWidget(self.recommend_button_5, 0, 4)
self.formLayout1.addWidget(self.right_recommend_label, 1, 0, 1, 9)
self.formLayout1.addWidget(self.right_recommend_widget, 2, 0, 2, 9)
# 1.3 音乐列表
self.right_newsong_lable = QtWidgets.QLabel("最新歌曲")
self.right_newsong_lable.setObjectName('right_lable')
self.right_newsong_widget = QtWidgets.QWidget() # 最新歌曲部件
self.right_newsong_layout = QtWidgets.QGridLayout() # 最新歌曲部件网格布局
self.right_newsong_widget.setLayout(self.right_newsong_layout)
self.newsong_button_1 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.newsong_button_2 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.newsong_button_3 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.newsong_button_4 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.newsong_button_5 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.newsong_button_6 = QtWidgets.QPushButton("夜机 陈慧娴 永远的朋友 03::29")
self.right_newsong_layout.addWidget(self.newsong_button_1, 0, 1, )
self.right_newsong_layout.addWidget(self.newsong_button_2, 1, 1, )
self.right_newsong_layout.addWidget(self.newsong_button_3, 2, 1, )
self.right_newsong_layout.addWidget(self.newsong_button_4, 3, 1, )
self.right_newsong_layout.addWidget(self.newsong_button_5, 4, 1, )
self.right_newsong_layout.addWidget(self.newsong_button_6, 5, 1, )
# 1.4 歌单
self.right_playlist_lable = QtWidgets.QLabel("热门歌单")
self.right_playlist_lable.setObjectName('right_lable')
self.right_playlist_widget = QtWidgets.QWidget() # 播放歌单部件
self.right_playlist_layout = QtWidgets.QGridLayout() # 播放歌单网格布局
self.right_playlist_widget.setLayout(self.right_playlist_layout)
self.playlist_button_1 = QtWidgets.QToolButton()
self.playlist_button_1.setText("无法释怀的整天循环音乐…")
self.playlist_button_1.setIcon(QtGui.QIcon('./p1.jpg'))
self.playlist_button_1.setIconSize(QtCore.QSize(100, 100))
self.playlist_button_1.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.playlist_button_2 = QtWidgets.QToolButton()
self.playlist_button_2.setText("不需要歌词,也可以打动你的心")
self.playlist_button_2.setIcon(QtGui.QIcon('./p2.jpg'))
self.playlist_button_2.setIconSize(QtCore.QSize(100, 100))
self.playlist_button_2.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.playlist_button_3 = QtWidgets.QToolButton()
self.playlist_button_3.setText("那些你熟悉又不知道名字…")
self.playlist_button_3.setIcon(QtGui.QIcon('./p3.jpg'))
self.playlist_button_3.setIconSize(QtCore.QSize(100, 100))
self.playlist_button_3.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.playlist_button_4 = QtWidgets.QToolButton()
self.playlist_button_4.setText("那些只听前奏就中毒的英文歌")
self.playlist_button_4.setIcon(QtGui.QIcon('./p4.jpg'))
self.playlist_button_4.setIconSize(QtCore.QSize(100, 100))
self.playlist_button_4.setToolButtonStyle(QtCore.Qt.ToolButtonTextUnderIcon)
self.right_playlist_layout.addWidget(self.playlist_button_1, 0, 0)
self.right_playlist_layout.addWidget(self.playlist_button_2, 0, 1)
self.right_playlist_layout.addWidget(self.playlist_button_3, 1, 0)
self.right_playlist_layout.addWidget(self.playlist_button_4, 1, 1)
self.formLayout1.addWidget(self.right_newsong_lable, 4, 0, 1, 5)
self.formLayout1.addWidget(self.right_playlist_lable, 4, 5, 1, 4)
self.formLayout1.addWidget(self.right_newsong_widget, 5, 0, 1, 5)
self.formLayout1.addWidget(self.right_playlist_widget, 5, 5, 1, 4)
# 1.5 进度条
self.right_process_bar = QtWidgets.QProgressBar() # 播放进度部件
self.right_process_bar.setValue(49)
self.right_process_bar.setFixedHeight(3) # 设置进度条高度
self.right_process_bar.setTextVisible(False) # 不显示进度条文字
self.right_playconsole_widget = QtWidgets.QWidget() # 播放控制部件
self.right_playconsole_layout = QtWidgets.QGridLayout() # 播放控制部件网格布局层
self.right_playconsole_widget.setLayout(self.right_playconsole_layout)
self.console_button_1 = QtWidgets.QPushButton(qtawesome.icon('fa.backward', color='#F76677'), "")
self.console_button_2 = QtWidgets.QPushButton(qtawesome.icon('fa.forward', color='#F76677'), "")
self.console_button_3 = QtWidgets.QPushButton(qtawesome.icon('fa.pause', color='#F76677', font=18), "")
self.console_button_3.setIconSize(QtCore.QSize(30, 30))
self.right_playconsole_layout.addWidget(self.console_button_1, 0, 0)
self.right_playconsole_layout.addWidget(self.console_button_2, 0, 2)
self.right_playconsole_layout.addWidget(self.console_button_3, 0, 1)
self.right_playconsole_layout.setAlignment(QtCore.Qt.AlignCenter) # 设置布局内部件居中显示
self.formLayout1.addWidget(self.right_process_bar, 9, 0, 1, 9)
self.formLayout1.addWidget(self.right_playconsole_widget, 10, 0, 1, 9)
# 2. 上传页面(form2)
self.form2 = QWidget()
self.right_stacked_Widget.addWidget(self.form2)
self.formLayout2 = QtWidgets.QGridLayout(self.form2)
# 2.1 信息提示对话框
self.right_message_Alter = QMessageBox();
self.right_message_Alter.setObjectName("right_message_Alter");
self.right_message_Alter.setWindowOpacity(0.9) # 设置窗口透明度
self.right_message_Alter.setWindowFlag(QtCore.Qt.FramelessWindowHint) # 隐藏边框
# 2.2 文件选择框及按钮
self.right_bar_widget1 = QtWidgets.QWidget() # 右侧顶部搜索框部件
self.right_bar_layout1 = QtWidgets.QGridLayout() # 右侧顶部搜索框网格布局
self.right_bar_widget1.setLayout(self.right_bar_layout1)
self.right_folder_button = QtWidgets.QPushButton(qtawesome.icon('fa.folder', color='GoldenRod'), "")
self.right_folder_button.setObjectName('right_search_button')
self.right_folder_button.setFont(qtawesome.font('fa', 16))
self.right_folder_button.clicked.connect(self.right_folder_button_clicked)
self.right_folder_button.setFixedSize(30, 30) # 设置按钮大小
self.right_bar_widget_folder_input = QtWidgets.QLineEdit()
self.right_bar_widget_folder_input.setPlaceholderText("填入或选择需要上传的文件夹")
self.right_bar_widget_folder_input.setObjectName("right_input_item");
self.right_bar_layout1.addWidget(self.right_folder_button, 0, 0, 1, 1)
self.right_bar_layout1.addWidget(self.right_bar_widget_folder_input, 0, 1, 1, 8)
self.formLayout2.addWidget(self.right_bar_widget1, 0, 0, 1, 9)
# 2.3 ip和port设置、下拉及按钮
self.right_bar_widget2 = QtWidgets.QWidget() # 右侧顶部搜索框部件
self.right_bar_layout2 = QtWidgets.QGridLayout() # 右侧顶部搜索框网格布局
self.right_bar_widget2.setLayout(self.right_bar_layout2)
# ip框
self.right_host_icon = QtWidgets.QLabel(chr(0xf015) + ' ' + 'IP:')
self.right_host_icon.setFont(qtawesome.font('fa', 16))
self.right_bar_widget_host_input = QtWidgets.QLineEdit()
self.right_bar_widget_host_input.setPlaceholderText("输入ip地址")
self.right_bar_widget_host_input.setObjectName("right_input_item");
self.right_bar_widget_host_input.setFixedWidth(120)
# port框
self.right_port_lable = QtWidgets.QLabel(' ' + 'Port:')
self.right_port_lable.setFont(qtawesome.font('fa', 16))
self.right_bar_widget_port_input = QtWidgets.QLineEdit()
self.right_bar_widget_port_input.setPlaceholderText("port")
self.right_bar_widget_port_input.setObjectName("right_input_item")
self.right_bar_widget_port_input.setFixedWidth(40)
# 下拉列表
self.right_repository_combobox = QtWidgets.QComboBox()
self.right_repository_combobox.setObjectName("right_repository_combobox")
self.right_repository_combobox.addItem("--请选择--")
# 上传按钮
self.right_batch_btn = QtWidgets.QPushButton(chr(0xf021) + ' ' + '上传')
self.right_batch_btn.setFont(qtawesome.font('fa', 16))
self.right_batch_btn.setFixedWidth(100)
self.right_batch_btn.setObjectName("right_batch_btn")
self.right_bar_layout2.addWidget(self.right_host_icon, 0, 1, 1, 1)
self.right_bar_layout2.addWidget(self.right_bar_widget_host_input, 0, 2, 1, 3)
self.right_bar_layout2.addWidget(self.right_port_lable, 0, 5, 1, 1)
self.right_bar_layout2.addWidget(self.right_bar_widget_port_input, 0, 6, 1, 2)
self.right_bar_layout2.addWidget(self.right_repository_combobox, 0, 8, 1, 5)
self.right_bar_layout2.addWidget(self.right_batch_btn, 0, 13, 1, 10)
self.formLayout2.addWidget(self.right_bar_widget2, 1, 0, 1, 9)
# 2.4 输出结果
self.right_bar_widget3 = QtWidgets.QWidget() # 右侧顶部搜索框部件
self.right_bar_layout3 = QtWidgets.QGridLayout() # 右侧顶部搜索框网格布局
self.right_bar_widget3.setLayout(self.right_bar_layout3)
# 结果输出
self.right_batch_result_lable = QtWidgets.QLabel('结果:')
self.right_batch_result_lable.setFont(qtawesome.font('fa', 16))
self.right_batch_result_listView = QtWidgets.QListView()
# 2.5 进度条
self.right_result_process_bar = QtWidgets.QProgressBar() # 进度部件
self.right_result_process_bar.setValue(49)
self.right_result_process_bar.setFixedHeight(3) # 设置进度条高度
self.right_result_process_bar.setTextVisible(False) # 不显示进度条文字
self.right_bar_layout3.addWidget(self.right_batch_result_lable, 0, 0, 1, 9)
self.right_bar_layout3.addWidget(self.right_batch_result_listView, 1, 0, 1, 9)
self.right_bar_layout3.addWidget(self.right_result_process_bar, 3, 0, 1, 9)
self.formLayout2.addWidget(self.right_bar_widget3, 2, 0, 1, 9)
# 右边栏美化
# 右边框整体风格美化
self.right_stacked_Widget.setStyleSheet('''
QStackedWidget#right_stacked_Widget{
color:#232C51;
background:white;
border-top:1px solid darkGray;
border-bottom:1px solid darkGray;
border-right:1px solid darkGray;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
}
QLabel#right_lable{
border:none;
font-size:16px;
font-weight:700;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
''')
# 默认页面(form1)美化
# 1.1 搜索框美化
self.right_bar_widget_search_input.setStyleSheet(
'''QLineEdit{
border:1px solid gray;
width:300px;
border-radius:10px;
padding:2px 4px;
}''')
# 1.2 推荐列表, 歌单美化
self.right_recommend_widget.setStyleSheet(
'''
QToolButton{border:none;}
QToolButton:hover{border-bottom:2px solid #F76677;}
''')
self.right_playlist_widget.setStyleSheet(
'''
QToolButton{border:none;}
QToolButton:hover{border-bottom:2px solid #F76677;}
''')
self.right_newsong_widget.setStyleSheet('''
QPushButton{
border:none;
color:gray;
font-size:12px;
height:40px;
padding-left:5px;
padding-right:10px;
text-align:left;
}
QPushButton:hover{
color:black;
border:1px solid #F3F3F5;
border-radius:10px;
background:LightGray;
}
''')
# 1.3 进度条和按钮美化
self.right_process_bar.setStyleSheet('''
QProgressBar::chunk {
background-color: #F76677;
}
''')
self.right_playconsole_widget.setStyleSheet('''
QPushButton{
border:none;
}
''')
# 2. 上传页面(form2)美化
self.form2.setStyleSheet('''
QLineEdit#right_input_item{
border:1px solid gray;
width:300px;
border-radius:10px;
padding:2px 4px;
}
QLabel#right_server_lable{
border:none;
font-size:16px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
QPushButton#right_batch_btn{
background-color: LightSteelBlue;
font-size:16px;
font-weight:500;
border-radius:10px;
padding:2px 4px;
border:1px solid gray;
}
QPushButton#right_batch_btn:hover{background-color: steelblue;}
''')
# 2.1 下拉框美化样式
self.right_repository_combobox.setStyleSheet('''
QComboBox#right_repository_combobox{
background-color: white;
font-size:16px;
font-weight:500;
border-radius:10px;
padding:2px 4px;
border:1px solid gray;
}
QComboBox:editable {
background: white;
border-radius:10px;
padding:2px 4px;
color:gray;
}
QComboBox:!editable, QComboBox::drop-down:editable {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
}
/* QComboBox gets the "on" state when the popup is open */
QComboBox:!editable:on, QComboBox::drop-down:editable:on {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #D3D3D3, stop: 0.4 #D8D8D8,
stop: 0.5 #DDDDDD, stop: 1.0 #E1E1E1);
}
QComboBox:on { /* shift the text when the popup opens */
padding-top: 3px;
padding-left: 4px;
}
QComboBox::drop-down {
subcontrol-origin: padding;
subcontrol-position: top right;
width: 15px;
border-left-width: 1px;
border-left-style: solid; /* just a single line */
border-left-color: darkgray;
border-top-right-radius: 3px; /* same radius as the QComboBox */
border-bottom-right-radius: 3px;
border-radius:10px;
padding:2px 4px;
}
QComboBox::down-arrow {
/* image: url(E:/1.jpg);*/
border-image: url(E:/1.jpg);
}
QComboBox::down-arrow:on { /* shift the arrow when popup is open */
top: 1px;
left: 1px;}
''')
# 2.2 listview美化
self.right_batch_result_listView.setStyleSheet('''
QListView {
alternate-background-color: yellow;
padding:2px 4px;
}
QListView {
show-decoration-selected: 1; /* make the selection span the entire width of the view */
}
/* 此处QListView::item:alternate覆盖会alternate-background-color: yellow属性*/
QListView::item:alternate {
background: #EEEEEE; /* item交替变换颜色，如图中灰色 */
}
QListView::item:selected {
border: 1px solid #6a6ea9;
}
QListView::item:selected:!active {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #ABAFE5,
stop: 1 #8588B2);
}
QListView::item:selected:active {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #6a6ea9,
stop: 1 #888dd9);
}
QListView::item:hover {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #FAFBFE,
stop: 1 #DCDEF1);
''')
# 2.3 弹出框页面美化
self.right_message_Alter.setStyleSheet('''
QMessageBox{
background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,stop: 0 rgba(255, 255, 255, 100%),
stop: 1 rgba(70, 130, 180, 100%));
border-top:1px solid black;
border-bottom:1px solid black;
border-left:1px solid black;
border-right:1px solid black;
border-radius:10px;
padding:2px 4px;
}
QPushButton{
background-color: white;
border-radius:5px;
font-size:16px;
font-weight:500;
}
QPushButton:hover{background-color: steelblue;}
''')
self.right_folder_button.setStyleSheet('''
QPushButton#right_search_button{
border-radius:5px;
font-size:16px;
font-weight:300;
}
QPushButton#right_search_button:hover{background-color: GoldenRod;}
''')
# 事件处理
# 1. left_button1, 面板选取, 选择页面2
def left_button1_clicked(self):
self.right_stacked_Widget.setCurrentIndex(1)
# 2. right_search_button, 选择文件夹
def right_folder_button_clicked(self):
dir_choose = QFileDialog.getExistingDirectory(self, "选取文件夹", "/") # 起始路径
if dir_choose == "":
self.right_message_Alter.information(self.right_message_Alter, "提示", self.tr("未选择任何文件夹!"))
return
if os.path.isdir(dir_choose):
for filename in os.listdir(dir_choose):
if filename.endswith('jpg') or filename.endswith('png'):
self.right_bar_widget_search_input1.setText(dir_choose)
return
self.right_message_Alter.information(self.right_message_Alter, "提示", self.tr("所选文件夹中没有图片, 请重新选择!"))
return
def main():
app = QtWidgets.QApplication(sys.argv)
gui = MainUi()
gui.show()
sys.exit(app.exec_())
if __name__ == '__main__':
main()