QCombobox down arrow image

Alatriste picture Alatriste · Jul 14, 2012 · Viewed 13.5k times · Source

How to change Qcombobox down arrow image? Right now I'm using this QSS code, but this doesn't work, I can't remove down arrow border.

QComboBox
{
    border: 0px;
}

QComboBox::down-arrow
{   
    border: 0px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image-width: 50px;
    border-image: url(./select-BG.png);
    heidth:50px;
    width:100px;
}

Here is the screenshot:

image

Answer

FrozenTarzan picture FrozenTarzan · Dec 9, 2015

this is a pretty late answer but I think that I found the solution somewhere in the Qt-forums.

When setting the border to 0px it seems that the whole style of the combo box arrow gets replaced. So I use QComboBox::drop-down to set the border to 0x and then use QComboBox::down-arrow to define a custom arrow. The code below shows an additional fix for a strange bug where one cannot change the color property of the text correctly.

QComboBox {
    color: black;
    font: 14px;
    padding: 1px 0px 1px 3px; /* This (useless) line resolves a bug with the font color */
}

QComboBox:focus {
    color: red;
}

QComboBox::drop-down 
{
    border: 0px; /* This seems to replace the whole arrow of the combo box */
}

/* Define a new custom arrow icon for the combo box */
QComboBox::down-arrow {
    image: url(Resources/DropDownArrow.png);
    width: 14px;
    height: 14px;
}

I hope that someone can use this info and get it work :-)