【Qt 控件】自定义按钮

效果图

核心源代码

MyButton.h

#ifndef MYBUTTON_H
#define MYBUTTON_H

#include <QWidget>
#include <QTimer>
#include <QPainter>
#include <QMouseEvent>

class MyButton : public QWidget
{
    Q_OBJECT

public:
    explicit MyButtonconst bool& bType = false, QWidget *parent = 0);
    void SetPaintTextconst QString& sText); // 设置绘制文本
    void SetBlockColorconst QColor& color); // 设置色块颜色
    QString GetPaintText); // 获得绘制文本
    QColor GetBlockColor); // 获得色块颜色

protected:
    void paintEventQPaintEvent *event) Q_DECL_OVERRIDE; // 绘制事件
    void mousePressEventQMouseEvent *event) Q_DECL_OVERRIDE; // 鼠标按下事件
    void mouseReleaseEventQMouseEvent *event) Q_DECL_OVERRIDE; // 鼠标释放事件

signals:
    // 状态改变时，发射信号
    void toggled);

private:
    bool m_bChecked;         // 是否选中
    QColor m_checkColor;   // 选中颜色
    QString m_sText; // 绘制文本

    bool m_bType; // 为0则显示文本，为1则显示色块
};

#endif // MYBUTTON_H

MyButton.cpp

#include "MyButton.h"

MyButton::MyButtonconst bool& bType, QWidget *parent)
    : QWidgetparent)
{
    // 鼠标滑过光标形状 - 手型
    setCursorQt::PointingHandCursor);

    m_checkColor = QColor0, 150, 136);
    m_bChecked = false;
    m_bType = bType;

    this->setFixedSize128, 60);
}

// 绘制开关
void MyButton::paintEventQPaintEvent *event)
{
    Q_UNUSEDevent);

    // 根据按钮状态，设置绘制颜色
    QColor paintColor;
    if isEnabled)) { // 判断按钮是否可用
        // 可用状态
        if m_bChecked)
            paintColor = QColor73, 143, 248);
        else
            paintColor = QColor112, 112, 112);
    } else {
        // 不可用状态
        paintColor = QColor190, 190, 190, 0.26);
    }

    QPainter painterthis);
    // 反走样
    painter.setRenderHintQPainter::Antialiasing, true);
    // 设置画笔颜色
    QPen pen;
    pen.setWidth3);
    pen.setColorpaintColor);
    painter.setPenpen);
    // 绘制边框
    painter.drawRoundRect0, 0, 128, 60, 8);
    // 绘制多边形-倒三角形箭头
    const QPointF points[4] = {QPointF84, 20), QPointF106, 20), QPointF95, 40), QPointF84, 20)};
    painter.setBrushpaintColor);
    painter.drawPolygonpoints, 4);

    if !m_bType) {
        // 绘制文本
        QFont font;
        font.setFamily"Microsoft YaHei");
        font.setPointSize20);
        painter.setFontfont);
        painter.drawTextQRect14, 11, 128, 60), m_sText);
    } else {
        // 绘制色块
        if m_checkColor.red) == 255) {
            painter.setPenQPenQColor191, 191, 191), 1)); // 设置边框颜色
            painter.setBrushm_checkColor);
            painter.drawRoundRect12, 10, 41, 41, 5, 5);
        } else {
            painter.setPenm_checkColor);
            painter.setBrushm_checkColor);
            painter.drawRoundRect12, 10, 41, 41, 5, 5);
        }
    }
}

// 鼠标按下事件
void MyButton::mousePressEventQMouseEvent *event)
{
    if isEnabled)) {
        if event->buttons) & Qt::LeftButton) {
            m_bChecked = true;
            this->update);
        }
    }
}

// 鼠标释放事件 - 切换开关状态、发射toggled)信号
void MyButton::mouseReleaseEventQMouseEvent *event)
{
    if isEnabled)) {
        if event->type) == QMouseEvent::MouseButtonRelease) 
                && event->button) == Qt::LeftButton)) {
            event->accept);
            emit toggled);
            m_bChecked = false;
            this->update);
        }
    }
}

// 设置绘制文本
void MyButton::SetPaintTextconst QString& sText)
{
    m_sText = sText;
    this->update);
}

// 设置色块颜色
void MyButton::SetBlockColorconst QColor& color)
{
    m_checkColor = color;
}

// 获得绘制文本
QString MyButton::GetPaintText)
{
    return m_sText;
}

// 获得色块颜色
QColor MyButton::GetBlockColor)
{
    return m_checkColor;
}

Widget.cpp

#include "widget.h"

Widget::WidgetQWidget *parent) :
    QWidgetparent),
    uinew Ui::Widget)
{
    ui->setupUithis);

    // 初始化自定义按钮
    MyButton *pBtnPos = new MyButtonfalse);
    MyButton *pBtnSize = new MyButtonfalse);
    MyButton *pBtnColor = new MyButtontrue);
    pBtnPos->SetPaintTextQString::fromLocal8Bit"居中"));
    pBtnColor->SetBlockColorQColor196, 68, 21));
    pBtnSize->SetPaintTextQString::fromLocal8Bit"20px"));

    // 水平布局
    QHBoxLayout *pHLayoutMain = new QHBoxLayoutthis);
    pHLayoutMain->addWidgetpBtnPos);
    pHLayoutMain->addWidgetpBtnColor);
    pHLayoutMain->addWidgetpBtnSize);

    // 连接信号槽
    connectpBtnPos, SIGNALtoggled)), this, SLOTonToggled)));
    connectpBtnColor, SIGNALtoggled)), this, SLOTonToggled)));
    connectpBtnSize, SIGNALtoggled)), this, SLOTonToggled)));
}

Widget::~Widget)
{
    delete ui;
}

// 自定义按钮触发信号槽
void Widget::onToggled)
{
    qDebug) << "clicked";
}

GitHub代码下载

下载链接为：https://github.com/confidentFeng/QtAppProject/tree/MyButton