当前位置:   article > 正文

python图形化界面设计例题_实战!在Python中制作精美的图形用户界面

pyqt5的设计题

在默认情况下,我们使用PyQt5创建出来的窗口和部件都是自带的默认样式,虽然谈不上很丑,但是也毫无美感可言。其实,在PyQt5中,我们可以有较高的自由度来自定义窗口和各种小部件的样式,通过自定义这些样式,以达到美化图形界面的目的。

本篇文章中,我们就通过一个实际的例子,使用QSS和PyQt5的配置属性,实现图形用户界面的美化工作。

首先上效果图:

使用到的图片素材有9张音乐的封面图片:

需要素材的小伙伴可以在【州的先生】微信公众号(ID:zmister2016)回复关键词“0013”获取下载链接。

一、对界面进行布局和组件的布置

在图像界面编程中,一个好的布局有助于全局把控界面的形态,而在PyQt5中,有多种布局的方式供我们选择,比较常用的布局有以下几种:表单布局:QFormLayout

网格布局:QGridLayout

水平排列布局:QHBoxLayout

垂直排列布局:QVBoxLayout

每种布局都有自己对布局内小部件的控制方式和特点,在此我们选择网格布局作为本次图形界面布局的方案。

在网格布局内,使用两个QWidget()部件分别作为左侧菜单模块的部件和右侧内容模块的部件。所以这个图形界面的最基本结构代码如下所示:

# coding:utf-8

from PyQt5 import QtCore,QtGui,QtWidgets

import sys

import qtawesome

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.left_widget = QtWidgets.QWidget() # 创建左侧部件

self.left_widget.setObjectName('left_widget')

self.left_layout = QtWidgets.QGridLayout() # 创建左侧部件的网格布局层

self.left_widget.setLayout(self.left_layout) # 设置左侧部件布局为网格

self.right_widget = QtWidgets.QWidget() # 创建右侧部件

self.right_widget.setObjectName('right_widget')

self.right_layout = QtWidgets.QGridLayout()

self.right_widget.setLayout(self.right_layout) # 设置右侧部件布局为网格

self.main_layout.addWidget(self.left_widget,0,0,12,2) # 左侧部件在第0行第0列,占8行3列

self.main_layout.addWidget(self.right_widget,0,2,12,10) # 右侧部件在第0行第3列,占8行9列

self.setCentralWidget(self.main_widget) # 设置窗口主部件

def main():

app = QtWidgets.QApplication(sys.argv)

gui = MainUi()

gui.show()

sys.exit(app.exec_())

if __name__ == '__main__':

main()

运行代码,呈现出来的图形界面如下图所示:

空空荡荡,下面我们就开始往里面填充小部件。

左侧菜单栏

在左侧菜单模块中,继续使用网格对部件进行布局。在左侧菜单的布局中添加按钮部件QPushButton()左侧菜单的按钮、菜单列提示和整个窗口的最小化和关闭按钮。

在MainUi()类的init_ui()方法中,使用如下代码实例化创建按钮:

self.left_close = QtWidgets.QPushButton("") # 关闭按钮

self.left_visit = QtWidgets.QPushButton("") # 空白按钮

self.left_mini = QtWidgets.QPushButton("") # 最小化按钮

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.music',color='white'),"华语流行")

self.left_button_1.setObjectName('left_button')

self.left_button_2 = QtWidgets.QPushButton(qtawesome.icon('fa.sellsy',color='white'),"在线FM")

self.left_button_2.setObjectName('left_button')

self.left_button_3 = QtWidgets.QPushButton(qtawesome.icon('fa.film',color='white'),"热门MV")

self.left_button_3.setObjectName('left_button')

self.left_button_4 = QtWidgets.QPushButton(qtawesome.icon('fa.home',color='white'),"本地音乐")

self.left_button_4.setObjectName('left_button')

self.left_button_5 = QtWidgets.QPushButton(qtawesome.icon('fa.download',color='white'),"下载管理")

self.left_button_5.setObjectName('left_button')

self.left_button_6 = QtWidgets.QPushButton(qtawesome.icon('fa.heart',color='white'),"我的收藏")

self.left_button_6.setObjectName('left_button')

self.left_button_7 = QtWidgets.QPus

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Gausst松鼠会/article/detail/724468
推荐阅读
相关标签
  

闽ICP备14008679号