03-PyQt5实践-教你定制一个简易的文本编辑器GUI

1、QLineEdit

QLineEdit是比较常用的单行文本输入控件，它提供了一个可编辑的文本框，允许用户可以在其中输入和编辑单行文本。通常与QLabel标签控件配合使用。QLineEdit通常用于文件路径选择、命令行输入、URL输入框、搜索框、文本过滤器等，其常见的方法、属性、信号如下表所示。

2、QTextEdit

QTextEdit是一个用于显示和编辑多行文本的控件，它可以应用于很多场景。如：文本编辑器【提供一些常用的文本编辑功能，复制、粘贴、撤销等】、日志查看器【查看日志信息，支持滚动、搜索和高亮显示文本，用户可以方便浏览和搜索日志】、富文本编辑器【用户可以设置字体样式、颜色、对齐方式等，还可以插入图片、链接和表格等丰富的内容】、帮助文档显示器【用于显示程序的帮助文档】、代码编辑器【用于显示和编辑代码，它支持自动缩进、语法高亮和代码折叠等基本功能】

3、QPlainTextEdit

QPlainTextEdit用于显示和编辑纯文本的多行文本，它与QTextEdit相比，不支持富文本编辑功能。可应用于简单代码编辑器【支持自动缩进、语法高亮和代码折叠等基本功能，适合编写和调试简单代码】、日志查看【显示和查看大量的日志信息，支持滚动、搜索和高亮显示文本】、配置文件编辑器【编辑和保存配置文件的纯文本内容】。如果你需要一个显示和编辑纯文本的多行文本框，并且不需要富文本编辑功能，该控件是一个轻量级的选择。

4、QTextBrowser

QTextBrowser是一个只读的用于显示富文本内容的控件。相比于QTextEdit和QPlainTextEdit，QTextBrowser更适合用于显示文本内容而不需要进行编辑的场景。诸如：帮助文档浏览器【您可以使用HTML格式编写帮助文档，并在QTextBrowser中加载和显示，它支持链接和锚点，允许用户在文档内导航。并且可以添加链接到其他相关文档或网页。】、公告板或信息显示器：如果您有一些需要定期更新的信息，比如公告板、最新消息等，您可以使用QTextBrowser来显示这些信息。您可以更新QTextBrowser的内容，以显示新的信息，同时还可以添加链接和格式化文本以增加交互性和可读性。电子书阅读器：虽然QTextBrowser不具备完整的电子书阅读器功能，但是对于简单的文本内容，如小说、新闻文章等，QTextBrowser可以用来显示并浏览这些内容。您可以加载文本文件或使用HTML格式来展示内容。富文本显示：如果您想要在应用程序中显示富文本内容，并且不需要对其进行编辑，QTextBrowser是一个简单且轻量的选择。您可以将富文本内容加载到QTextBrowser中，并根据需要设置样式、颜色和字体

5、简易文本编辑器

接下来，我们基于QTextEdit或者QPlainTextEdit定制一个简易的文本编辑器。

（1）、ui界面设计（主要是QAction的设置和添加到工具栏，详细的介绍使用可见往期）



（2）、关键代码
文件保存

@pyqtSlot()
def on_open_file_action_triggered(self):
    path = QDir.currentPath() # 获取系统当前目录
    title = "选择一个文件"  # 对话框标题
    filter = "所有文件(*.*);;文本文件(*.txt);"
    self.filename, filetype
    QFileDialog.getOpenFileName(self, title, path,filter)
    with open(self.filename, "r", encoding="utf-8") as fp:
        self.ui.textEdit.append(fp.read())

@pyqtSlot()
def on_save_file_action_triggered(self):
    # 将文本编辑器的内容保存到文件
    with open(self.filename, 'w') as file:
        file.write(self.ui.textEdit.toPlainText())

@pyqtSlot()
def on_save_as_action_triggered(self):
    path = QDir.currentPath()
    title = "保存文件"
    filter = "所有文件(*.*);;文本文件(*.txt)"
    file_path, _ = QFileDialog.getSaveFileName(self, title, path, filter)
    if file_path:
        text = self.ui.textEdit.toPlainText()
        try:
            with open(file_path, 'w') as file:
                file.write(text)
            print("File saved successfully.")
        except Exception as e:
            print("Failed to save file:", str(e))

插入图片

def on_insert_image_action_triggered(self):
   filename, _ = QFileDialog.getOpenFileName(self, "Insert Image", "",
                                                  "Images (*.png *.xpm *.jpg *.bmp)")
   if filename:
       fileType = QFileInfo(filename).suffix()
       image = QImage(filename)
       tmpWidth = image.width()
       tmpHeight = image.height()
       imageBytes = QByteArray()
       buffer = QBuffer(imageBytes)
       buffer.open(QIODevice.WriteOnly)
       image.save(buffer, fileType)
       imageBase64 = base64.b64encode(imageBytes).decode('utf-8')
       base64Image = '<img src="data:image/{};base64,{}" width="{}" height="{}">'.format(fileType, imageBase64,
                                                                                              tmpWidth, tmpHeight)
       cursor = self.ui.textEdit.textCursor()
       try:
           cursor.insertHtml(base64Image)
       except Exception as e:
              print("Error occurred:", str(e))

字体样式

def on_bold_action_toggled(self, checked):
    font = self.ui.textEdit.currentFont()
    font.setBold(checked)
    self.ui.textEdit.setCurrentFont(font)

def on_under_action_toggled(self, checked):
    font = self.ui.textEdit.currentFont()
    font.setUnderline(checked)
    self.ui.textEdit.setCurrentFont(font)

def on_delete_action_toggled(self, checked):
    font = self.ui.textEdit.currentFont()
    font.setStrikeOut(checked)
    self.ui.textEdit.setCurrentFont(font)

def on_Iter_action_toggled(self, checked):
    font = self.ui.textEdit.currentFont()
    font.setItalic(checked)
    self.ui.textEdit.setCurrentFont(font)

对齐方式

def set_alignment(self, alignment):
    textCursor = self.ui.textEdit.textCursor()
    if not textCursor.isNull() and textCursor.hasSelection():
        textFormat = textCursor.charFormat()
        font = textFormat.font()
        font.setItalic(not font.strikeOut())
        textFormat.setFont(font)
        textCursor.mergeCharFormat(textFormat)
        format = QTextBlockFormat()
        format.setAlignment(alignment)
        textCursor.mergeBlockFormat(format)
        self.ui.textEdit.setTextCursor(textCursor)

def on_left_action_triggered(self):
    self.set_alignment(Qt.AlignLeft)

def on_center_action_triggered(self):
    self.set_alignment(Qt.AlignCenter)

def on_right_action_triggered(self):
    self.set_alignment(Qt.AlignRight)

def on_ld_action_triggered(self):
    self.set_alignment(Qt.AlignJustify)

（3）界面效果

6、总结

本期，我们做了一个简单的小案例：实现一个简易的文本编辑器，当然，后面我们会设计一个更加完备的文本编辑器，实现代码编辑，高亮显示，显示行号等。本期代码及详细ui文件