pyqt6 实现弹窗案例

本文涉及的产品
RDS MySQL Serverless 基础系列,0.5-2RCU 50GB
云数据库 Tair(兼容Redis),内存型 2GB
云数据库 RDS MySQL,集群系列 2核4GB
推荐场景:
搭建个人博客
简介: 本文介绍了如何实现一系列弹窗效果,包括基础弹窗、消息对话框、输入对话框和清除按钮。通过设置 `self.dialog = Dialog()` 可以轻松实现基础弹窗,而消息对话框则使用 `QMessageBox` 类。输入对话框支持文本、数字和下拉列表输入,清除按钮用于清空输入框内容。每个功能都通过按钮触发相应的槽函数来实现。

 本文我们实现一系列的弹窗效果,效果展示如下:

image.gif 编辑

实现这系列功能很简单,基本上都是类似的操作,我们从基础弹窗、消息弹窗到输入框弹窗及清除按钮的顺序来介绍。

1 基础弹框

我们只需要设置一个self.dialog = Dialog()就可以实现基础的弹窗效果。

我们创建一个QMainWindow,并把基础的弹窗对象配置到主窗口里。

下面代码设计主窗口:

class MainWindow(QMainWindow):
    def __init__(self, parent=None):
        super(MainWindow,self).__init__(parent)
        # 标题
        self.setWindowTitle("弹窗测试")
        # 固定窗体大小
        self.setFixedSize(400,300)

image.gif

下面是基础弹窗对象:

def show_dialog(self):
        self.dialog = Dialog()
        self.dialog.show()
        self.dialog.exec()

image.gif

此时我们在主窗口里添加基础弹窗按钮,实现信号和槽的对应关系:

self.btn = QPushButton(self)
self.btn.setText("弹出对话框")
self.btn.move(30,50)
self.btn.clicked.connect(self.show_dialog)

image.gif

效果如下:

image.gif 编辑

当点击的时候,弹出基础弹窗:

image.gif 编辑

2 消息对话框

消息对话框实现需要用到QMessageBox类,并按照下列代码进行方法的构造,创造槽函数。

def msg_dialog(self):
        reply = QMessageBox.information(self,'提示','我要在网上问问吗?',
                                        QMessageBox.StandardButton.Yes|QMessageBox.StandardButton.No,
                                        defaultButton=QMessageBox.StandardButton.No)
        if reply==QMessageBox.StandardButton.Yes:
            print("OK")

image.gif

接下来在主窗口里创建按钮,实现信号的触发,来调动这个槽函数。

self.btn2 = QPushButton(self)
self.btn2.setText("消息对话框")
self.btn2.move(230,50)
self.btn2.clicked.connect(self.msg_dialog)

image.gif

效果如下:

image.gif 编辑

3 输入对话框

输入对话框里你可以输入文字,也可以输入数字,也可以实现下拉列表,不过设计的槽函数如下:

#文本槽函数
    def text_dialog(self):
        text,ok = QInputDialog.getText(self,'文本测试','输入姓名:')
        if ok:
            self.te.setText(str(text))
    #下拉列表槽函数
    def item_dialog(self):
        items = ("PyQt基础","java高级教程","算法设计")
        item,ok = QInputDialog.getItem(self,"选项测试","课程列表",items,1,True)
        if ok and item:
            self.te.setText(item)
    #数字槽函数
    def int_dialog(self):
        num,ok = QInputDialog.getInt(self,"整数测试","输入成绩")
        if ok:
            self.te.setText(str(num))

image.gif

同样,在主窗体里添加信号触发按钮:

#文本输入框
        self.btnInput1 = QPushButton(self)
        self.btnInput1.setText("文本测试")
        self.btnInput1.move(30,120)
        self.btnInput1.clicked.connect(self.text_dialog)
        #选项输入框
        self.btnItem = QPushButton(self)
        self.btnItem.setText("选项测试")
        self.btnItem.move(130,120)
        self.btnItem.clicked.connect(self.item_dialog)
        # 整数输入框
        self.btnInt = QPushButton(self)
        self.btnInt.setText("整数测试")
        self.btnInt.move(230, 120)
        self.btnInt.clicked.connect(self.int_dialog)

image.gif

效果测试:

image.gif 编辑

4 清除按钮

实现清除很简单,只需要把输入框中的文字内容替换成空字符串就可以了,槽函数如下:

def cleanFun(self):
        currentContext = self.te.text()
        if currentContext != "":
            self.te.setText("")

image.gif

在页面面板中添加触发按钮,并简单的添加红色背景如下:

# 清除
        self.cleanBtn = QPushButton(self)
        self.cleanBtn.setText("清  除")
        self.cleanBtn.move(140, 260)
        self.cleanBtn.setStyleSheet("background-color:red;color:#FFF;font-size:18px")
        self.cleanBtn.clicked.connect(self.cleanFun)

image.gif

image.gif

相关文章
|
2月前
|
索引
pyqt5界面化开发---抽屉布局界面的开发
pyqt5界面化开发---抽屉布局界面的开发
Pyside6-第三篇-QToolButton一个的按钮
Pyside6-第三篇-QToolButton一个的按钮
285 0
|
Python
Python高级进阶#009 pyqt5中窗体的绝对布局和相对布局
Python高级进阶#009 pyqt5中窗体的绝对布局和相对布局
10111 2
|
Python
Python高级进阶#004 pyqt5设置窗体图标
Python高级进阶#004 pyqt5设置窗体图标
227 0
|
前端开发 索引 Python
Python高级进阶#011 pyqt5按钮QPushButton应用
Python高级进阶#011 pyqt5按钮QPushButton应用
316 0
|
Python
Python高级进阶#019 pyqt5菜单menu应用,新建多窗体
Python高级进阶#019 pyqt5菜单menu应用,新建多窗体
234 0
|
索引 Python 容器
Python高级进阶#017 pyqt5下拉列表控件QComboBox
Python高级进阶#017 pyqt5下拉列表控件QComboBox
496 0
|
编解码 Python
Python高级进阶#008 pyqt5窗体居中和布局
Python高级进阶#008 pyqt5窗体居中和布局
305 0
|
Python 容器
Python高级进阶#014 pyqt5滑块控件QSlider应用
Python高级进阶#014 pyqt5滑块控件QSlider应用
285 0
|
Python 容器
Python高级进阶#005 pyqt5显示提示框
Python高级进阶#005 pyqt5显示提示框
229 0