PyQt自定義控件之實現圓形圖片

對於圓形圖片來說，我們可以使用 qss樣式表的 border-radius 來實現控件(如: QLable)的圓形效果，但這種方式會出現邊界鋸齒模糊的問題。爲了解決這種問題，我們可以直接重寫控件 paintEvent 事件。

下面以 QLabel 來舉例實現：

class CircleImage(QLabel):
    '''繪製圓圖片'''

    def __init__(self, parent, width, height):
        super(CircleImage, self).__init__(parent)
        self.resize(width, height)
        self.circle_image = None

    def set_image(self, image):
        '''設置繪製的圖片'''
        self.circle_image = image.scaled(self.size(), Qt.KeepAspectRatio, Qt.SmoothTransformation)
        self.update()

    def paintEvent(self, event):
        '''重寫繪製事件'''
        super(CircleImage, self).paintEvent(event)
        painter = QPainter(self)
        painter.setPen(Qt.NoPen)
        brush = QBrush(self.circle_image)
        painter.setBrush(brush)
        painter.setRenderHints(QPainter.Antialiasing, True)
        painter.drawEllipse(QRect(0, 0, self.width(), self.height()))

當然，也可以使用QWidget來實現，效果都一樣，因爲QLabel就是繼承於QWidget的。

這裏的實現思路有兩個比較重要的方法：set_image 和 paintEvent

set_image 裏面用於設置需要顯示的圖片，並且對圖片進行了縮放，縮放的兩個參數爲：
Qt.KeepAspectRatio：這是用於設置縮放圖片時保持比例
Qt.SmoothTransformation：這是用於設置圖片轉換過程中避免失真

設置完後調用update()方法來重新調用paintEvent()方法：
1、設置painter 的pen爲Qt.NoPen來去除邊框線條
2、把需要繪製的圖片傳送給QBrush，刷子就是繪製圖片的內容，然後把brush設置給painter
3、設置painter的renderHints爲QPainter.Antialiasing來實現抗鋸齒功能
4、最後通過painter的drawEllipse來實現圓形圖片繪製

---

下面是調用該控件的窗口

class MyWidget(QWidget):
    def __init__(self):
        super(MyWidget, self).__init__()
        
        # 窗口設置
        self.resize(320, 240)
        self.setWindowTitle('Test')
        self.setObjectName('MyWidget')
        self.setStyleSheet("QWidget#MyWidget{background:grey;}")

        # 調用圓形圖片控件
        self.circle_image = CircleImage(self, 100, 100, )
        self.circle_image.set_image(QPixmap('./image/girl_1.jpg'))
        self.circle_image.move(110, 60)

效果如下

如果給窗口設置透明背景就可以做到一些特殊效果

# 去除背景
self.setWindowFlags(self.windowFlags() | Qt.FramelessWindowHint)
self.setAttribute(Qt.WA_TranslucentBackground)

整個窗口只顯示出這個圓形圖片

---