簡體   English   中英

PyQt5中圖像的透明部分塊背景顏色

[英]Transparent part of image blocks background color in PyQt5

我正在通過翻譯以前編寫的 Tkinter 音樂播放器應用程序來學習 PyQt5。 其中一個配置選項允許用戶設置所有按鈕的背景顏色。 但是,其中三個按鈕(播放、暫停和停止)是獨一無二的,因為它們還顯示相應的圖像。 該圖像由透明背景上的圖標組成,其中圖標為彩色(播放=綠色,暫停=黃色,停止=紅色),當給定的 state 處於活動狀態時,如果其他兩種狀態之一處於活動狀態,則為白色。 下面是 Tkinter 上的(活動)播放按鈕在幾種不同背景設置下的樣子: 示例背景 #1

示例背景 #2

在 Qt5 上,我通過注釋掉加載圖像的行來驗證背景顏色設置是否正確:

僅背景 - 無圖像

但是,當加載來自 Tkinter 的相同圖像文件時,背景顏色突然在圖像的透明部分中被遮擋:

圖像和背景

當我最初的嘗試沒有奏效時,我追蹤了這篇文章並將我的代碼從原始代碼的執行方式修改為答案中建議的方式。 但是,就我而言,這沒有任何區別。 我用來測試的代碼是(圖像加載注釋掉了):

import sys
from PyQt5.QtWidgets import QWidget, QPushButton, QApplication

class Example(QWidget):
    def __init__(self):
        super().__init__()
        btn = QPushButton(self)
        btn.resize(70,70)
        btn.move(115, 115)
        btn.setStyleSheet("background-color: #b5abf4")
        btn.setObjectName("widget")
        #btn.setStyleSheet("#widget{background-image: url(play_on.png)}")
        
        self.setGeometry(600, 300, 300, 300)
        self.setStyleSheet("background-color: white")
        self.show()
        
def main():
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())
    
if __name__ == '__main__':
    main()
 

我仍然是 Qt 的新手,但到目前為止我所閱讀的所有內容似乎都表明這應該可行。 誰能發現我做錯了什么?

setStyleSheet()總是覆蓋先前為該小部件設置的樣式表,因此您基本上忽略了先前的setStyleSheet()調用。 此外,由於您正在為父樣式表設置background-color ,它會自動為其子樣式表傳播該背景(因為樣式表確實是級聯的)。

要正確設置樣式表,您必須在同一調用中設置背景顏色背景圖像。

        btn.setStyleSheet('''
            #widget {
                background-color: #b5abf4;
                background-image: url(play_on.png);
            }
            ''')

由於您可能希望為所有按鈕設置這些背景並避免每次單獨設置樣式表,您可以在父樣式表中使用 object 屬性和[property="value"]選擇器

        btn.setObjectName("playButton")
        btn.setProperty('mediabutton', True)
        btn.setStyleSheet('''
            #playButton {
                background-image: url(play_on.png);
            }
            ''')
        
        self.setStyleSheet('''
            Example {
                /* set the background *only* for the parent widget */
                background-color: white;
            }
            QPushButton[mediabutton="true"] {
                /* set the background color for all push buttons that
                have the "mediabutton" property set to True */
                background-color: #b5abf4;
            }
        ''')

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM