QT 自定义动态图片按钮(Pushbutton扩展)

最新推荐文章于 2024-07-14 21:50:34 发布

原创最新推荐文章于 2024-07-14 21:50:34 发布 · 813 阅读

本内容遵循CC 4.0 BY-SA版权协议

标签

#qt #开发语言

闲着无聊，发现QT的默认按钮比较死板；网上找了几个动态效果的按钮，不是限制较多，就是使用麻烦，就自己简单弄了一个，满足有个一点动态的效果，要求不高的场景。

原理：基于Pushbutton扩展，先载入图片，鼠标放上/点击之后按一定比例放大或缩小，从而实现一定动态效果。

1、直接上按钮的代码：

1）.h

#ifndef QMYBUTTONA_H

#define QMYBUTTONA_H

#include <QWidget>

#include <QPushButton>

#include <QPaintEvent>

#include <QEvent>

#include <QMouseEvent>

#include <QPainter>

#include <QRect>

#include <QString>

#define DISPHASE 2       //2是有三级，0,1,2

#define DISMOVE 0.1          //周边变化大小比例 0.1=10%

#define DISMOVEPRESS 0.05

class QMyButtonA : public QPushButton

    Q_OBJECT

public:

    explicit QMyButtonA(QWidget *parent = nullptr);

public:

    void mySetBackgroudPic(QString str_pix);

protected:

    void initImageRectlist();

protected:

    void paintEvent(QPaintEvent *event);/*paintEvent 绘图事件*/

    void enterEvent(QEvent *event);/*enterEvent 鼠标放在按键上事件*/

    void leaveEvent(QEvent *event);/*leaveEvent 鼠标离开按键事件*/

    void mousePressEvent(QMouseEvent *e);/*mousePressEvent 鼠标点击按键事件*/

    void mouseReleaseEvent(QMouseEvent *e);/*mouseReleaseEvent 鼠标松开按键事件*/

public:

    int m_curRIndex; //当前show的图片位置索引

    QList<QRect> m_imageRectlist; //图片显示RECT

private:

    QPixmap m_imagePix;

signals:

public slots:

};

#endif // QMYBUTTONA_H

2).cpp

#include "qmybuttona.h"

#include <QDebug>

#include <math.h>

QMyButtonA::QMyButtonA(QWidget *parent) : QPushButton(parent)

    m_curRIndex=0;

    this->setStyleSheet("QPushButton{border: none; background: transparent;}");//去掉边框,设置背景色

    this->setFlat(true);

void QMyButtonA::mySetBackgroudPic(QString str_pix)

    initImageRectlist();

    m_imagePix = QPixmap(); //清空m_imagePix，放置load很多，消耗内存

    m_imagePix.load(str_pix); // 使用load()函数加载图像(str_pix);

void QMyButtonA::initImageRectlist()

    m_curRIndex=0;

    m_imageRectlist.clear();

    QRect myRect(0,0,this->width(),this->height());

    int wadj2=ceil(this->width()*DISMOVEPRESS);//向上取整

    int hadj3=ceil(this->height()*DISMOVEPRESS);//向上取整

    m_imageRectlist.append(myRect.adjusted(wadj2,hadj3,-wadj2,-hadj3));//正常状态下显示大小，比控件小，按比例缩小DISMOVE

    m_imageRectlist.append(myRect); //鼠标放上去的大小，还原，控件大小

    int wadj1=ceil(this->width()*DISMOVE);//向上取整

    int hadj1=ceil(this->height()*DISMOVE);//向上取整

    m_imageRectlist.append(myRect.adjusted(wadj1,hadj1,-wadj1,-hadj1));  //鼠标按下去的大小

void QMyButtonA::enterEvent(QEvent *event)

    m_curRIndex = 1;

    //update();

    QPushButton::enterEvent(event);

void QMyButtonA::leaveEvent(QEvent *event)

    m_curRIndex = 0;

    //update();

    QPushButton::leaveEvent(event);

void QMyButtonA::mousePressEvent(QMouseEvent *e)

    if(e->button() == Qt::LeftButton)

        m_curRIndex = 2;

        //emit clicked();//可以向外通知

        //update();

    QPushButton::mousePressEvent(e);

void QMyButtonA::mouseReleaseEvent(QMouseEvent *e)

    if(e->button() == Qt::LeftButton)

        m_curRIndex = 0;

        update();

    QPushButton::mouseReleaseEvent(e);

void QMyButtonA::paintEvent(QPaintEvent *event)

    QPushButton::paintEvent(event);  //把button的边框等都画出来了

    QPainter painter(this);

    if(m_curRIndex>=m_imageRectlist.size()) return; //异常保护

    painter.setRenderHint(QPainter::SmoothPixmapTransform, true);//使用平滑滤波器，抗锯齿

    painter.drawPixmap(m_imageRectlist[m_curRIndex],m_imagePix);//画图画到中间

2、按钮的使用：

m_button_close = new QMyButtonA(this); //或者提升界面pushbutton为QMyButtonA，都行

m_button_close->mySetBackgroudPic(":/image/close_n.png"); //就多加这么一句话就可以了。

connect(m_button_close,&QMyButtonA::clicked,this,&XXXXXXX::mymbtnCloseclicked);  //这个使用和pushbutton用法一致