Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

QCombobox down arrow image

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

like image 343
Alatriste Avatar asked Jan 16 '23 02:01

Alatriste


2 Answers

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 :-)

like image 143
FrozenTarzan Avatar answered Jan 25 '23 05:01

FrozenTarzan


The arrow is on a button whose style is controlled by the ::drop-down subcontrol. So, to remove the border you can use:

QComboBox::drop-down 
{
    border: 0px;
}
like image 23
alexisdm Avatar answered Jan 25 '23 07:01

alexisdm