闲着无聊,发现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用法一致