PyQt5入门笔记1--------按键弹出另一个窗口_pyqt点击按钮弹出新窗口

前言：

最近在学习PyQt，正好记录一些笔记：

安装PyQt的方法我是跟随这个帖子实现的：

        python+pycharm+pyqt5安装教程「建议收藏」-腾讯云开发者社区-腾讯云 (tencent.com)

                                                                                    （链接最后访问时间：2023年9月27日）

该帖子和其它很多帖子都是用Pycharm安装pyqt5和QtDesigner搭配使用，基本方法如下：

1.         安装和配置好所需工具后，从pycharm可以打开QtDesigner来进行界面设计。
2.         将其保存为“.ui”文件。
3.         在Pycharm中右键该文件，选择PyUIC工具，将该ui界面转换成对应的python文件。

以实现简化UI编写代码的目的。

设计窗口：

在Pycharm默认在左侧的Project栏中，右键，选择External Tools（外部工具），选择QtDesigner（需提前配置，详情请看上述链接的文章）。

这时候会弹出一个新的界面如图：

在中间的新建窗体窗口中，先选择“Main Window”，这是最基本的一个空白窗口，点击“创建”

这时候界面中会有一个空白的窗口，你可以从左侧的“Widget Box”向这个窗口中拖拽各种控件，比如我想拖拽一个按钮到这个窗口中，那么我就在左侧的“Buttons”栏中，找到“Push Button”，拖拽到右侧的窗口中。

现在这个窗口已经有了我们这次实验的主窗口所需要的所有东西了，但是这个界面看上去有点比例太奇怪了，于是可以从两个方面入手来解决：

1.  将按钮变大
2.  将窗口变小

这时，界面右侧的属性编辑器可以帮助我们来做这件事，当你鼠标点击窗口的不同控件时，属性编辑器会自动切换为你所选择的控件的属性，我们先来调整窗口大小：

点击窗口，右侧属性界面处可以看到“QObject”中“QObjectName”属性是“MainWindow”，这个名称属性可以随意修改成你需要的，对于窗口来说，“MainWindow”这个名字还好，这里不做修改。

在“QWidget”中有geometry属性，可以看到默认给的是“[(0,0),800x600]”这个属性的意思是，该窗口的位置是（0，0），宽800，高600。可以将该菜单展开，修改参数，我认为对于这个实验来说，200x200就够用，所以如图修改：

可以看到，窗口明显变小了。

但是这么小的按键，看着不清晰，比例也不合适，那么我们下一步修改按键的属性。

点击按键，右侧属性编辑器会切换为该按键的属性：

“ObjectName”属性是“pushButton”，我们这里可以做一下修改，因为本次实验只有这一种按键，甚至只有这一个按键，所以我可以给他改名为“Button”或者“btn”或任何便于理解的名称，因为只有一个按键所以也不用担心混淆。

我希望他能够占满窗口一些，原本属性中的(10,10)，表示其左上角的坐标，这也说明这个按键距离窗口左侧和上侧分别是10和10，窗口我们修改为200x200，我希望按键右侧距离窗口右侧也是10，那么按键的宽度就是200-10-10为180，所以修改宽度为180。

高度有一些不太一样，如果高度设计为180的话，其可能会显示不全，这是因为主窗口虽然尺寸为200x200，但其底部边框却占了一部分尺寸，大概是20-30左右。

所以按键高度设置为140比较合适

现在该窗口已经设计完了，那么我们将其保存，名字就叫“menu.ui”。

链接UI界面和代码：

回到Pycharm中，在Project目录找到这个“menu.ui”，右键，选择“External Tools”（外部工具），选择“pyuic”，这样就会生成一个“menu.py”的文件，这个文件记录了你的UI设计。

打开"main.py"函数,需要import这些：

import sys
from PyQt5 import QtCore
from PyQt5.QtWidgets import QApplication, QMainWindow
from menu import Ui_MainWindow as menu_ui

 这里最后一行代码的意思就是从"menu.py"文件中，导入Ui_MainWindow这个函数，并命名为menu_ui。

创建一个类，命名为Menu：

class Menu(QMainWindow, menu_ui):
    def __init__(self):
        super(Menu, self).__init__()
        self.setupUi(self)

在“main.py”的主函数入口中：

if __name__ == '__main__':
    QtCore.QCoreApplication.setAttribute(QtCore.Qt.AA_EnableHighDpiScaling)
    app = QApplication(sys.argv)
    MainWindow = Menu()
    MainWindow.show()
    sys.exit(app.exec_())

第一行的意思是开启高分辨率兼容，以防在高分辨率屏幕出现显示问题。

现在点击运行，将会看到窗口弹出：

按钮功能的链接：

现在，点击这个按钮，不会有任何反应，我们需要将按钮按下的动作和一个功能做链接。

实现方法：

在Menu类中定义一个新函数，这个函数记录了按下按钮的操作，并将该函数和按下按钮做链接。

    def push(self):
        print("push")
'
运行
运行

这里，我新建了一个函数叫做push，他的功能是可以在命令行界面中打印“push”这个字符。接下来我们将其和按钮链接。

在Menu类的__init__(self)中，加入一行链接用的代码。整个类的代码如下：

class Menu(QMainWindow, menu_ui):
    BN = 0
 
    def __init__(self):
        super(Menu, self).__init__()
        self.setupUi(self)
        self.btn.clicked.connect(self.push)
 
    def push(self):
        print("push")

self.btn.clicked.connect(self.push)。这行代码将self.push这个函数和名为btn的按钮的clicked事件关联在一起了。现在我们运行，并点击按钮，就可以看到命令行中打印了Push字样。

第二个窗口： 

本此实验的目的是，点击按钮，弹出第二个窗口，所以我们还需要一个窗口。

但是这一次我觉得打开QtDesigner太麻烦了，因为第二个窗口也只有一个按钮，但是只有这个按钮的一半宽度，两个窗口长得很接近，我不想用QtDesigner来做设计，那么可以从".py"文件直接入手修改。

将menu.py复制一份，并重命名为另一个名称，popup.py。

在main.py中加入一个import：

from popup import  Ui_MainWindow as pop_ui

打开popup.py

可以看到这里面有Ui_MainWindow这个类，类中包括了setupUi和retranslateUi两个函数。其中setupUi是定义窗口中的控件的，retranslateUi用于修改控件的text等属性。

如果我想只修改按钮的尺寸，那么我们在setupUi找到对应代码即可：

于是我找到了这两行：

self.btn = QtWidgets.QPushButton(self.centralwidget)
self.btn.setGeometry(QtCore.QRect(10, 10, 180, 140))

这里可以看到之前设置过的尺寸属性，那么如果我希望他只有一般大小，就将180改为90就好：

self.btn = QtWidgets.QPushButton(self.centralwidget)
self.btn.setGeometry(QtCore.QRect(10, 10, 90, 140))

现在我们的新窗口已经设计好了，只需要在代码中实现按下按钮，弹出它即可。

为了弹出这个窗口，在main.py，也需要新写一个类，来代表这个窗口，我们可以直接复制Menu类，并做一些修改即可：

class Pop(QMainWindow, pop_ui):
 
    def __init__(self):
        super(Pop, self).__init__()
        self.setupUi(self)
        self.btn.clicked.connect(self.push)
 
    def push(self):
        print("push")

之前在main.py的Menu类中，已经有了push这个函数，它的功能是打印“push”这个字符串，那么我们只需要在这后面加入几行代码，即

    def push(self):
        print("push")
        self.ui_pop = Pop()
        self.ui_pop.show()
'
运行
运行

这样，在点击按钮后，将会弹出第二个窗口：

如果希望弹出第二个窗口的时候关闭第一个，只需要在后面加一句self.close()即可

附上源码：

ZIHENGFENG/PyQt_CSDN: 这个是CSDN中PyQt内容的源码 (github.com)