PDA

View Full Version : Styling QComboBox



martinn
2nd March 2010, 17:31
I'm trying to style my QCombobox with help of this guide http://pepper.troll.no/s60prereleases/doc/stylesheet-examples.html#customizing-qcombobox

I have two problems:

1. I want to set the QComboBox::down-arrow image but I'm not sure how to set the right url to the image. From the root of my project the file is located in "/src/Resources/downicon.png" but is that the way I set it or should I use the path I setup in resources.qrc? The image doesn't seem to like either way.

This is an image of my QComboBox, you can see that the arrow is missing:
http://i46.tinypic.com/29q0503_th.png

2. My other problem is that I want to style the menu that popups when the QComboBox is pressed. Now it is just black background but I want to use a lineargradient is that possible?

This is how it looks now:
http://i48.tinypic.com/ncl1tx.jpg


This is the stylesheet:


QComboBox {
font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
border: 1px solid #D3D3D3;
border-radius: 8px;
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #EEEEEE, stop: 1 #FFFFFF);
color: #333;
font-size: 6pt;
padding: 8px;
}

QComboBox:on {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #D5D5D5, stop: 1 #EEEEEE);
}

QComboBox::drop-down {
border: 1px solid #D3D3D3;
border-radius: 8px;
}

QComboBox::down-arrow {
padding: 0px 5px 0px 5px;
image: url("/src/Resources/downicon.png");
}


QComboBox::down-arrow:on {

}

Lykurg
2nd March 2010, 20:55
To 1) I would recommend the Qt resource system. Then your url would look like that:image: url(":/downicon.png");. But it is not working, because you have to provide a absolute path in the file or a proper relative one. (And your installation must support png)

to 2) use QComboBox QListView
{
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #D5D500, stop: 1 #EE00EE);
}