python GUI库图形界面开发之PyQt5简单绘图板实例与

1. PyQt5简介

PyQt5是一种基于Python语言的GUI库，它允许程序员使用Python编写图形用户界面。PyQt5是Qt（一个跨平台的应用程序和UI框架）的Python 绑定库。

Qt使用C++编写，主要用于开发GUI应用程序。PyQt5将Qt库导入Python模块，从而使Python程序员可以使用Qt的各种功能和工具，来创建GUI应用程序。

PyQt5中包含了许多控件，如QLabel，QPushButton等。本文将使用它的绘图类QPainter和QPen来创建简单绘图板。

2. 绘图板GUI设计

我们将创建一个简单的绘图板程序，它将包含以下组件：

窗口

画布

画笔颜色选择器

画笔粗细选择器

清除按钮

我们将使用PyQt5来创建GUI界面，绘制各个组件。

2.1 创建窗口

我们创建一个MainWindow类，继承自QtWidgets.QMainWindow。

from PyQt5 import QtWidgets
class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        self.setGeometry(300, 100, 800, 600) 
        self.setWindowTitle('Simple Paint') 
        self.show() 

在上面的代码中，我们创建了一个MainWindow类，并使用setGeometry来设置窗口的位置和大小。然后设置了窗口标题，最后通过show()来显示窗口。

2.2 创建画布

我们将一个QFrame作为我们的画布，用于绘制。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # 窗口设置
        self.setGeometry(300, 100, 800, 600) 
        self.setWindowTitle('Simple Paint') 
        
        # 创建画布
        self.canvas = QtWidgets.QFrame(self)
        self.canvas.setGeometry(50, 50, 700, 500)
        self.canvas.setStyleSheet('background-color:white;')
        
        self.show()

在上面的代码中，我们使用QFrame()函数创建了一个画布，并将其添加到了我们的MainWindow窗口中。

2.3 创建画笔颜色选择器和画笔粗细选择器

我们将使用QComboBox控件创建颜色选择器和粗细选择器。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # 窗口设置
        self.setGeometry(300, 100, 800, 600) 
        self.setWindowTitle('Simple Paint') 
        
        # 创建画布
        self.canvas = QtWidgets.QFrame(self)
        self.canvas.setGeometry(50, 50, 700, 500)
        self.canvas.setStyleSheet('background-color:white;')
        
        # 创建工具栏
        toolbar = QtWidgets.QToolBar(self)
        self.addToolBar(toolbar)
        
        # 添加颜色选择器到工具栏
        self.colorCombo = QtWidgets.QComboBox(toolbar)
        self.colorCombo.addItem('')
        self.colorCombo.addItem('red', 'red')
        self.colorCombo.addItem('blue', 'blue')
        self.colorCombo.addItem('green', 'green')
        self.colorCombo.activated[str].connect(self.changeColor)
        toolbar.addWidget(self.colorCombo)
        
        # 添加粗细选择器到工具栏
        self.penSizeCombo = QtWidgets.QComboBox(toolbar)
        self.penSizeCombo.addItem('1', '1')
        self.penSizeCombo.addItem('2', '2')
        self.penSizeCombo.addItem('3', '3')
        self.penSizeCombo.activated[str].connect(self.changePenSize)
        toolbar.addWidget(self.penSizeCombo)
        
        self.show()

在上面的代码中，我们使用QToolBar()函数创建了工具栏，并使用QComboBox()函数创建了颜色选择器和粗细选择器。然后添加选择器到工具栏，并使用activated信号连接它们的槽函数。最后调用show()函数。

2.4 创建清除按钮

我们将使用QPushButton控件创建一个按钮，点击该按钮将清除画布上的所有内容。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # 窗口设置
        self.setGeometry(300, 100, 800, 600) 
        self.setWindowTitle('Simple Paint') 
        
        # 创建画布
        self.canvas = QtWidgets.QFrame(self)
        self.canvas.setGeometry(50, 50, 700, 500)
        self.canvas.setStyleSheet('background-color:white;')
        
        # 创建工具栏
        toolbar = QtWidgets.QToolBar(self)
        self.addToolBar(toolbar)
        
        # 添加颜色选择器到工具栏
        self.colorCombo = QtWidgets.QComboBox(toolbar)
        self.colorCombo.addItem('')
        self.colorCombo.addItem('red', 'red')
        self.colorCombo.addItem('blue', 'blue')
        self.colorCombo.addItem('green', 'green')
        self.colorCombo.activated[str].connect(self.changeColor)
        toolbar.addWidget(self.colorCombo)
        
        # 添加粗细选择器到工具栏
        self.penSizeCombo = QtWidgets.QComboBox(toolbar)
        self.penSizeCombo.addItem('1', '1')
        self.penSizeCombo.addItem('2', '2')
        self.penSizeCombo.addItem('3', '3')
        self.penSizeCombo.activated[str].connect(self.changePenSize)
        toolbar.addWidget(self.penSizeCombo)
        
        # 添加清除按钮到工具栏
        clearButton = QtWidgets.QPushButton('清除', toolbar)
        clearButton.clicked.connect(self.clearCanvas)
        toolbar.addWidget(clearButton)
        
        self.show()

在上面的代码中，我们使用QPushButton()函数创建了一个“清除”按钮，并将它添加到了工具栏。清除按钮的clicked信号连接了清除画布的槽函数。

3. 使用QPainter绘制图形

现在我们已经创建了GUI界面，接下来我们将使用QPainter和QPen类来绘制各种图形。

3.1 定义画笔

在我们可以开始绘制之前，我们需要定义QPen对象。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # ......
        
        # 定义画笔
        self.pen = QtGui.QPen(QtGui.QColor('black'), 1, QtCore.Qt.SolidLine)
        
        self.show()

在上面的代码中，我们使用QColor()函数创建了一个黑色颜色对象，使用了SolidLine样式的QPen（提供了多种线条样式，如实线、虚线、点线、划线等），并设置了画笔的宽度为1个像素。

3.2 监控画布的鼠标事件

我们将在画布上检测鼠标事件，如鼠标单击和鼠标移动，用于绘制图形。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # ......
        
        # 初始化鼠标位置
        self.lastPoint = QtCore.QPoint()
        
        # 监控画布的鼠标事件
        self.canvas.mousePressEvent = self.mousePress
        self.canvas.mouseMoveEvent = self.mouseMove
        
        self.show()
    
    def mousePress(self, event):
        self.lastPoint = event.pos()
    
    def mouseMove(self, event):
        painter = QtGui.QPainter(self.canvas.pixmap())
        painter.setPen(self.pen)
        painter.drawLine(self.lastPoint, event.pos())
        self.lastPoint = event.pos()
        self.canvas.update()

在上面的代码中，我们初始化了鼠标位置，并用self.lastPoint变量存储了上一个点的位置。

我们还在MainWindow类中定义了两个方法：mousePress()和mouseMove()，分别对应鼠标按下和鼠标移动事件。我们将这些事件设置为我们的画布对象的回调函数。

在 mousePress() 中，我们简单地将事件位置存储在self.lastPoint中。

在 mouseMove() 中，我们创建了一个QPainter对象，并设置Pen。然后我们使用drawLine() 方法绘制一条线段，连接上一个点和当前鼠标位置。最后我们使用canvas.update()方法刷新画布。

3.3 改变线条颜色

我们需要实现一个changeColor()槽函数，以响应颜色选择器的变化。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # ......
        
        # 添加颜色选择器到工具栏
        self.colorCombo = QtWidgets.QComboBox(toolbar)
        self.colorCombo.addItem('')
        self.colorCombo.addItem('red', 'red')
        self.colorCombo.addItem('blue', 'blue')
        self.colorCombo.addItem('green', 'green')
        self.colorCombo.activated[str].connect(self.changeColor)
        toolbar.addWidget(self.colorCombo)
        
        # ......
    
    def changeColor(self, color):
        if color == '':
            self.pen.setColor(QtGui.QColor('black'))
        else:
            self.pen.setColor(QtGui.QColor(color))

在上面的代码中，我们创建了 changeColor() 槽函数，用于响应颜色选择器的变化。我们调用了QColor()函数，将字符串类型的参数转换为QColor类型的参数，并将其设置为我们的画笔颜色。

3.4 改变线条粗细

我们还需要一个changePenSize()槽函数，以响应线条粗细选择器的变化。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # ......
        
        # 添加粗细选择器到工具栏
        self.penSizeCombo = QtWidgets.QComboBox(toolbar)
        self.penSizeCombo.addItem('1', '1')
        self.penSizeCombo.addItem('2', '2')
        self.penSizeCombo.addItem('3', '3')
        self.penSizeCombo.activated[str].connect(self.changePenSize)
        toolbar.addWidget(self.penSizeCombo)
        
        # ......
    
    def changePenSize(self, size):
        self.pen.setWidth(int(size))

在上面的代码中，我们创建了changePenSize()槽函数，它获取粗细选择器中的值并将其设置为画笔宽度。

3.5 清除画布上的内容

我们还需要一个clearCanvas()槽函数，以清除画布上的图形。

class MainWindow(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()
        
        # ......
        
        # 添加清除按钮到工具栏
        clearButton = QtWidgets.QPushButton('清除', toolbar)
        clearButton.clicked.connect(self.clearCanvas)
        toolbar.addWidget(clearButton)
        
        # ......
    
    def clearCanvas(self):
        pixmap = QtGui.QPixmap(self.canvas.size())
        pixmap.fill(QtCore.Qt.white)
        self.canvas.setPixmap(pixmap)

在上面的代码中，我们创建了clearCanvas()槽函数，并使用 fill() 方法将画布的背景填充为白色。然后我们使用 setPixmap() 方法将 pixmap 设置为 canvas 对象的 pixmap。

4. 结束语

在本文中，我们创建了一个使用PyQt5生成的绘图板的示例。我们用鼠标画出了线条，并添加了颜色选择器，线条粗细选择器和清除按钮。我们了解了如何使用QPainter和QPen对象进行绘图，以及如何在GUI中使用信号和槽功能。