PyQt5入门系列3:为UI界面编写后台逻辑

获取更多文章和更新,请关注我的个人主页:https://leiting6.cn

常见控件的属性和方法

使用QtCreator设计UI界面的时候,我们已经对控件有了一个大概的认知,其中用到的label,lineEdit,pushButton都是控件,而这些控件自身也是会绑定一些属性和方法的,包括提及到的居中对齐、显示内容、大小、设置只读等等。属性当然可以手动添加设置,但是既然使用了QtCreator,好处就是在一个可视化IDE里面设计好界面,再使用pyuic5生成python文件,打开python文件我们也能看到各种属性设置相关的代码,比如:

  • lineEdit的矩形大小
self.lineEdit_Adder1.setGeometry(QtCore.QRect(10, 40, 51, 20))
  • 设置居中对齐
self.label_plus.setAlignment(QtCore.Qt.AlignCenter)
  • 设置按钮上显示的内容
self.pushButton_calc.setText(_translate("MainWindow", "计算"))
  • 设置lineEdit为只读
self.lineEdit_sum.setReadOnly(True)

等等,非常方便和直观。像setGeometry、setAlignment、setText、setReadOnly都是各个控件的方法,正确使用即可以让控件实现不同的功能。

为了实现一个加法器的功能:点击计算按钮时,从可输入的文本框中读取adder1和adder2的数值,计算两数之和,显示到结果文本框中。因此,我们要使用到的方法有:

  • pushButton:点击按钮,链接到计算两数之和的方法
pushButton.clicked.connect(...)
  • lineEdit:读取内容
lineEdit.text()
  • lineEdit:设置显示内容
lineEdit.setText(...)

知道了这些方法就足够完成简易加法器的设计了。需要查看方法的详细内容和更多控件的更多属性或方法,可以到QT官网仔细翻阅;只是QT官网给出的都是C++环境下的表述,但是多看一些也就能举一反三顺利转换过来用了。

点击跳转到QT官网查看关于lineEdit控件的说明

在Ui_MainWindow类中添加2个方法

setupFunction()方法

自动生成的setupUi()方法会在类外代码中被执行,这样UI界面就会按照预先设计好的样子来呈现;既然要实现一些功能(这里是点击计算按钮来计算两数之和),自然想到的是编写一个setupFunction()方法来初始化需要的功能。方法内容如下:

def setupFunction(self):
        self.pushButton_calc.clicked.connect(self.get_sum)

这个方法的内容十分简单,只有一个按键链接的功能。这行代码的意思是:当pushButton_calc(计算按钮)被按下时,执行get_sum()方法中的功能。

get_sum()方法

get_sum()方法的内容则是:

def get_sum(self):
        adder1 = self.lineEdit_Adder1.text()    # 获取第一个文本框中的内容存入adder1
        adder2 = self.lineEdit_Adder2.text()    # 获取第二个文本框中的内容存入adder2
        sum = int(adder1) + int(adder2)         # 将adder1和adder2强制转换为整形,计算出两数之和存入sum
        self.lineEdit_sum.setText(str(sum))     # 将sum强制转换为字符串,填入lineEdit_sum

这个函数的内容也不复杂,注释也作了简要的说明,需要注意的是,对lineEdit的操作,不管是读取内容还是填入内容,对象都是字符串,所以计算两数之和的时候中间要经过一轮从字符串到整形的转换,和C语言中差不多。

main.py全部代码现在就是下面这个样子:

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

# Form implementation generated from reading ui file 'mainwindow.ui'
#
# Created by: PyQt5 UI code generator 5.5.1
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets
import sys

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(314, 120)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.label_MainTitle = QtWidgets.QLabel(self.centralwidget)
        self.label_MainTitle.setGeometry(QtCore.QRect(3, 10, 311, 20))
        font = QtGui.QFont()
        font.setPointSize(15)
        self.label_MainTitle.setFont(font)
        self.label_MainTitle.setAlignment(QtCore.Qt.AlignCenter)
        self.label_MainTitle.setObjectName("label_MainTitle")
        self.lineEdit_Adder1 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_Adder1.setGeometry(QtCore.QRect(10, 40, 51, 20))
        self.lineEdit_Adder1.setObjectName("lineEdit_Adder1")
        self.lineEdit_Adder2 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_Adder2.setGeometry(QtCore.QRect(90, 40, 51, 20))
        self.lineEdit_Adder2.setObjectName("lineEdit_Adder2")
        self.lineEdit_sum = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_sum.setGeometry(QtCore.QRect(170, 40, 51, 20))
        self.lineEdit_sum.setReadOnly(True)
        self.lineEdit_sum.setObjectName("lineEdit_sum")
        self.label_plus = QtWidgets.QLabel(self.centralwidget)
        self.label_plus.setGeometry(QtCore.QRect(60, 40, 31, 20))
        font = QtGui.QFont()
        font.setPointSize(12)
        self.label_plus.setFont(font)
        self.label_plus.setAlignment(QtCore.Qt.AlignCenter)
        self.label_plus.setObjectName("label_plus")
        self.label_equals = QtWidgets.QLabel(self.centralwidget)
        self.label_equals.setGeometry(QtCore.QRect(140, 40, 31, 20))
        font = QtGui.QFont()
        font.setPointSize(12)
        self.label_equals.setFont(font)
        self.label_equals.setAlignment(QtCore.Qt.AlignCenter)
        self.label_equals.setObjectName("label_equals")
        self.pushButton_calc = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_calc.setGeometry(QtCore.QRect(230, 40, 75, 23))
        self.pushButton_calc.setObjectName("pushButton_calc")
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 314, 23))
        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", "加法器"))
        self.label_MainTitle.setText(_translate("MainWindow", "简易加法器"))
        self.label_plus.setText(_translate("MainWindow", "+"))
        self.label_equals.setText(_translate("MainWindow", "="))
        self.pushButton_calc.setText(_translate("MainWindow", "计算"))
        
    def setupFunction(self):
        self.pushButton_calc.clicked.connect(self.get_sum)
        
    def get_sum(self):
        adder1 = self.lineEdit_Adder1.text()    # 获取第一个文本框中的内容存入adder1
        adder2 = self.lineEdit_Adder2.text()    # 获取第二个文本框中的内容存入adder2
        sum = int(adder1) + int(adder2)         # 将adder1和adder2强制转换为整形,计算出两数之和存入sum
        self.lineEdit_sum.setText(str(sum))     # 将sum强制转换为字符串,填入lineEdit_sum

if __name__ == "__main__":
    app = QtWidgets.QApplication(sys.argv)  # 创建一个QApplication,也就是你要开发的软件app
    MainWindow = QtWidgets.QMainWindow()    # 创建一个QMainWindow,用来装载你需要的各种组件、控件
    ui = Ui_MainWindow()                    # ui是Ui_MainWindow()类的实例化对象
    ui.setupUi(MainWindow)                  # 执行类中的setupUi方法,方法的参数是第二步中创建的QMainWindow
    ui.setupFunction()                      # 执行类中的setupFunction方法
    MainWindow.show()                       # 执行QMainWindow的show()方法,显示这个QMainWindow
    sys.exit(app.exec_())                   # 使用exit()或者点击关闭按钮退出QApplication

在命令行中执行:

python main.py

此时点击计算按钮已经会有反应了,输入几组数据验证一下加法功能是否正常。

PyQt5入门系列3:为UI界面编写后台逻辑_第1张图片
image.png
PyQt5入门系列3:为UI界面编写后台逻辑_第2张图片
image.png

好像没什么问题,所以简易加法器也就这样完成了。当然,这个小程序即使功能简单,但是也是非常不健壮的,比如只输入了一个数字另外一个留空就会报错;输入了非数字计算也会报错;对输入的数字范围也没有限定,等等。这些问题都是可以通过编写python代码来解决的,我在教程里就不多说了。

你可能感兴趣的:(PyQt5入门系列3:为UI界面编写后台逻辑)