QComboBox behaving different when there is background-color

Pikachu

self.setStyleSheet("background-color:#396745")
self.drop=QComboBox(self)
self.drop.addItem('1')
self.drop.addItem('2')

The output of above code
alt text

Expected output but with color

alt text

jsulm

@Pikachu I guess that's because you're overwriting the style sheet of the parent and only set background, so everything else gets lost.

Pikachu

@jsulm said in QComboBox behaving different when there is background-color:

@Pikachu I guess that's because you're overwriting the style sheet of the parent and only set background, so everything else gets lost.

Yes I over come that situation but if i give background-color to only QComboBox he also act as first image

Christian Ehrlicher

See the documentation about the drawbacks of a style sheet:

Style sheets are applied on top of the current widget style, meaning that your applications will look as native as possible, but any style sheet constraints will be taken into consideration.

jsulm

@Pikachu said in QComboBox behaving different when there is background-color:

Yes I over come that situation but if i give background-color to only QComboBox he also act as first image

How is that possible? If you don't change the stylesheet of the parent, then parent should not change. Please post the code.

Pikachu

@jsulm said in QComboBox behaving different when there is background-color:

@Pikachu said in QComboBox behaving different when there is background-color:

Yes I over come that situation but if i give background-color to only QComboBox he also act as first image

How is that possible? If you don't change the stylesheet of the parent, then parent should not change. Please post the code.

self.setStyleSheet("QMainWindow{background-color:#396745}")
self.drop=QComboBox(self)
self.drop.addItem('1')
self.drop.addItem('2')
self.drop.setStyleSheet("baground-color:red")

For overcome this I used QStandardItem

jsulm

@Pikachu said in QComboBox behaving different when there is background-color:

self.setStyleSheet("QMainWindow{background-color:#396745}")

You are still overwriting the style-sheet of the parent widget.

Pikachu

@jsulm Then how i can give style to qcombobox

DJaq

@Pikachu
You can use:

setStyleSheet("QComboBox{ background-color: blue; }");

And if you want to target a very specific Combobox, you can use the objectName property of your combobox like so:

setStyleSheet("QComboBox#name_specific_combobox{ background-color: blue; }");

Pikachu

@DJaq @jsulm
Code:

  def __init__(self):
    super().__init__()
    self.setStyleSheet("QMainWindow{background-color:black}QComboBox{background-color:blue}")
    self.drop=QComboBox(self)
    self.drop.addItem('1')
    self.drop.addItem('2')

Output:

What i did wrong?

DJaq

@Pikachu
You did nothing wrong, but I guess that you are confused about the look of the Combobox now, don't you? :D
I'm only a beginner with Qt and development in general, but every time I worked with stylesheets, I ended up restyling completely the widgets:

When your widget does not have any custom stylesheet applied, it takes the Windows Vista style checkbox (on Windows only, I do not know for Linux and MacOS).
If you apply a stylesheet (even if it is for only one property, like you did with the background-color), the widget loses all its default OS style and you need to specify a whole complete new style.

So, what you obtain does not surprise me ^^
If you plan restyling your combobox completely with stylesheets, I suggest you to use this magic line to have your Items in the dropdown menu styled too (otherwise, the stylesheet is partially applied to them):

ui.example_combobox->setItemDelegate(new QStyledItemDelegate());

Moreover, I do know that something like QStyle and QStyleProxy exist, and might help you, but I've never used them, nor I checked to see how they can be used and for what. But I suggest you to do some researches about it.

Pikachu

@DJaq Can you guide me how can I create whole complete new style using stylesheet or you can provide me some code so I can understand from that.

And Thanks for your helps @DJaq @jsulm @Christian-Ehrlicher

DJaq

@Pikachu
You can find a vast list of examples here:
https://doc.qt.io/qt-5/stylesheet-examples.html

Moreover, if you want to check what you could end up with in a real-life application, I suggest you to check:

I used their stylesheets in this program, also I created two stylesheets called "Mitsuriou's Dark Theme.qss" and "Mitsuriou's Light Theme.qss", that you can find in one of my personal repo:
https://github.com/Mitsuriou/MFBO-Preset-Creator/tree/main/MFBOPresetCreator/ressources/qss
I styled the "basic" widgets, so you will not find QSpinBox, for example, as I do not use them. ^^