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

版权声明:そう何簡単な諦めるわけないだろう。。 https://blog.csdn.net/Inuyasha_1314/article/details/80469127
简单的提一下PyQt5,Qt Designer的安装

python 版本:3.6.2
使用pip安装:

pip3 install PyQt5

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

pip install PyQt5-tools

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

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

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

主要的步骤详解

  • 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.uiwelcom2.ui
  • 2. 使用 Vs Code 将.ui转化为.py
    • 1> 默认你已经装好了VS code,Py Charm 也行,就是方式可能不一样。
    • 2> 默认已经在VS Code的应用商店下载安装好了pyqt的扩展包
    • 3> 在工作区中打开桌面,如图
    • 3
    • 4> 找到刚刚创建的那两个.ui文件
    • 5> 点击->击右键->PyQT:Complite Form
    • 6> 在桌面上已经生成的对应的.py文件,他们的名字后面会用到
    • 4
  • 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", "第二关"))

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

猜你喜欢

转载自blog.csdn.net/Inuyasha_1314/article/details/80469127
今日推荐