How to set a Qt button's icons using stylesheet?

Question

I would like to set a button's icons using stylesheets, 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.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 :

Answer 1

There was similar unanswered question before, right here . It seems that you should try setting border-image property instead of icon one.

To fix it, change FormStyleSheetString function to this :

QString FormStyleSheetString( const QString & name )
{
  const QString thisItemStyle( "QToolButton:enabled { border-image: url(" + name + "_normal.png); }  "
                               "QToolButton:pressed { border-image: url(" + name + "_pressed.png); }  "
                               "QToolButton:disabled { border-image: url(" + name + "_disabled.png); }  "
                           );

  return thisItemStyle;
}