views:

503

answers:

1

Hi Geeks,

I am struggling to set an background image for an QPushButton. No Success till now. Following is my code.

appsWidget::appsWidget(QWidget *parent)
    :QWidget(parent)
{
    QPushButton *button1 = new QPushButton("SETTINGS",this);
    QPushButton *button2 = new QPushButton("TEST",this);
    QPushButton *button3 = new QPushButton("IE",this);

    button1->setStyleSheet("background-image:url(config.png)"); -> No success


    qDebug("appWidget initialized.");

    QHBoxLayout *layout = new QHBoxLayout;
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    this->setLayout(layout);
    connect(button1,SIGNAL(clicked()),this,SLOT(setClickIndex1()));
    connect(button2,SIGNAL(clicked()),this,SLOT(setClickIndex2()));
    connect(button3,SIGNAL(clicked()),this,SLOT(setClickIndex3()));
}

The image I am using in the stylesheet is located in the same project folder. Do anybody has any solution?

A: 

You have to set the flat attribute to true:

button1->setFlat(true);

You also have to set the autofillbackground -

button1->setAutoFillBackground(true);

You may want to look at QToolButton which doesn't require it to be flat in order to render an image. I'm using them in an app I'm writing at the moment and they look very nice:

m_showAddCommentButton = new QToolButton();
m_showAddCommentButton->setAutoFillBackground(true);
palette = m_showAddCommentButton->palette();
palette.setColor(QPalette::Button,QColor(82,110,166));
m_showAddCommentButton->setPalette(palette);
m_showAddCommentButton->setIcon(QIcon(":/uiImages/addComment_50_50.jpg"));
m_showAddCommentButton->setIconSize(QSize(40,40));
m_showAddCommentButton->setToolTip("Comment");
connect(m_showAddCommentButton, SIGNAL(clicked()),
        manager, SLOT(showAddComment()));
hLayout->addWidget(m_showAddCommentButton,0);

(My image is stored as a resource)

Brian Roach
In the above code should i resize my Image to fit to the button or it will be taken care of automatically?
Surjya Narayana Padhi
You can go either way. Originally I resized my image to 50x50 externally in an editor, but then decided I wanted 40x40 - `setIconSize()` scales the icon to whatever you want.
Brian Roach