PyQt5设计GUI（三）多窗口跳转，信号和槽的使用

PyQt5设计GUI（二）为程序设计图形界面

多窗口之间的跳转

在designer中设计多个窗口

要想能跳转，当然得有多个窗口，所以我们在designer中再设计一个窗口，当我们点击主界面的登录按钮时，跳转到这个窗口。
方法还是一样的，拖动控件，设计好后保存为.ui文件，然后将.ui文件转换成.py文件。

通过信号和槽将他们连接起来

什么是信号，槽？
这是designer的一个特色，用户对窗口的操作会发送信号，信号指引槽函数去完成相应的动作。太抽象，举个例子。
主窗口的代码是这样的。

# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'csdn_article.ui'
#
# Created by: PyQt5 UI code generator 5.15.1
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again.  Do not edit this file unless you know what you are doing.


from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(800, 600)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.label_3 = QtWidgets.QLabel(self.centralwidget)
        self.label_3.setGeometry(QtCore.QRect(160, 265, 81, 41))
        font = QtGui.QFont()
        font.setFamily("Arial")
        font.setPointSize(18)
        self.label_3.setFont(font)
        self.label_3.setObjectName("label_3")
        self.lineEdit = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit.setGeometry(QtCore.QRect(280, 190, 231, 31))
        self.lineEdit.setObjectName("lineEdit")
        self.label_2 = QtWidgets.QLabel(self.centralwidget)
        self.label_2.setGeometry(QtCore.QRect(150, 190, 91, 41))
        font = QtGui.QFont()
        font.setFamily("Arial")
        font.setPointSize(18)
        self.label_2.setFont(font)
        self.label_2.setObjectName("label_2")
        self.lineEdit_2 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_2.setGeometry(QtCore.QRect(280, 270, 231, 31))
        self.lineEdit_2.setObjectName("lineEdit_2")
        self.label = QtWidgets.QLabel(self.centralwidget)
        self.label.setGeometry(QtCore.QRect(40, 30, 721, 91))
        font = QtGui.QFont()
        font.setFamily("隶书")
        font.setPointSize(18)
        self.label.setFont(font)
        self.label.setObjectName("label")
        self.pushButton = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton.setGeometry(QtCore.QRect(250, 350, 201, 71))
        self.pushButton.setObjectName("pushButton")
        self.pushButton.clicked.connect(self.close_window)#关闭登录窗口
        self.pushButton.clicked.connect(self.open)#实现跳转的信号语句

        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 26))
        self.menubar.setObjectName("menubar")
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(MainWindow)
        self.statusbar.setObjectName("statusbar")
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
        self.label_3.setText(_translate("MainWindow", "密码"))
        self.label_2.setText(_translate("MainWindow", "用户名"))
        self.label.setText(_translate("MainWindow", "通往新世界的大门已经打开，各位勇士你们准备好了吗"))
        self.pushButton.setText(_translate("MainWindow", "登录"))

    def open(self,m):
        import tiaozhuan      #调用tiaozhuan.py
        self.m = tiaozhuan.Ui_MainWindow()  #实例化tiaozhuan.py中的Ui_MainWindow类
        self.m.show()#show()方法显示窗口

    def close_window(self):
        MainWindow.close()#关闭的时候要用窗口的实例化对象来关闭，不能用self

import sys
if __name__ == '__main__':
   app = QtWidgets.QApplication(sys.argv)
   MainWindow = QtWidgets.QMainWindow() # 创建窗体对象
   ui = Ui_MainWindow() # 创建PyQt设计的窗体对象
   ui.setupUi(MainWindow) # 调用PyQt窗体的方法对窗体对象进行初始化设置
   MainWindow.show() # 显示窗体
   sys.exit(app.exec_()) # 程序关闭时退出进程

上面我们完成窗口跳转的语句是这样的。

信号

self.pushButton.clicked.connect(self.open)

槽函数

    def open(self,m):
        import tiaozhuan
        self.m = tiaozhuan.Ui_MainWindow()
        self.m.show()

所以我们要完成跳转，得经历下面几步：

1.添加信号与槽

在需要添加信号的控件上，添加语句。比如我们在object name 为pushButton的登录按钮上添加信号，连接到open()槽函数，open槽函数的作用是打开新窗口。

self.pushButton.clicked.connect(self.open)

• self : 代表Ui_MainWindow的实例化对象
• pushbutton : 登录按钮的object name
• clicked : 信号意思是当用户点击登录按钮时将信号发送给槽函数
• connect : 信号和槽函数的连接语法
• open ：槽函数，即接收到信号后调用该函数

    def open(self,m):
        import tiaozhuan   #调用tiaozhuan.py
        self.m = tiaozhuan.Ui_MainWindow()#实例化tiaozhuan.py中的Ui_MainWindow类
        self.m.show()#show()方法显示窗口

• import tiaozhuan : tiaozhuan是新窗口的名称，tiaozhuan.py。
  另外，在打开新窗口的同时，我们要关闭掉原来的登录窗口，方法相同，在登录按钮上添加信号。

信号

self.pushButton.clicked.connect(self.close_window)

槽函数

    def close_window(self):
        MainWindow.close()#关闭的时候要用窗口的实例化对象来关闭，不能用self

这里一定要注意，关闭窗口时必须用真正的实例化对象调用close()方法。而不能用self代替。

2.修改被调用的窗口

# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'tiaozhuan.ui'
#
# Created by: PyQt5 UI code generator 5.15.1
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again.  Do not edit this file unless you know what you are doing.


from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *

class Ui_MainWindow(QMainWindow):#将object改为QMainWindow
    def __init__(self):          #添加初始化函数
        super(Ui_MainWindow,self).__init__()
        self.setupUi(self)
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(309, 639)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.toolBox = QtWidgets.QToolBox(self.centralwidget)
        self.toolBox.setGeometry(QtCore.QRect(10, 10, 281, 541))
        self.toolBox.setMaximumSize(QtCore.QSize(281, 16777215))
        self.toolBox.setObjectName("toolBox")
        self.page = QtWidgets.QWidget()
        self.page.setGeometry(QtCore.QRect(0, 0, 281, 425))
        self.page.setObjectName("page")
        self.toolBox.addItem(self.page, "")
        self.page_3 = QtWidgets.QWidget()
        self.page_3.setGeometry(QtCore.QRect(0, 0, 281, 425))
        self.page_3.setObjectName("page_3")
        self.layoutWidget = QtWidgets.QWidget(self.page_3)
        self.layoutWidget.setGeometry(QtCore.QRect(11, 21, 101, 291))
        self.layoutWidget.setObjectName("layoutWidget")
        self.verticalLayout = QtWidgets.QVBoxLayout(self.layoutWidget)
        self.verticalLayout.setContentsMargins(0, 0, 0, 0)
        self.verticalLayout.setObjectName("verticalLayout")
        self.label_6 = QtWidgets.QLabel(self.layoutWidget)
        self.label_6.setStyleSheet("border-image: url(:/png/images/周杰伦.jpg);")
        self.label_6.setText("")
        self.label_6.setObjectName("label_6")
        self.verticalLayout.addWidget(self.label_6)
        self.label_8 = QtWidgets.QLabel(self.layoutWidget)
        self.label_8.setStyleSheet("border-image: url(:/png/images/林俊杰.jpg);")
        self.label_8.setText("")
        self.label_8.setObjectName("label_8")
        self.verticalLayout.addWidget(self.label_8)
        self.label_7 = QtWidgets.QLabel(self.layoutWidget)
        self.label_7.setStyleSheet("border-image: url(:/png/images/王力宏.jpg);")
        self.label_7.setText("")
        self.label_7.setObjectName("label_7")
        self.verticalLayout.addWidget(self.label_7)
        self.layoutWidget_2 = QtWidgets.QWidget(self.page_3)
        self.layoutWidget_2.setGeometry(QtCore.QRect(130, 20, 141, 291))
        self.layoutWidget_2.setObjectName("layoutWidget_2")
        self.verticalLayout_2 = QtWidgets.QVBoxLayout(self.layoutWidget_2)
        self.verticalLayout_2.setContentsMargins(0, 0, 0, 0)
        self.verticalLayout_2.setObjectName("verticalLayout_2")
        self.label_2 = QtWidgets.QLabel(self.layoutWidget_2)
        font = QtGui.QFont()
        font.setFamily("Arial")
        font.setPointSize(18)
        self.label_2.setFont(font)
        self.label_2.setObjectName("label_2")
        self.verticalLayout_2.addWidget(self.label_2)
        self.label_3 = QtWidgets.QLabel(self.layoutWidget_2)
        font = QtGui.QFont()
        font.setFamily("Arial")
        font.setPointSize(18)
        self.label_3.setFont(font)
        self.label_3.setObjectName("label_3")
        self.verticalLayout_2.addWidget(self.label_3)
        self.label_5 = QtWidgets.QLabel(self.layoutWidget_2)
        font = QtGui.QFont()
        font.setFamily("Arial")
        font.setPointSize(18)
        self.label_5.setFont(font)
        self.label_5.setObjectName("label_5")
        self.verticalLayout_2.addWidget(self.label_5)
        self.toolBox.addItem(self.page_3, "")
        self.page_4 = QtWidgets.QWidget()
        self.page_4.setGeometry(QtCore.QRect(0, 0, 281, 425))
        self.page_4.setObjectName("page_4")
        self.toolBox.addItem(self.page_4, "")
        self.page_2 = QtWidgets.QWidget()
        self.page_2.setGeometry(QtCore.QRect(0, 0, 281, 425))
        self.page_2.setObjectName("page_2")
        self.toolBox.addItem(self.page_2, "")
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 309, 26))
        self.menubar.setObjectName("menubar")
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(MainWindow)
        self.statusbar.setObjectName("statusbar")
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        self.toolBox.setCurrentIndex(1)
        self.toolBox.layout().setSpacing(6)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "QQ"))
        self.toolBox.setItemText(self.toolBox.indexOf(self.page), _translate("MainWindow", "家人"))
        self.label_2.setText(_translate("MainWindow", "周杰伦"))
        self.label_3.setText(_translate("MainWindow", "林俊杰"))
        self.label_5.setText(_translate("MainWindow", "王力宏"))
        self.toolBox.setItemText(self.toolBox.indexOf(self.page_3), _translate("MainWindow", "朋友"))
        self.toolBox.setItemText(self.toolBox.indexOf(self.page_4), _translate("MainWindow", "同事"))
        self.toolBox.setItemText(self.toolBox.indexOf(self.page_2), _translate("MainWindow", "致热爱学习的我们"))
import csdn_img_rc

需要修改两处：

• class Ui_MainWindow(QMainWindow):将object改为QMainWindow

• def __init__(self): #添加初始化函数 super(Ui_MainWindow,self).__init__() self.setupUi(self)

  在类中添加初始化函数

3.运行主窗口
直接运行主窗口，你就能看到心心恋恋的GUI啦！

注意：在本例中如果想运行该程序，还得加上一个文件。
因为在tiaozhuan.py这个窗口中我们引入了3张图片。怎么解决呢，将资源文件放置在与tiaozhuan.py文件的相同目录下即可。
资源文件的代码链接：(放一块字数文章太长，发不出来。。。)
https://download.csdn.net/download/leidawangzi/13613277

资源文件是怎么得到的呢？进入下一节，我们一起学习如何给控件添加图片。
PyQt5设计GUI（四）为控件添加图片

参考书目：Python GUI设计(PyQt5从入门到实战)—明日科技