跳至正文
View Categories

1 min read

    主要内容 #

  1. QLabel介绍
  2. QLineEdit介绍
  3. QTextEdit介绍

完成效果 #

完成本节课程,能学会在窗口应用程序上使用label控件和文本编辑框控件。
效果如下:

收获 #

学习完本节内容,我们会知道如何创建QLabel、QLineEdit、QTextEdit控件,以及它们各自的功能

1.QLabel介绍 #

QLabel小部件提供文本或图像显示。没有提供用户交互功能。标签的外观可以通过各种方式进行配置。
以下是QLabel的简单示例:

# 注意,以下包都要导入,后面内容会用到
import sys
from PyQt5.QtWidgets import QApplication,  QWidget, QLabel, QTextEdit, QLineEdit


class Example(QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()

    def initUI(self):
        # 创建3个标签
        label1 = QLabel(self)   # 第一个标签
        label2 = QLabel(self)   # 第二个标签
        label3 = QLabel(self)   # 第三个标签

        label1.move(100, 50)    # 标签1的位置
        label2.move(100, 100)   # 标签2的位置
        label3.move(100, 150)   # 标签3的位置

        # setText(): 用来设置QLabel的文本内容
        label1.setText('这是一个纯文本标签')  # 设置标签1为纯文本标签
        
        label2.setText('<strong style="color:#38d4d2">欢迎使用python gui应用</strong>')  # 设置标签2为富文本标签
        # 注:富文本是通过纯文本进行更高层次渲染和计算,然后再呈现给你看的文档
    
        label3.setText('<a href="https://dashima.net/">大师码官方网站</a>')  # 设置标签3为超链接标签
        label3.setOpenExternalLinks(True)  # 点击超链接可以打开网页

        # 设置窗口的位置和大小,前两个参数表示离屏幕左上角的坐标,后两个参数表示窗口的大小
        self.setGeometry(300, 300, 500, 500)
        self.setWindowTitle('QLabel')  # 设置窗口的标题
        self.show()  # 显示窗口


app = QApplication(sys.argv)    # 创建应用程序
ex = Example()  # 创建窗口对象
sys.exit(app.exec_())   # 设置关闭窗口后结束进程

拓展练习:请尝试更改label1的位置和内容。

2.QLineEdit介绍 #

QLineEdit类是一个单行文本框控件。
行编辑允许用户使用一系列有用的编辑功能输入和编辑单行纯文本,自带了撤销、重做、剪切、粘贴、拖拽等功能。
以下是QLineEdit的简单示例:

    qle = QLineEdit(self)   # 创建一个QlineEdit对象
    qle.move(60, 100)       # 移动位置

将这部分代码,复制到第一节PyQt5代码框架中的initUI中即可。
拓展练习:运行这段代码,在文本框内输入自己想写的内容。

3.QTextEdit介绍 #

QTextEdit类是一个多行文本框控件,可以显示多行文本内容,适用于段落和字符,可以显示图像,列表和表格。
以下是QTextEdit的简单示例:

    textedit = QTextEdit(self)  # 创建一个QTextEdit对象
    textedit.move(60, 100)      # 移动位置
    textedit.resize(300,300)    # 调整大小
    # 设置整体风格,其中参数background-color控制背景颜色, cyan为青色
    # border控制边框线属性,2px代表宽度为2个像素,solid代表是实线,black代表颜色为黑色
    textedit.setStyleSheet("background-color:cyan;border: 2px solid black")    
    # 设置占位提示文本
    textedit.setPlaceholderText("请输入您的个人简介")

将这部分代码,复制到第一节PyQt5代码框架中的initUI中即可。
拓展练习:运行这段代码,在文本框内输入自己的个人简介。

小结 #

  • 学习了如何创建QLabel控件。
  • 学习了如何创建QLineEdit控件。
  • 学习了如何创建QTextEdit控件,并自定义色彩风格。
  • 习题 #

    1. 习题1:尝试创建一个跳转到百度首页的QLabel超链接标签。
    2. 习题2:运行QlineEdit代码,在文本框中输入内容后,按ctrl+z,观察会发生什么。
    3. 习题3:尝试修改QTextEdit的背景颜色为yellow,边框线颜色为red