CSS Selector for Custom Qt Class

style for a class instance using Qt Style Sheets

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

Apply different QSS stylesheet for custom QT class

If you want to style a specific element in your project, you can use it like that;

QPushButton#MyQPushButton
{
    color: #dcdcdc;
    // some code here
}

I assume that, you've already named your new QPushButton object as MyQPushButton, you can name an element like this;

QPushButton* myButton = new QPushButton;
myButton->setObjectName("MyQPushButton");

Without naming your element, you can't access it to give it a overrided style.

Qt stylesheet in derived class in C++ namespace (selector)

It is strange....it works fine for me:

untitled.pro:

#-------------------------------------------------
#
# Project created by QtCreator 2014-10-07T11:34:54
#
#-------------------------------------------------

QT       += core gui

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = untitled
TEMPLATE = app

SOURCES += main.cpp\
        mainwindow.cpp \
    mywidget.cpp

HEADERS  += mainwindow.h \
    mywidget.h

FORMS    += mainwindow.ui

mainwindow.h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H

mainwindow.cpp:

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}

mainwindow.ui:

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>400</width>
    <height>300</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <property name="styleSheet">
   <string notr="true"/>
  </property>
  <widget class="QWidget" name="centralWidget">
   <widget class="MyWidget" name="widget" native="true">
    <property name="geometry">
     <rect>
      <x>70</x>
      <y>30</y>
      <width>201</width>
      <height>121</height>
     </rect>
    </property>
    <property name="styleSheet">
     <string notr="true"/>
    </property>
    <widget class="QPushButton" name="pushButton">
     <property name="geometry">
      <rect>
       <x>30</x>
       <y>20</y>
       <width>75</width>
       <height>23</height>
      </rect>
     </property>
     <property name="text">
      <string>PushButton</string>
     </property>
    </widget>
   </widget>
  </widget>
  <widget class="QMenuBar" name="menuBar">
   <property name="geometry">
    <rect>
     <x>0</x>
     <y>0</y>
     <width>400</width>
     <height>21</height>
    </rect>
   </property>
  </widget>
  <widget class="QToolBar" name="mainToolBar">
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
  </widget>
  <widget class="QStatusBar" name="statusBar"/>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <customwidgets>
  <customwidget>
   <class>MyWidget</class>
   <extends>QWidget</extends>
   <header>mywidget.h</header>
   <container>1</container>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

mywidget.h:

#ifndef MYWIDGET_H
#define MYWIDGET_H

#include <QWidget>

class MyWidget : public QWidget
{
    Q_OBJECT
public:
    explicit MyWidget(QWidget *parent = 0);

protected:
    void paintEvent(QPaintEvent *e);

};

#endif // MYWIDGET_H

mywidget.cpp:

#include "mywidget.h"

#include <QStyleOption>
#include <QPainter>

MyWidget::MyWidget(QWidget *parent) :
    QWidget(parent)
{
}

void MyWidget::paintEvent(QPaintEvent *e)
{
    Q_UNUSED(e)

    QStyleOption opt;
    opt.init(this); // tried initFrom too, same result=>not working
    QPainter p(this);
    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}

main.cpp:

#include "mainwindow.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    a.setStyleSheet("MyWidget { background-color: red; }");

    MainWindow w;
    w.show();

    return a.exec();
}

Can't set style sheet for a derived class from QWidget in qt

Ok, I solved this problem by re-implementing the paintEvent(QPaintEvent *) function` like:

void CustomWidget::paintEvent(QPaintEvent *)
{
    QStyleOption opt;
    opt.init(this);
    QPainter p(this);
    style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}

More details are here: Qt Doc and a helpful answer.

---

Related Topics