Qt 图片按钮

1.给QPushButton添加背景图片；

2.QWidget窗口部件提升；

3.QSignalMapper使用；

4.简单样式表。

界面如下，随便找的一些图片素材，点击底部按钮显示和隐藏上面的六个图标面板。

1>六个图标的面板是一个单独的QWidget，代码如下：

#ifndef FORM_H
#define FORM_H

#include <QWidget>

namespace Ui {
class Form;
}

class QSignalMapper;
class Form : public QWidget
{
    Q_OBJECT

public:
    explicit Form(QWidget *parent = 0);
    ~Form();

signals:
    void sigButtonClick(QString);

private slots:
    void onAllButton(QString objName);

private:
    virtual void paintEvent(QPaintEvent *);

private:
    Ui::Form *ui;
    QSignalMapper *mapper;
};

#endif // FORM_H

#include "form.h"
#include "ui_form.h"
#include <QtWidgets>

Form::Form(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Form)
{
    ui->setupUi(this);

    this->setAttribute(Qt::WA_TranslucentBackground);
    QPixmap image1(":/skin/1.png");
    QPixmap image2(":/skin/2.png");
    QPixmap image3(":/skin/3.png");
    QPixmap image4(":/skin/4.png");
    QPixmap image5(":/skin/5.png");
    QPixmap image6(":/skin/6.png");

    ui->pb1->setIcon(image1);
    ui->pb2->setIcon(image2);
    ui->pb3->setIcon(image3);
    ui->pb4->setIcon(image4);
    ui->pb5->setIcon(image5);
    ui->pb6->setIcon(image6);

    ui->pb1->setFixedSize(image1.size());
    ui->pb2->setFixedSize(image2.size());
    ui->pb3->setFixedSize(image3.size());
    ui->pb4->setFixedSize(image4.size());
    ui->pb5->setFixedSize(image5.size());
    ui->pb6->setFixedSize(image6.size());

    ui->pb1->setCursor(QCursor(Qt::PointingHandCursor));
    ui->pb2->setCursor(QCursor(Qt::PointingHandCursor));
    ui->pb3->setCursor(QCursor(Qt::PointingHandCursor));
    ui->pb4->setCursor(QCursor(Qt::PointingHandCursor));
    ui->pb5->setCursor(QCursor(Qt::PointingHandCursor));
    ui->pb6->setCursor(QCursor(Qt::PointingHandCursor));

    mapper = new QSignalMapper(this);
    connect(mapper, SIGNAL(mapped(QString)), this, SLOT(onAllButton(QString)));
    connect(ui->pb1, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb1, ui->pb1->objectName());
    connect(ui->pb2, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb2, ui->pb2->objectName());
    connect(ui->pb3, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb3, ui->pb3->objectName());
    connect(ui->pb4, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb4, ui->pb4->objectName());
    connect(ui->pb5, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb5, ui->pb5->objectName());
    connect(ui->pb6, SIGNAL(clicked()), mapper, SLOT(map()));
    mapper->setMapping(ui->pb6, ui->pb6->objectName());
}

Form::~Form()
{
    delete ui;
}

void Form::paintEvent(QPaintEvent *)
{
    QPainter p(this);
    QColor clr(97, 175, 175, 100);
    QBrush brush(clr);
    //p.drawPixmap(0, 0, QPixmap(":/skin/login.png"));
    p.setRenderHint(QPainter::Antialiasing);
    p.setBrush(brush);
    p.setPen(clr);
    p.drawRoundedRect(rect(), 10, 10);
}

void Form::onAllButton(QString objName)
{
    emit sigButtonClick(objName);
}

Form的使用者只需要connect sigButtonClick信号就可以处理这六个按钮的点击事件
2>在QDialog上放置的是一个QWidget，在上面右键单击“提升为...”，然后填写Form类名，注意头文件也要对应起来，最后添加就可以了

#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>

namespace Ui {
class Dialog;
}

class Dialog : public QDialog
{
    Q_OBJECT

public:
    explicit Dialog(QWidget *parent = 0);
    ~Dialog();

private slots:
    void on_pb_logo_clicked(bool checked);
    void onAllButton(QString objName);

private:
    Ui::Dialog *ui;
};

#endif // DIALOG_H

#include "dialog.h"
#include "ui_dialog.h"
#include "form.h"
#include <QMessageBox>

Dialog::Dialog(QWidget *parent) :
    QDialog(parent),
    ui(new Ui::Dialog)
{
    ui->setupUi(this);
    this->setStyleSheet("background-color:rgb(64, 128, 128);");
    ui->pb_logo->setStyleSheet("background-color:transparent;background-image:url(:/skin/game_box.png)");
    ui->widget->hide();

    connect(ui->widget, SIGNAL(sigButtonClick(QString)), this, SLOT(onAllButton(QString)));
}

Dialog::~Dialog()
{
    delete ui;
}


void Dialog::on_pb_logo_clicked(bool checked)
{
    if (checked) {
        ui->widget->setVisible(true);
    } else {
        ui->widget->setVisible(false);
    }
}

void Dialog::onAllButton(QString objName)
{
    QMessageBox::information(this, tr("show"), objName);
}

工程地址： https://github.com/tujiaw/qtest3