话不多说:解释都在代码里
直接上代码
所有文件:
mybtn.h
#ifndef MYBTN_H
#define MYBTN_H
#include <QObject>
#include <QWidget>
#include<QPaintEvent>
#include<QEvent>
#include<QPushButton>
#include<qpropertyanimation.h>
#include<QDebug>
class mainButton : public QPushButton//用于主的图片
{
Q_OBJECT
public:
mainButton(QString pixenter, QString pixleave, QWidget*parent);
~mainButton();
protected:
//鼠标进入事件
void enterEvent(QEvent*);
//鼠标离开事件
void leaveEvent(QEvent*);
//绘制动态图片
void paintEvent(QPaintEvent*);
//两个动画类:一个进入一个离开
QPropertyAnimation*m_enteranimation;
QPropertyAnimation*m_leaveanimation;
//存储进入、离开事件需要绘画的图片
QList<QPixmap> m_enterlist;
QList<QPixmap> m_leavelist;
//进入事件绘制的图片下标
int m_enterIndex;
//离开事件绘制的图片下标
int m_leaveIndex;
//标志位
bool m_enter;
bool m_leave;
public slots:
void entervaluechange(QVariant var){m_enterIndex=var.toInt();update();}
void leavevaluechange(QVariant var){m_leaveIndex=var.toInt();update();}
};
#endif // MYBTN_H
mybtn.c
#include "mybtn.h"
#include<QPainter>
#include<QDebug>
#include<QLabel>
#include<QHBoxLayout>
#include<QFontMetrics>
mainButton::mainButton(QString strpixenter,QString strpixleave,QWidget*parent):QPushButton(parent)
{
QPixmap pixenter(strpixenter);
QPixmap pixleave(strpixleave);
m_leave=false;
m_enter=true;
m_leaveIndex=0;
m_enterIndex=0;
for(int i=0;i<10;i++)//进入
{
m_enterlist<<pixenter.copy(i*(pixenter.width()/10),0,pixenter.width()/10,pixenter.height());
}
for(int j=0;j<8;j++)//离开
{
m_leavelist<<pixleave.copy(j*(pixleave.width()/8),0,pixleave.width()/8,pixleave.height());
}
//QPropertyAnimation的效果就是把绑定的变量从设定的初始值变为结束值
m_enteranimation=new QPropertyAnimation(this,"");
m_enteranimation->setStartValue(0);
m_enteranimation->setEndValue(9);
//动画的持续时间
m_enteranimation->setDuration(600);
connect(m_enteranimation,SIGNAL(valueChanged(QVariant)),this,SLOT(entervaluechange(QVariant)));
m_leaveanimation=new QPropertyAnimation(this,"");
m_leaveanimation->setStartValue(0);
m_leaveanimation->setEndValue(7);
m_leaveanimation->setDuration(600);
connect(m_leaveanimation,SIGNAL(valueChanged(QVariant)),this,SLOT(leavevaluechange(QVariant)));
}
mainButton::~mainButton()
{
delete m_leaveanimation;
delete m_enteranimation;
}
void mainButton::enterEvent(QEvent *)
{
m_enter=true;
m_leave=false;
m_enteranimation->start();
}
void mainButton::leaveEvent(QEvent *)
{
m_enter=false;
m_leave=true;
m_leaveanimation->start();
}
void mainButton::paintEvent(QPaintEvent *)
{
QPainter painter(this);
if(m_enter)
painter.drawPixmap(rect(),m_enterlist.at(m_enterIndex));
if(m_leave)
painter.drawPixmap(rect(),m_leavelist.at(m_leaveIndex));
}
在mainwindow.c中调用:
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include "mybtn.h"
MainWindow::MainWindow(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);
mainButton* m_btn=new mainButton(":/clean_Hover.png",":/clean_Leave.png",this);
m_btn->setGeometry(30,30,95,95);
}
MainWindow::~MainWindow()
{
delete ui;
}
然后运行你就可以看到当你悬浮进入的动态效果了,效果就是这两张图的轮流显示
有需要的可以下载:https://download.csdn.net/download/qq_41399894/11255959