【pyqt5入门笔记二】做一个最简单的界面(qt+python+vs2017)

配置见博客: https://blog.csdn.net/qq_43685399/article/details/107077680
1. 使用VS2017创建一个python项目,我取的项目名称为test
2. 点击VS的菜单栏->工具->外部工具->PyQt5Designer (笔记一里面配置好的),打开QT Designer界面如下:

注意:如果没有配置,直接打开QT软件中的Qt Designer,同样按照下面的步骤新建一个界面
在这里插入图片描述

  • 点击新建之后,这里我们就新建一个主窗口就行了,如下:
    在这里插入图片描述
  • 创建好后如下图:
    在这里插入图片描述
3. 画好自己想要的界面,如下图

在这里插入图片描述

  • 这里我只用了四种控件:Lable、Line Edit、Text Browser、Push Button
    Lable:在这里用于提示,相当于便签条的作用,拖入窗口之后双击可以编辑文字
    Line Edit:用于用户输入,顾名思义每次只能输入一行,想输入多行可以用Text Edit
    Text Browser:在这里用作输出显示
    Push Button:在这里用于点击触发相关操作
  • 右边是控件的ID,我这里并没有改,都是用的默认,想要改的话就点击需要改的控件,在右边的属性框中找到objectName,右边就是ID,注意一定是唯一的
    在这里插入图片描述
4. 获取界面的python代码(没有配置的看红字)
  • 文件画好界面之后保存,回到VS,快捷键ctrl+o(或者菜单栏->文件->打开->文件)打开项目所在文件夹,可以看见出现了一个test_form.ui文件(为什么叫这个名字可以看笔记一),这个就是我们画好的界面文件了【这里我后来又加了一个退出按钮和一个重置按钮,上面的图懒得重新截了
  • 再点击VS的菜单栏->工具->外部工具->pyUic5(笔记一里面配置好的),命令执行完后,再次ctrl+o可以看见项目所在文件夹里出现了一个test_form.py文件,这个文件就是由test_form.ui转化而来的.py文件。
  • 注意:如果没有配置,画好界面之后,保存成为一个.ui文件,使用命令行将.ui文件转化成.py文件(当然前提是你装了pyqt5的包)
  • 打开cmd命令框,进入.ui文件所在目录(至于怎么进目录,自己去看cd命令),在cmd窗口输入以下命令,其中test_form.ui是我保存的界面的名字,test_form.py是我最终转化的python代码文件的名字。
pyuic5 -o test_form.py test_form.ui

窗口的python代码如下:

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

# Form implementation generated from reading ui file 'test_form.ui'
#
# Created by: PyQt5 UI code generator 5.15.0
#
# 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(541, 361)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.label = QtWidgets.QLabel(self.centralwidget)
        self.label.setGeometry(QtCore.QRect(10, 20, 72, 15))
        self.label.setObjectName("label")
        self.lineEdit = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit.setGeometry(QtCore.QRect(70, 20, 441, 21))
        self.lineEdit.setObjectName("lineEdit")
        self.textBrowser = QtWidgets.QTextBrowser(self.centralwidget)
        self.textBrowser.setGeometry(QtCore.QRect(70, 60, 441, 151))
        self.textBrowser.setObjectName("textBrowser")
        self.label_2 = QtWidgets.QLabel(self.centralwidget)
        self.label_2.setGeometry(QtCore.QRect(10, 70, 72, 15))
        self.label_2.setObjectName("label_2")
        self.pushButton = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton.setGeometry(QtCore.QRect(70, 240, 93, 28))
        self.pushButton.setObjectName("pushButton")
        self.lineEdit_2 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_2.setGeometry(QtCore.QRect(30, 300, 113, 21))
        self.lineEdit_2.setObjectName("lineEdit_2")
        self.lineEdit_3 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_3.setGeometry(QtCore.QRect(290, 300, 113, 21))
        self.lineEdit_3.setObjectName("lineEdit_3")
        self.pushButton_2 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_2.setGeometry(QtCore.QRect(420, 300, 93, 28))
        self.pushButton_2.setObjectName("pushButton_2")
        self.label_3 = QtWidgets.QLabel(self.centralwidget)
        self.label_3.setGeometry(QtCore.QRect(150, 300, 151, 20))
        self.label_3.setObjectName("label_3")
        self.pushButton_3 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_3.setGeometry(QtCore.QRect(420, 240, 93, 28))
        self.pushButton_3.setObjectName("pushButton_3")
        self.pushButton_4 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_4.setGeometry(QtCore.QRect(240, 240, 93, 28))
        self.pushButton_4.setObjectName("pushButton_4")
        MainWindow.setCentralWidget(self.centralwidget)

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

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "一个简单的程序"))
        self.label.setText(_translate("MainWindow", "输入:"))
        self.label_2.setText(_translate("MainWindow", "记录:"))
        self.pushButton.setText(_translate("MainWindow", "记录"))
        self.pushButton_2.setText(_translate("MainWindow", "转换"))
        self.label_3.setText(_translate("MainWindow", "人民币转换为美元->"))
        self.pushButton_3.setText(_translate("MainWindow", "退出"))
        self.pushButton_4.setText(_translate("MainWindow", "重置所有"))
  • 注意这个代码是不能直接执行的,因为没有执行的函数
5. 编写代码测试
  • 因为这只是一个简单的测试,所以我们就不用两个文件了,直接把test_form.py中的代码复制到test.py中,加入以下代码进行测试
import sys
from PyQt5 import QtCore, QtGui, QtWidgets
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
#这里复制test_form.py中完整的代码!!!
if __name__ == '__main__':
    app = QApplication(sys.argv)
    MainWindow = QMainWindow()
    ui = Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())
  • 运行结果如下:
    在这里插入图片描述
  • 可以看到我们刚刚画的界面显示出来了,但是只是一个界面,逻辑功能还没实现,所以按钮并没有任何用处
6. 实现逻辑功能模块
  • 注意:我们现在打开了两个py文件,一个是新建python项目的时候创建的test.py,另一个是刚刚转换完成的test_form.py文件,test_form.py文件可以不用改动,作为自定义模块存在
  • test.py文件中写入以下代码:
from test_form import *  #包含模块
import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *

class Function(QWidget, Ui_MainWindow):
    #构造函数
    def __init__(self):
        #继承图形界面的所有成员
        super(Function, self).__init__()
        #建立并显示界面
        self.setupUi(self)
        self.show()
        
        #"记录"按钮的点击事件[pushButton、pushButton_2等是对应按钮的ID]
        self.pushButton.clicked.connect(self.Record)
        #"转换"按钮的点击事件
        self.pushButton_2.clicked.connect(self.Change)
        #"退出"按钮的点击事件,直接调用quit方法
        self.pushButton_3.clicked.connect(QCoreApplication.instance().quit)
        #"重置所有"按钮的点击事件
        self.pushButton_4.clicked.connect(self.Reset)

    #[self.后面紧跟的都是对应控件的ID,相当于对象]
    #记录函数
    def Record(self):
        #使用.text()方法,获取lineEdit框中由用户输入的文字
        input = self.lineEdit.text()
        #使用.append()方法,将获取到的内容显示在textBrowser中,每次一行,过长会自动换行
        self.textBrowser.append(input)
    
    #转换函数
    def Change(self):
        #使用.text()方法,获取用户在lineEdit_2中输入的钱数
        inputRMB = self.lineEdit_2.text()
        #进行汇率转换,读取到的是str类型,要转换成float类型进行计算
        Dollar = float(inputRMB) * 0.1415
        output = round(Dollar, 3)   #四舍五入保留3位小数
        #使用.setText方法,将lineEdit_3的值设置为转化后的值,也相当于输出
        self.lineEdit_3.setText(str(output))

    #重置函数,调用.clear()方法清除控件中的内容
    def Reset(self):
        self.lineEdit.clear()
        self.lineEdit_2.clear()
        self.lineEdit_3.clear()
        self.textBrowser.clear()

if __name__ == '__main__':
    app = QApplication(sys.argv)
    fu = Function() #创建对象,会调用构造函数
    sys.exit(app.exec_())
  • 运行的时候报错,然后我把test_form.py文件中的下面的这句注释,就可以了,具体为什么我不太清楚,有知道的大佬望告知,感激不尽!
    在这里插入图片描述
7. 最终的运行结果
  • 点击记录可以把输入的东西显示在下面,点击几次加几行
  • 点击全部重置可以把所有窗口清空
  • 点击转换可以把左边输入的钱数按汇率转换成美元输出在右边
  • 点击退出可以退出窗口
    在这里插入图片描述

这是我认为的比较简单的一个程序,毕竟是刚学,怕忘了特此记录一下。
仍有不足,欢迎交流

猜你喜欢

转载自blog.csdn.net/qq_43685399/article/details/107085873