- 第2课:创建主窗口 @2021.10.19、2021.10.23
- 创建组织工程文件夹目录
- 根目录
- main.py:启动程序
- qt_core.py:qt库导入管理程序
- gui folder:UI设计文件存放处
- windows folder:窗口设计
- main_window:主窗口设计文件夹
- ui_main_window.py: 用代码拼出UI主界面
- main_window:主窗口设计文件夹
- windows folder:窗口设计
- 程序注释
添加脚本开头的共同注释部分(增加中文翻译), 也可以使用 PyCharm 自带的创建py文件自动加抬头注释。
# /// # # BY: Author name # PROJECT MADE WITH: Qt Designer and PySide6 # V: 1.0.0 # # This project can be used freely for all uses, as long as they maintain the # respective credits only in the Python scripts, any information in the visual # interface (GUI) can be modified without any implication. # # There are limitations on Qt licenses if you want to use your products # commercially, I recommend reading them on the official website: # https://doc.qt.io/qtforpython/licenses.html # # 这个项目可以被所有用户自由使用,只要他们只在Python脚本中保留各自的原作者信息, # 可视界面(GUI)中的任何信息都可以被修改而不需要任何暗示。 # 如果你想在商业上使用你的产品,Qt许可证是有限制的,我建议你在官方网站上阅读它们 # ///
- pyside6运行的最小框架
- qt_core.py:增加其他程序需要调用qt库的所有功能。
from PySide6.QtCore import * from PySide6.QtGui import * from PySide6.QtWidgets import *
- main.py: app 主程序,创建MainWindow类,继承自QMainWindow。
# IMPORT MODULES
import sys
import os
# IMPORT QT CORE
from qt_core import *
# MAIN WINDOW
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle("Python3.9 PySide6 Learning")
# SHOW APP
self.show()
if __name__ == "__main__":
app = QApplication(sys.argv)
app.setWindowIcon(QIcon("icon.ico"))
window = MainWindow()
# window.show() # 展示我们的app 窗口,或者在MainWindow()构造函数中写self.show()
sys.exit(app.exec())
4.工程文件结构优化
- 使用独立的py文件ui_main_window.py,定义UI_MainWindow类,并且定义setup_ui方法。在setup_ui方法中在使用pyside6创建的UI界面类
- 在上述py文件中编写(使用 pyside6 创建&layout一系列控件)或复制来自 Qt Designer自动生成的UI界面代码
# IMPORT QT CORE
from qt_core import *
# MAIN WINDOW
class UI_MainWindow(object):
def setup_ui(self, parent):
'''parent: 一般由 main.py文件中MainWindow类的实例self变量作为父类,目的是UI_MainWindow实例做mai文件中的UI界面。
通常,在main.py,这样调用setup_ui方法
# SETUP MAIN WINDOW
self.ui = UI_MainWindow()
self.ui.setup_ui(self)
'''
if not parent.objectName(): # 此判断,经测试,一定会进入
parent.setObjectName("MainWindow") #TODO(wangjh-xm): 暂时不清楚setObjectName的作用效果。
# print('test')
# SET INITIAL PARAMETERS
# ///
parent.resize(1200, 720) # 重新设启动时的界面大小
parent.setMinimumSize(960, 540) # 设置手动调整的最小尺寸
- main.py文件中的调用方式
- 导入UI_MainWindow类,并生成self.ui实例变量。通过 self.ui.setup_ui(self) 让self.ui作为MainWindow实例变量self的界面。
# IMPORT MODULES
import sys
import os
# IMPORT QT CORE
from qt_core import *
# IMPORT MAIN WINDOW
from gui.windows.main_window.ui_main_window import UI_MainWindow
# MAIN WINDOW
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
self.setWindowTitle("Python3.9 PySide6 Learning")
# SETUP MAIN WINDOW
self.ui = UI_MainWindow()
self.ui.setup_ui(self)
# SHOW APP
self.show()
if __name__ == "__main__":
app = QApplication(sys.argv)
app.setWindowIcon(QIcon("icon.ico"))
window = MainWindow()
# window.show() # 展示我们的app 窗口,或者在MainWindow()构造函数中写self.show()
sys.exit(app.exec())
- ui_main_window.py代码增加:实现典型UI布局设计: menu(左侧) + content(右侧)
QFrame画布的作用:主要控制边框样式,继承自QWidget
主要思路:
- 创建一个中央画布central_frame
- 创建主布局main_layout,设定中央画布中的控件布局方式是水平(H,推荐)/垂直(V)布局
- 创建一个左侧菜单画布left_menu,同时创建一个右侧内容画布content,通过CCS格式,设定其背景颜色,便于区分不同画布
- 调用主布局增加窗口的方法 main_layout.addWidget,将左右侧画布依次加到主布局中
- 设置父类中央窗口parent.setCentralWidgets是中央画布central_frame
美化思路:
-
在主布局中,边缘间隔setContentsMargins设定成0,左右画布中间间隔setSpacing也设置成0
-
左菜单栏最大宽度(水平布局)/高度(垂直布局) setMaximumWidth/setMaximumHeight,设定成50
- 水平布局
- 水平布局
# IMPORT QT CORE
from qt_core import *
# MAIN WINDOW
class UI_MainWindow(object):
def setup_ui(self, parent):
'''parent: 一般由 main.py文件中MainWindow类的实例self变量作为父类,目的是UI_MainWindow实例做mai文件中的UI界面。
通常,在main.py,这样调用setup_ui方法
# SETUP MAIN WINDOW
self.ui = UI_MainWindow()
self.ui.setup_ui(self)
'''
if not parent.objectName(): # 此判断,经测试,一定会进入
parent.setObjectName("MainWindow") # TODO(wangjh-xm): 暂时不清楚setObjectName的作用效果。
# print('test')
# SET INITIAL PARAMETERS
# ///
parent.resize(1200, 720) # 重新设启动时的界面大小
parent.setMinimumSize(960, 540) # 设置手动调整的最小尺寸
# CREATE CENTRAL WIDGET
self.central_frame = QFrame()
# CREATE MAIN LAYOUT
self.main_layout = QHBoxLayout(self.central_frame)
self.main_layout.setContentsMargins(0, 0, 0, 0)
self.main_layout.setSpacing(0)
# LEFT MANU
self.left_menu = QFrame()
self.left_menu.setStyleSheet("background-color: #44475a")
self.left_menu.setMaximumWidth(50)
# CONTENT
self.content = QFrame()
self.content.setStyleSheet("background-color: #282a36")
# ADD WIDGETS TO APP
self.main_layout.addWidget(self.left_menu)
self.main_layout.addWidget(self.content)
# SET CENTRAL
parent.setCentralWidget(self.central_frame)
- 垂直布局
# IMPORT QT CORE
from qt_core import *
# MAIN WINDOW
class UI_MainWindow(object):
def setup_ui(self, parent):
'''parent: 一般由 main.py文件中MainWindow类的实例self变量作为父类,目的是UI_MainWindow实例做mai文件中的UI界面。
通常,在main.py,这样调用setup_ui方法
# SETUP MAIN WINDOW
self.ui = UI_MainWindow()
self.ui.setup_ui(self)
'''
if not parent.objectName(): # 此判断,经测试,一定会进入
parent.setObjectName("MainWindow") # TODO(wangjh-xm): 暂时不清楚setObjectName的作用效果。
# print('test')
# SET INITIAL PARAMETERS
# ///
parent.resize(1200, 720) # 重新设启动时的界面大小
parent.setMinimumSize(960, 540) # 设置手动调整的最小尺寸
# CREATE CENTRAL WIDGET
self.central_frame = QFrame()
# CREATE MAIN LAYOUT
self.main_layout = QVBoxLayout(self.central_frame)
self.main_layout.setContentsMargins(0, 0, 0, 0)
self.main_layout.setSpacing(0)
# LEFT MANU
self.left_menu = QFrame()
self.left_menu.setStyleSheet("background-color: #44475a")
self.left_menu.setMaximumHeight(50)
# CONTENT
self.content = QFrame()
self.content.setStyleSheet("background-color: #282a36")
# ADD WIDGETS TO APP
self.main_layout.addWidget(self.left_menu)
self.main_layout.addWidget(self.content)
# SET CENTRAL
parent.setCentralWidget(self.central_frame)



