基于PyQt5和Qt Designer的简易加法计算器的制作

前言

写在文章的前面,我本人写这篇是为了记录自己的学习过程,给后来者一个参考和思路,这并不是特别复杂的东西主要是两天内我看了b站的两篇PyQt5教程
PyQt5教程,来自网易云课堂(看到了24课)和Python的Gui编程-PyQt5从入门到项目实战(看到了第23课)
对于我本人来说第一篇偏向于ui设计,第二篇比第一篇好,讲的非常细,看到第一篇我很庆幸我看到了第二篇因为第一篇前半部分用大量的笔墨着手去讲Qt Designer的用法没有去讲程序和控件的联系,但是我看了第二篇后也感叹我之前看了第一篇从而很早的知道Qt Designer。它帮我节约了很多时间让我不用手撸UI界面。看到第二篇的23课的时候我开始给自己了一个任务,就是设计出一个小计算器,只有加法但是我是因为练手而不是追求实用性,看的知识点都用上了还是很有成就感的。

加法计算器的Qt Designer部分

计算器的UI设计

进入Qt Designer后
图1
选择Main Window点击创建
图2
一开始可能会很大但是可以点击右下角进行调节
图3
找到Display widgets选项卡然后选择LCD Number拖动到MainWindow
图4
找到Buttons选中Push Button拖动到Main Window

图5
Ctrl+a选住所有空间在空白处右击一定要在空白处,不要在控件上,不然就不会适应屏幕,在后期放大缩小窗口的时候就悲剧了
图6
点击这两点拉成全屏,此时你可以试试拉动右下角看看有没有随着你拉动一起变化,但是lcd number显示太大了,我们点击lcd number
图7
在右边的属性编辑器里QWidget选项卡里找到了它的最大尺寸里的最大宽度,它的值很大我们先设置一个100然后通过滚轮对应着右边实际的图做出相应的改变,让自己的计算器看的更舒服点
图8
调整好了lcd number后我们双击按钮吧按钮的内容改一下
到此我们对ui界面的设计基本完成,接下来就是插入信号与槽

插入信号与槽

图9
点击Edit然后点击编辑信号/槽就可以进入信号和槽的编辑了

图10
我们点击一个按钮控件,然后下拉(注意不要和别的控件碰到)
图11
然后会出现一个框我们左边选择clicked(),右边选择编辑
图12
进入编辑后在槽哪里点击+,添加一个我们自定义的槽函数
图13
添加了三个我们以后需要的槽函数就点击确定
图14
确定后我们的槽里相比之前的什么都没有现在多出来了三个槽函数,我们将左边的clicked()与右边的进行配对(数字按钮配对clickNum(),+号按钮对应着clickAdd(),=按钮对应着clickNum())
图15
这是埋好槽的样子,很乱是吗?
图16
实际上在右下角有信号/槽编辑器,这里可以清楚的看到你有没有搞错
图16
点击上方保存图标就可以保存为.ui文件

配合vscode的后续后台程序设计

图17
首先我们要为我们vscode安装这个插件
图17
打开文件夹后右击选择PYQT:Complie from
图18
就会生成一个Ui_AddCalculator.py的文件,我们不用去管它,我们新建一个文件叫StartAddCalculator.py写入程序,我每一行都有注释

from  Ui_AddCalculator import Ui_MainWindow #导入Qt Designer生成的类
import sys                                  #导入标准库sys库
from PyQt5.QtWidgets import QApplication,QMainWindow    #导入pyQt5包需要的内容


class MainWindow(QMainWindow, Ui_MainWindow):
    def __init__(self):
        super().__init__()  #继承所有父类的__init__()
        self.setupUi(self)  #默认运行Ui_AddCalculator.py里的setupUi函数
        self.Num = 0        #设置当前数字为0
        self.Add = []       #设置一个列表存放往期数字

    def clickNum(self):
        # self.Num = self.lcdNumber.value() #将显示的数字放到Num里
        btn = int(self.sender().text())     #获取信号发送者的名字
        self.Num = self.Num*10+btn          #将新输入的数字插入到Num的最后面
        self.lcdNumber.display(self.Num)    #将数字显示到上面

    def clickAdd(self):
        # self.Num = self.lcdNumber.value() #将显示的数字放到Num里
        self.Add.append(self.Num)           #将数字缓存到列表里
        self.Num = 0                        #清空Num准备接受下一个数字
        self.lcdNumber.display(0)           #显示0

    def clickEqu(self):
        # self.Num = self.lcdNumber.value() #将显示的数字放到Num里
        self.Add.append(self.Num)           #将数字缓存到列表里
        self.lcdNumber.display(sum(self.Add))#列表求和并显示
        self.Num = 0                        #清空Num缓存
        self.Add = []                       #清空数字缓存


if __name__ == "__main__":                  #当运行本文件时运行以下内容
    app = QApplication(sys.argv)            #建立QApplication对象并且放入系统传入参数
    Window = MainWindow()                   #建立MainWindow对象
    Window.show()                           #展示MainWindo对象内容
    sys.exit(app.exec_())                   #进入app.exec_事件循环当退出循环后系统整体退出

图19
一个小的计算器就完成了,当然要完成其它功能也是很容易办到的

发布了6 篇原创文章 · 获赞 2 · 访问量 574

猜你喜欢

转载自blog.csdn.net/qq_42679566/article/details/103319505
今日推荐