【Qt】之【PyQt】实现点击按钮页面来回跳转

原创已于 2024-05-13 14:11:18 修改 · 5.2k 阅读

55 ·

本内容遵循CC 4.0 BY-SA版权协议

HpaxlY

收录于

python

于 2022-07-20 09:15:46 首次发布

这篇博客介绍了如何使用PyQt5构建主页面和登录界面，包括按钮的创建、槽函数的编写以及信号与槽的连接。主页面有一个登录按钮，点击后能切换到登录界面，而登录界面有一个返回按钮。通过信号槽机制，实现了从登录界面返回主页面的功能。博客中详细展示了各个函数的定义和连接过程，包括自定义信号的创建和触发。

该文章已生成可运行项目，

1.主页面初步显示（只有一个按钮）：
ui_test.py

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


class TestUI(QWidget):
    # 相当于构造函数
    def __init__(self):
        super().__init__()
        self.loginBtn = QPushButton("请登录", self)  # 按钮
        self.setWindowTitle("测试界面")
        self.setFixedSize(700, 500)
        self.setWindowIcon(QIcon("img/rubs.png"))  # ------没显示图标
        # 调用ui设置函数
        self.init_ui()
        
	# 初始化窗口
    def init_ui(self):
        pass


# 1.创建应用
app = QApplication(sys.argv)
# 2.创建窗口
testView = TestUI()
# 3.窗口显示 show
testView.show()
# 4.程序运行
sys.exit(app.exec())

在这里插入图片描述
2.登录界面初步显示：
ui2_test.py

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


class Test2UI(QWidget):
    # 相当于构造函数
    def __init__(self):
        super().__init__()
        self.loginBtn = QPushButton("返回", self)  # 按钮
        self.setWindowTitle("跳转界面")
        self.setFixedSize(700, 500)
        self.setWindowIcon(QIcon("img/rubs.png"))  # ------没显示图标
        # 调用ui设置函数
        self.init_ui()
        
	# 初始化窗口
    def init_ui(self):
        pass

# 1.创建应用
app = QApplication(sys.argv)
# 2.创建窗口
test2View = Test2UI()
# 3.窗口显示 show
test2View.show()
# 4.程序运行
sys.exit(app.exec())

在这里插入图片描述
3、主页面写按钮的槽函数和连接
初始化连接函数中连接按钮和槽函数
按钮.clicked.connect(槽函数)

    # 初始化连接  调用该函数
    def init_connection(self):
        # 点击按钮执行槽函数
        
        self.loginBtn.clicked.connect(self.toLogin)

4、编写主页面槽函数toLogin，引入登陆类
from 库名（另一个文件名） import 类名

# 引入登陆类
from ui2_test import Test2UI
# from 库名（另一个文件名） import 类名

 # 登录函数
    def toLogin(self):
        # 判断按钮内容是登陆的话
        # 创建登陆界面
        self.loginWin=LoginWin()
        # 隐藏当前界面
        self.hide()
        # 弹出登陆界面
        self.loginWin.show()

主界面调用连接函数

 self.init_connection()

测试(主界面->登陆界面)_:
在这里插入图片描述

接下来编写从登陆界面返回到主界面代码
登陆界面登录验证成功后回到主界面
登录界面创建连接函数和按钮槽函数

    # 初始化连接  调用该函数
    def init_connection(self):
        # 登录跳转函数，返回主界面
        self.loginBtn.clicked.connect(self.doLogin)

    def doLogin(self):
        pass

登陆界面定义自定义信号发送给主界面

    # 自定义返回信号  信号传参
    back_signal=pyqtSignal(str)

    def doLogin(self):
        # pass
        #触发发送自定义返回信号给主界面,传递参数
        self.back_signal.emit("小月")

主界面的登陆窗口对象要connect触发发送信号

self.loginWin.back_signal.connect(self.successlogin)

主界面登陆成功槽函数

 # 登陆成功槽函数
 def successlogin(self, name):
        # 登陆界面隐藏，
        self.test2.hide()
        # 显示主界面，
        self.show()
        # 用户名显示到主界面，
        # 主界面登录按钮显示为退出）

在这里插入图片描述

完整代码：
主界面：

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *
from ui2_test import Test2UI
# from .ui2_test import Test2UI
class TestUI(QWidget):
    # 相当于构造函数
    def __init__(self):
        super().__init__()
        self.test2 = Test2UI()
        self.loginBtn = QPushButton("请登录", self)  # 按钮
        self.loginBtn.move(50, 50)
        self.setWindowTitle("测试界面")
        self.setFixedSize(700, 500)
        self.setWindowIcon(QIcon("img/rubs.png"))  # ------没显示图标
        # 调用ui设置函数
        self.init_ui()
        self.init_connection()

    def init_ui(self):
        pass

    # 初始化数据
    def init_data(self):
        pass

    # 初始化连接  调用该函数
    def init_connection(self):
        # 点击按钮执行槽函数
        self.loginBtn.clicked.connect(self.toLogin)
        self.test2.back_signal.connect(self.successlogin)

    def toLogin(self):
        # 判断按钮内容是登陆的话
        # 创建登陆界面
        # 隐藏当前界面
        self.hide()
        # 弹出登陆界面
        self.test2.show()

        # 登陆成功槽函数

    def successlogin(self, name):
        # 登陆界面隐藏，
        self.test2.hide()
        # 显示主界面，
        self.show()
        # 用户名显示到主界面，
        # 主界面登录按钮显示为退出）


if __name__ == '__main__':
    # 1.创建应用
    app = QApplication(sys.argv)
    # 2.创建窗口
    testView = TestUI()
    # 3.窗口显示 show
    testView.show()
    # 4.程序运行
    sys.exit(app.exec())

目标界面：

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


class Test2UI(QWidget):
    # 自定义返回信号  信号传参
    back_signal=pyqtSignal(str)
    # 相当于构造函数
    def __init__(self):
        super().__init__()

        self.setWindowTitle("登录界面")
        self.setFixedSize(700, 500)
        self.setWindowIcon(QIcon("img/rubs.png"))  # ------没显示图标
        # 调用ui设置函数
        self.init_ui()
        self.init_connection()

    def init_ui(self):
        self.loginBtn = QPushButton("返回", self)  # 按钮
        self.loginBtn.move(50, 50)

    # 初始化数据
    def init_data(self):
        pass

    # 初始化连接  调用该函数
    def init_connection(self):
        # 登录跳转函数，返回主界面
        self.loginBtn.clicked.connect(self.doLogin)

    def doLogin(self):
        # pass
        # 触发发送自定义返回信号给主界面
        self.back_signal.emit("小月")