Icons/images for QToolButton: clickable area not superimposed

DerekDomino

Hello,

I'm using very small images/icons for QToolButton's: 8x8 pixels. When clicking a bit above the image (about 3 pixels above the top of the image border) then the button is clicked. Also, when clicking inside the image (up ~3 pixels above the bottom image border), the button is not clicked.

The clickable area of the button is not superimposed to the icon image.

The problem occurs whenever an icon is set (setIcon()) or setting a background image with stylesheets, like:

@QToolButton {
background: url(...);
}
@

I'm not using the "no-repeat" tag for the background declaration of the stylesheet: in this way if the image is not repeated then it means that the button has to correct size (the maximumSize of the button is set to 8x8 pixels).

The problem occurs also with QPushButton's.

May be it is not necessarily related to small images, I had the problem with larger buttons, the button was clickable at the left and the right of the image.

Do you have any hints where could the problem (and its solution ;-) )?

DerekDomino

Testing continued: so the above reported problem is for Mac OS X (Lion). On Windows 7 I don't have this problem: the clickable area matches with the background image.

Going to submit a bug

absfrm

hi
you can use external style sheet as qss file!
for example , create a file with .qss format and fill it such as this :

@
QToolBar {
background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #9fc6df, stop:0.5 #256894 stop:1 #77c5cb);
}

QToolBar QToolButton {
background: transparent;
color: white;
}

QToolBar QToolButton:hover:enabled {
border: 1px solid grey;
border-radius: 3px;
background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #f0f0f0 stop:0.5 #054874 stop:1 #6fc9ca);
}

QToolBar QToolButton:pressed {
border: 1px solid grey;
border-radius: 3px;
background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #c0c0d0 stop:0.5 #054874 stop:1 #377277);
}

QToolBar QToolButton:on {
border: 1px solid grey;
border-radius: 3px;
background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 #c0c0d0 stop:0.5 #054874 stop:1 #377277);
}
@

and load it in your form code :
@
QFile styleSheet("/1.qss");
if (!styleSheet.open(QIODevice::ReadOnly))
{
return;
}
qApp->setStyleSheet(styleSheet.readAll());
@

DerekDomino

Hi Abbas,

Thanks again for you answer :-)

I'm indeed using an external qss stylesheet. The code snippet in my post above was just for the example.

The problem is that whenever I use a background image (set via an external or inline stylesheet) or use an icon (set via QToolButton::setIcon(...)), on Mac OS X the clickable area is not aligned with the image. On Windows 7 it works.

absfrm

oh I'm sorry, I never tested it in Mac Os!