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?
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_())