9

I'm trying to style a combobox in QT5. I'm using QT Creator for the layout and loading an app-wide style sheet at start up.

The css I have related to my combobox is as follows:

QComboBox
{
    color:white;
    background-color: qlineargradient(x1:0, y1:0, x2:1,y2:1, stop: 1 rgba(228, 41, 81, 100), stop: 0 rgba(234, 107, 101, 100));
    border-color: rgba(255,255,255,200);
    border-width: 1px;
    border-style: solid;
}

QComboBox QListView
{
    border-style: none;
    background-color: qlineargradient(x1:0, y1:0, x2:1,y2:0, stop: 1 rgba(228, 41, 81, 100), stop: 0 rgba(234, 107, 101, 100));
}

QComboBox::drop-down
{
    width: 20px;
    border: 1px;
    border-color:white;
    border-left-style:solid;
    border-top-style: none;
    border-bottom-style: none;
    border-right-style: none;
}

QComboBox::down-arrow
{
    image: url(:/ArrowImages/images/whitearrowdown16.png);
    width: 16px;
    height: 16px;
}

But the text colour in the combo box remainds as the default (black) colour. The colour in the drop down is white. The border colour and styling all work correctly. Is the label on the combobox some sort of sub-control I need to style separately? Or am I missing something else?

Thanks.

Edit:

Added screenshots for clarity

Combobox style

Drop down style

Edit 2: It looks like this only occurs when the combobox is set to not be editable (which is the correct behaviour for my program, so doesn't really help me.) When the combobox is set to editable, it obeys styles correctly. I've tried adding

QCombobox:!editable
{
    color:white;
}

but it doesn't fix the problem.

Sam
  • 374
  • 1
  • 3
  • 14
  • If you load Stylesheets from a file, maybe you have another stylsheet loaded afterwards in your application which overwrites that specific style? You could try using `QComboBox#YOUR_SPECIFIC_COMBO_BOX_NAME { color: white; }` – TWE Jun 27 '14 at 12:43

3 Answers3

17

Only just resolved this. It seems setting the padding property (with any value) on the combobox in the style sheet makes it properly obey the colour styling. I'm assuming it's down to some sort of bug that might only arise on certain set ups, but if anyone else is having the same problem, the following code would work (when compared with that in the original question):

QComboBox
{
    color:white;
    background-color: qlineargradient(x1:0, y1:0, x2:1,y2:1, stop: 1 rgba(228, 41, 81, 100), stop: 0 rgba(234, 107, 101, 100));
    border-color: rgba(255,255,255,200);
    border-width: 1px;
    border-style: solid;
    padding: 1px 0px 1px 3px; /*This makes text colour work*/
}
Sam
  • 374
  • 1
  • 3
  • 14
2

The View "inside" is a QListView.

QListView
{
  color: white;
}

should do the trick.

OnWhenReady
  • 939
  • 6
  • 15
  • Sorry, it's the actual combobox itself - not the drop down - which isn't accepting the change to colour. The drop down styles correctly (although using the colour from the QComboBox section, rather than it's own. However in my case this isn't a problem.) – Sam Jun 27 '14 at 09:02
  • Do you mean the current item? For the current item your code (first part) is perfectly fine (`QComboBox{ color: white; }`). Have you tried to delete all stylesheet code besides the color tag? – OnWhenReady Jun 27 '14 at 09:40
  • I've added some screenshots to the original question for clarity. I've tried creating a completely blank style sheet with only the combobox style sheet with colour, and it still only affects the dropdown. – Sam Jun 27 '14 at 09:49
-1

Using padding as a workaround might introduce some other problems. Perhaps setting selection-color should resolve this issue.

QComboBox
{
   selection-color: white;
}
eyllanesc
  • 235,170
  • 19
  • 170
  • 241
cezs
  • 1