I would like to set a QToolButton's icons using style sheets, like this :
#include <QToolButton>
#include <QApplication>
QString FormStyleSheetString( const QString & name )
{
const QString thisItemStyle( "QToolButton:enabled { image: url(" + name + "_normal.png); } "
"QToolButton:pressed { image: url(" + name + "_pressed.png); } "
"QToolButton:disabled { image: url(" + name + "_disabled.png); } "
);
return thisItemStyle;
}
int main(int argc, char * argv[])
{
QApplication qapp(argc,argv);
QToolButton button;
button.setStyleSheet( FormStyleSheetString( "button" ) );
button.setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
button.setIconSize(QSize(200,200));
button.setText("some thing..." );
button.show();
return qapp.exec();
}
I compiled it like this :
g++ -O3 -std=c++0x -Wall -Wextra -pedantic test.cpp -lQtCore -lQtGui -I/usr/include/Qt/ -I/usr/include/QtCore/ -I/usr/include/QtGui/
Unfortunately, the above doesn't work (the icon is not shown).
If I use setIcon, then the icon is shown properly.
So, what am I doing wrong? How to set the button's icon using style sheet?
The images I used are :
PS Take a note that I asked similar question here, but the answer doesn't work once the text is set (the icon is all squished, and the text is not below the icon).
EDIT 1: I also tried this function (as Kamil Klimek suggested) :
QString FormStyleSheetString( const QString & name )
{
const QString thisItemStyle( "QToolButton { qproperty-icon: url(" + name + "_normal.png); }; "
"QToolButton:pressed { qproperty-icon: url(" + name + "_pressed.png); }; "
"QToolButton:hover { qproperty-icon: url(" + name + "_disabled.png); }; "
);
return thisItemStyle;
}
but it also didn't work. Pressing the button, or hovering, doesn't change the icon.
Later that day I managed to somehow solve the problem, but forgot to post the solution :
QString FormStyleSheetString( const QString & name )
{
const QString thisItemStyle(
"QToolButton {\n"
" border: none;\n"
" background: url(" + name + "_normal.png) top center no-repeat;\n"
" padding-top: 200px;\n"
" width: 200px;\n"
" font: bold 14px;\n"
" color: red;\n"
"}\n"
"QToolButton:hover {\n"
" background: url("+name+"_hover.png) top center no-repeat;\n"
" color: blue;\n"
"}\n"
"QToolButton:pressed {\n"
" background: url("+name+"_pressed.png) top center no-repeat;\n"
" color: gray;\n}" );
return thisItemStyle;
}
It wasn't enough just to set the background. It also needed the size fixed.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With