使用 Qt Designer创建前端界面,通过VS Code将Qt Designer创建好的.ui转换为.py，最后使用PyQt5实现点击按钮界面发生跳转

简单的提一下PyQt5，Qt Designer的安装

python 版本：3.6.2
使用pip安装：

pip3 install PyQt5

之后通过安装PyQt5-tools，会自动安装Qt Designer

pip install PyQt5-tools

比着这个学的安装，所以
推荐教程：http://code.py40.com/face

想实现的功能：点击第一张图片中的“进入系统”，自动跳转到第二张图片。

就这么一个简单的内容，我几乎看遍了所有的博客，所有的教程，还是解决不了。
一气之下，自己又开始闭门造车了！

主要的步骤详解

• 1. 使用 Qt Designer 画出我们需要的界面
  
  • a) 打开Qt Designer
    
    • 默认Qt Designer的位置在：安装Python目录->Lib->site-packages->pyqt5-tools
      
      • 关于python安装目录，请参见上一篇博客
  • b) 直接点击“Create”,如下图
  • 
  • c) 拖入一个“TextLabel”框和两个“PushButton”按钮，并在右侧属性中找到“QAbstractButton->text”，将三者的值一次改为“不知名系统”，“进入系统”，“退出系统”。 接下来我们随便保存一个位置[我保存在了桌面上]，可以看到文件后缀为.ui，正常的方法打不开。
  • d) 同理，第二个UI请自己制作。
  • e) 这里，默认，你已经制作好了两个.ui文件，我制作的名字为：welcom.ui 和 welcom2.ui
• 2. 使用 Vs Code 将.ui转化为.py
  
  • 1> 默认你已经装好了VS code，Py Charm 也行，就是方式可能不一样。
  • 2> 默认已经在VS Code的应用商店下载安装好了pyqt的扩展包
  • 3> 在工作区中打开桌面，如图
  • 
  • 4> 找到刚刚创建的那两个.ui文件
  • 5> 点击->击右键->PyQT:Complite Form
  • 6> 在桌面上已经生成的对应的.py文件，他们的名字后面会用到
  • 
• 3. 使用PyQt5实现点击按钮界面跳转
  
  • 1> 在桌面上新建一个名为Jump.py文件。
  • 2> 为了进行区别，我们把第二个.py文件，也就是Ui_welcom2.py中类的名字改成 Ui_Main2,Ui_welcom.py中类的名字改为Ui_Main
  • 源文件内容如下

Jump.py中的内容

# Jump.py
from PyQt5 import QtCore, QtGui, QtWidgets
from Ui_welcom import Ui_Main
from Ui_welcom2 import Ui_Main2

class Ui_Dialog(QtWidgets.QWidget,Ui_Main2):
    def __init__(self):
        super(Ui_Dialog,self).__init__()
        self.setupUi(self)

#主界面
class login(QtWidgets.QMainWindow,Ui_Main):
    def __init__(self):
        super(login,self).__init__()
        self.setupUi(self)
    #定义登录按钮的功能
    def loginEvent(self):
        self.hide()
        self.dia = Ui_Dialog()
        self.dia.show()

#运行窗口Login
if __name__=="__main__":
    import sys
    app=QtWidgets.QApplication(sys.argv)
    first=login()
    first.show()
    first.pushButton.clicked.connect(first.loginEvent)
    sys.exit(app.exec_())

Ui_welcom.py 中的内容

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

# Form implementation generated from reading ui file 'c:\Users\HP\Desktop\welcom.ui'
#
# Created by: PyQt5 UI code generator 5.10.1
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_Main(object):
    def setupUi(self, Form):
        Form.setObjectName("Form")
        Form.resize(400, 300)
        self.label = QtWidgets.QLabel(Form)
        self.label.setGeometry(QtCore.QRect(130, 80, 72, 20))
        self.label.setObjectName("label")
        self.pushButton = QtWidgets.QPushButton(Form)
        self.pushButton.setGeometry(QtCore.QRect(120, 160, 93, 28))
        self.pushButton.setObjectName("pushButton")
        self.pushButton_2 = QtWidgets.QPushButton(Form)
        self.pushButton_2.setGeometry(QtCore.QRect(120, 230, 93, 28))
        self.pushButton_2.setObjectName("pushButton_2")

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

    def retranslateUi(self, Form):
        _translate = QtCore.QCoreApplication.translate
        Form.setWindowTitle(_translate("Form", "Form"))
        self.label.setText(_translate("Form", "不知名系统"))
        self.pushButton.setText(_translate("Form", "进入系统"))
        self.pushButton_2.setText(_translate("Form", "退出系统"))

Ui_welcom2.py 内容

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

# Form implementation generated from reading ui file 'c:\Users\HP\Desktop\welcom2.ui'
#
# Created by: PyQt5 UI code generator 5.10.1
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_Main2(object):
    def setupUi(self, Form):
        Form.setObjectName("Form")
        Form.resize(400, 300)
        self.label = QtWidgets.QLabel(Form)
        self.label.setGeometry(QtCore.QRect(150, 50, 91, 16))
        self.label.setObjectName("label")
        self.pushButton = QtWidgets.QPushButton(Form)
        self.pushButton.setGeometry(QtCore.QRect(150, 160, 93, 28))
        self.pushButton.setObjectName("pushButton")
        self.pushButton_2 = QtWidgets.QPushButton(Form)
        self.pushButton_2.setGeometry(QtCore.QRect(150, 220, 93, 28))
        self.pushButton_2.setObjectName("pushButton_2")

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

    def retranslateUi(self, Form):
        _translate = QtCore.QCoreApplication.translate
        Form.setWindowTitle(_translate("Form", "Form"))
        self.label.setText(_translate("Form", "不知名步骤"))
        self.pushButton.setText(_translate("Form", "第一关"))
        self.pushButton_2.setText(_translate("Form", "第二关"))

希望对您有所帮助。累死直接。