Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

style for a class instance using Qt Style Sheets

I am trying to write a CSS style sheet for toy PyQt5 application. I have successfully defined a classes MainWindow(QMainWindow) and DefaultWidget(QWidget), with the latter containing two push buttons, which I am trying to stylize.

Using the C++ docs, I've been trying to take advantage of the QPushButton#evilButton example, provided in: Link

However, it appears that the # notation for an instance name does not translate to the analogous self.setStyleSheet() method for an external CSS file in my python application.

Python file (apologies if there are typos - transcribing from another computer):

import sys
from PyQt5.Widgets import QApplication, QMainWindow, QWidget, QPushButton, QHBoxLayout

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()
        self.setStyleSheet(open('./style.css').read())
        try:
            self.setCentralWidget(DefaultWidget())
        else:
            some_error_stuff_for_troubleshooting
        self.show()

class DefaultWidget(QWidget):
    def __init__(self):
        super().__init__()
        okButton = QPushButton('OK')
        cancelButton = QPushButton('Cancel')
        hbox = QHBoxLayout()
        hbox.addWidget(okButton)
        hbox.addWidget(cancelButton)
        self.setLayout(hbox)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec_())

In the CSS file...

QWidget.MainWindow {
    background: blue
}
QPushButton {
    background-color: beige
}
QPushButton???okButton {
    background-color: green
}

Where I put the ??? I have tried a number of things (trying to walk through the classes QPushButton.okButton, QPushButton.DefaultWidget.okButton, DefaultWidget.okButton, with ., #, :: and : notation, etc.) but at this point it's more random than educated guessing.

I would like for the CSS to handle some naming convention styling, outside of the class name to help pull as much style out of the python file as possible. Even if the notation happened to be correct, am I not seeing my expected color change due to inherited style?


Edit: If anyone stumbles across this, the .setObjectName() method or declaring the object name option when instancing the widget. Also, here's a similar question on why some sort of default name isn't used, if you're interested. PyQt: is there an better way to set objectName in code?

like image 824
rumble_bumbles Avatar asked Feb 07 '26 03:02

rumble_bumbles


1 Answers

Try it:

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

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()

        #                       open('./style.css').read())
        self.setStyleSheet("""
            QWidget {
                background: blue;
            }
            QPushButton {
                background-color: beige;
            }
            QPushButton#okButton {                             /*    <--- #okButton      */
                background-color: green;
            }
        """)

        defaultWidget = DefaultWidget()
        self.setCentralWidget(defaultWidget)

        self.show()

class DefaultWidget(QWidget):
    def __init__(self):
        super().__init__()

        okButton = QPushButton('OK', objectName="okButton")     # + objectName="okButton"

        cancelButton = QPushButton('Cancel')
        hbox = QHBoxLayout()
        hbox.addWidget(okButton)
        hbox.addWidget(cancelButton)
        self.setLayout(hbox)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = MainWindow()
    sys.exit(app.exec_())

enter image description here

like image 54
S. Nick Avatar answered Feb 08 '26 15:02

S. Nick



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!