PyQt4 - Applying a stylesheet on an object which inherits from QWidget

Question

I am having an issue with PyQt4. I have a class which inherits from QWidget. This class uses a layout to store a QLabel and a QLineEdit. Here is the code:

class SearchBar(QtGui.QWidget):
    def __init__(self, parent=None):
        super(SearchBar, self).__init__(parent)
        self.setStyleSheet(SEARCHBAR_STYLE)

        layout = QtGui.QHBoxLayout()
        layout.setSpacing(0)
        layout.setMargin(0)
        layout.addStrut(SEARCHAR_HEIGHT)

        lbl_notification = QtGui.QLabel('Hi')
        lbl_notification.setStyleSheet(SEARCHBAR_NOTIFICATION_STYLE)
        layout.addSpacing(10)
        layout.addWidget(lbl_notification)

        searchbox = QLineEdit('Search')
        layout.addStretch()
        layout.addWidget(searchbox)
        layout.addSpacing(10)

        self.setLayout(layout)

and here is the stylesheet:

SEARCHBAR_STYLE = """
                  QWidget {
                      background: #424a7d;
                  }
                  .QWidget {
                      border: 1px solid grey;
                  }
                  QLabel {
                      border-top: 1px solid grey;
                      border-bottom: 1px solid grey;
                  }
                  """

Now, my problem is that the stylesheet does not apply the way I would like it to. It only applies on my QLabel when the border should be around the whole object:

When I had a function creating my search bar as a QWidget, it worked perfectly, but now that I changed that to a class it does not work. What am I doing wrong?

EDIT: I am trying to achieve this:

EDIT 2: The previous code, before I change it to a class, was this:

def create_bar():
    layout = QtGui.QHBoxLayout()
    layout.setSpacing(0)
    layout.setMargin(0)
    layout.addStrut(SEARCHAR_HEIGHT)

    lbl_notification = QtGui.QLabel('Hi')
    lbl_notification.setStyleSheet(SEARCHBAR_NOTIFICATION_STYLE)
    layout.addSpacing(10)
    layout.addWidget(lbl_notification)

    search_bar = QtGui.QLineEdit('Search')
    search_bar.setMinimumSize(200, 25)
    search_bar.setMaximumSize(200, 25)
    search_bar.setStyleSheet(SEARCHBOX_STYLE)

    layout.addStretch()
    layout.addWidget(search_bar)
    layout.addSpacing(10)

    widget = QtGui.QWidget()
    widget.setStyleSheet(SEARCHBAR_STYLE)
    widget.setLayout(layout)
    return widget

When you say the following: changed that to a class, what do you mean? — eyllanesc
@eyllanesc SearchBox is a class which inherits QLineEdit and has some override functions in order to suit my needs. I left it out of the question because I dont think it is relevant to my problem — Alex Kasapis
@eyllanesc I used to call a function which returned a QWidget, which was basically a container for my SearchBar. I applied my stylesheet to this container - just how I am now applying the stylesheet to self - and it worked fine. — Alex Kasapis

Aleš Erjavec Aleš Erjavec · Accepted Answer · 2017-09-05T21:48:20

Change the base class of SearchBar from QWidget to QFrame, or alternatively implement a style sheet aware paintEvent:

def paintEvent(self, event):
    opt = QStyleOption()
    opt.initFrom(self)
    painter = QPainter(self)
    self.style().drawPrimitive(QStyle.PE_Widget, opt, painter, self)

Then change the style sheet to

SEARCHBAR_STYLE = """
SearchBar {
    background: #424a7d;
    border: 1px solid grey;
}
"""

PyQt4 - Applying a stylesheet on an object which inherits from QWidget

1 Answers