1. 程式人生 > >用pyqt繪製一個無邊框、有陰影、帶圖片背景的(偽頂層)圓角視窗

用pyqt繪製一個無邊框、有陰影、帶圖片背景的(偽頂層)圓角視窗

物件:(要設定的只有Form和widget)

widget在Form內,緊貼著Form,之間隔著Form的layoutMargin(邊緣)的寬度:

物件Form的佈局(邊緣)設定:

物件widget的佈局(邊緣)設定:

思路:

首先先交代:

無邊框用:

self.setWindowFlag(Qt.FramelessWindowHint)

陰影用:

QGraphicsDropShadowEffect 

設定圖片背景用:

self.widget.setStyleSheet("QWidget#widget{background-image: url(./231.png);border-radius:30px;}")
至於為什麼用setStyleSheet來設定圖片背景,我來解釋一下,首先繪製圖片背景有三個方法,

1、直接在widget上設定(我選擇這個方法,雖然圓角還是有一點點鋸齒)

self.widget.setStyleSheet("QWidget#widget{background-image: url(./231.png);border-radius:30px;}")
用border-radius:30px;來畫出圓角

2、用QPalette在widget上繪製出背景圖(無法畫出圓角):

self.widget.setAutoFillBackground(True) #一定要加上
palette=QPalette()
palette.setBrush(QPalette.Background, QBrush(QPixmap("F:\大創專案\\231.png")));
self.widget.setPalette(palette)

3、重寫paintEvent函式時,用QPainter來繪製widget上的背景圖(圓角很完美,但是無法載入背景圖,可能是我比較菜):

  def paintEvent(self, QPaintEvent):
        painter=QPainter(self);
        painter.setPen(Qt.NoPen);
        brush=QBrush()
        brush.setTextureImage(QImage("F:\大創專案\\231.png"))  # brush來載入背景圖
        painter.setBrush(brush)   # painter來載入brush
        painter.setRenderHint(QPainter.Antialiasing)  # 抗鋸齒化,如果不加的話,圓角的會有鋸齒
        painter.drawRoundedRect( 0, 0, self.width() - 1, self.height() - 1, 20, 20);  #圓角設定

注意:QPainter只能在paintEvent函式中使用,要不然會直接報錯,原因是為了規範UI繪製的順序。

步驟如下:

一、

self.setAttribute(Qt.WA_TranslucentBackground)   #將Form設定為透明
self.setWindowFlag(Qt.FramelessWindowHint) #將Form設定為無邊框

二、

self.shadow=QGraphicsDropShadowEffect()
self.shadow.setBlurRadius(10)
self.shadow.setColor(QColor(0, 0, 0, 500))
self.shadow.setOffset(6,6)
self.widget.setGraphicsEffect(self.shadow)

用QGraphicsDropShadowEffect將widget設定陰影,這樣widget就能在已經透明的Form的邊緣上留下陰影

注意:

Form的邊緣設定一定需要設定layoutMargin的,不然Form連邊緣都沒有,widget怎麼能留下陰影

效果如下(這是我專案做的demo,別給我吐槽色調,還沒做完(#手動滑稽)):