Qt 图片按钮-蒲公英云

1.给QPushButton添加背景图片；

2.QWidget窗口部件提升；

3.QSignalMapper使用；

4.简单样式表。

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

SouthEast

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

[cpp] view plain copy

在CODE上查看代码片派生到我的代码片

#ifndef FORM_H
#define FORM_H
#include
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

[cpp] view plain copy

在CODE上查看代码片派生到我的代码片

#include “form.h”
#include “ui_form.h”
#include
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类名，注意头文件也要对应起来，最后添加就可以了

[cpp] view plain copy

在CODE上查看代码片派生到我的代码片

#ifndef DIALOG_H
#define DIALOG_H
#include
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

[cpp] view plain copy

在CODE上查看代码片派生到我的代码片

#include “dialog.h”
#include “ui_dialog.h”
#include “form.h”
#include
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);
}