Qt自定义图片按钮并设置方向

Qt自定义图片按钮，设置方向

  虽然Qt定义了很多很多控件，但是还是不能满足用户的需要，比如如果想使用ToolButton，需要带文字，又需要文字可以设定位置，显然就不行了。下面的代码就是一个简单的实现ToolButton功能，并且能够设置图片的位置。
  运行截图如下：

  下面是代码部分：

基本定义

// BaseDefine.h
enum class WIDGET_DIRECTION
{
    WD_EAST,
    WD_SOUTH,
    WD_WEST,
    WD_NORTH
};

头文件

// ImageButton.h
#ifndef IMAGEBUTTON_H
#define IMAGEBUTTON_H

#include <QLabel>
#include <QWidget>
#include <QHBoxLayout>
#include <QVBoxLayout>

#include "BaseDefine.h"
// 图片按钮类
class ImageButton : public QWidget
{
    Q_OBJECT
public:
    // 设置按钮的图片大小，如果不设置默认大小是50*50
    static void SetImageSize(int w, int h)
    {
        mnWidth = w, mnHeight = h;
    }

    // 构造函数
    ImageButton(QString text,
            const char* imagePath,
            WIDGET_DIRECTION imageDirection = WIDGET_DIRECTION::WD_NORTH,
                QWidget *parent = NULL);

private:
    // 设置图片文本内容
    void SetText(QString text);
    // 设置按钮图片
    void SetImage(const char *imagePath);

protected:
    // 重定义鼠标点击事件，只接受当前按钮内的点击和释放
    void mousePressEvent(QMouseEvent *event);
    void mouseReleaseEvent(QMouseEvent *event);

signals:
    // 点击信号
    void Clicked();

private:
    // 设定的图片宽度和高度
    static int mnWidth;
    static int mnHeight;

    // 承载图片和文字
    QLabel* mLblImage;
    QLabel* mLblText;

    // 用于Label的布局，使呈现各种方位
    QVBoxLayout* mLytBtnV;
    QHBoxLayout* mLytBtnH;

};

#endif // IMAGEBUTTON_H

源文件实现

#include "ImageButton.h"
#include <QPixmap>
#include <QMouseEvent>

// 初始化默认值
int ImageButton::mnWidth = 50;
int ImageButton::mnHeight = 50;

// 构造
ImageButton::ImageButton(QString text,
                         const char *imagePath,
                         WIDGET_DIRECTION imageDirection,
                         QWidget *parent)
    :QWidget(parent)
{
    // 构造并设置
    mLytBtnH = NULL;
    mLytBtnV = NULL;
    mLblImage = new QLabel(this);
    SetImage(imagePath);
    mLblText = new QLabel(this);
    SetText(text);
    mLblText->setScaledContents(true);

    // 判断图片位置，并设定
    switch (imageDirection) {
    case WIDGET_DIRECTION::WD_EAST:
        mLytBtnH = new QHBoxLayout(this);
        mLytBtnH->addWidget(mLblText);
        mLblText->setAlignment(Qt::AlignRight | Qt::AlignVCenter);
        mLblText->setMinimumHeight(mLblImage->height());
        mLytBtnH->addWidget(mLblImage);
        break;
    case WIDGET_DIRECTION::WD_SOUTH:
        mLytBtnV = new QVBoxLayout(this);
        mLytBtnV->addWidget(mLblText);
        mLytBtnV->addWidget(mLblImage);
        break;
    case WIDGET_DIRECTION::WD_WEST:
        mLytBtnH = new QHBoxLayout(this);
        mLytBtnH->addWidget(mLblImage);
        mLytBtnH->addWidget(mLblText);
        mLblText->setAlignment(Qt::AlignVCenter);
        mLblText->setMinimumHeight(mLblImage->height());
        break;
    case WIDGET_DIRECTION::WD_NORTH:
        mLytBtnV = new QVBoxLayout(this);
        mLytBtnV->addWidget(mLblImage);
        mLytBtnV->addWidget(mLblText);
        break;
    default:
        break;
    }
    // 设置本控件内部的间隔为0
    if (mLytBtnV != NULL)
    {
        mLytBtnV->setContentsMargins(0,0,0,0);
        mLytBtnV->setSpacing(0);
    }
    else
    {
        mLytBtnH->setContentsMargins(0,0,0,0);
        mLytBtnH->setSpacing(0);
    }
}

// 设置图片，并缩放
void ImageButton::SetImage(const char *imagePath)
{
    QPixmap pix(imagePath);
    QPixmap newPix = pix.scaled(mnWidth,mnHeight,Qt::KeepAspectRatio);
    mLblImage->setMaximumSize(mnWidth,mnHeight);
    mLblImage->setPixmap(newPix);
}

// 设置按钮文本
void ImageButton::SetText(QString text)
{
    mLblText->setText(text);
}

// 鼠标左键按下事件
void ImageButton::mousePressEvent(QMouseEvent *event)
{
    if (event->button() == Qt::LeftButton)
    {
        // 可以添加你自己定义的其他事件，比如被选中，或者恢复颜色 
    }
}

// 鼠标左键弹起事件
void ImageButton::mouseReleaseEvent(QMouseEvent *event)
{
    if (event->button() == Qt::LeftButton)
    {
        // 可以添加你自己定义的其他事件，比如被选中，或者恢复颜色 
        emit Clicked();
    }
}

  这样就可以直接使用该控件了，在使用时可以根据需要灵活变换位置；本文没有列出其他的功能，如按钮样式的设置及其他的复杂功能，你可以自行设计。

原文出处：http://blog.csdn.net/motou263514/article/details/78075974