前言

Qt通过重新封装QPushButton类，实现自定义（异形）按钮，并且实现鼠标点击后的上下跳动特效，
具体效果如下图所示，将QPushButton默认的方形按钮换为“AVIC”异形图标按钮，鼠标点击后先向下跳动20像素，然后再向上跳动20像素。

效果

核心代码

右键工程文件夹Add New，选择新建一个C++ Class，定义Class Name为MyButton，需要Add Q_OBJECT可自动生成mybutton.h及mybutton.cpp。

将MyButton的父类修改为QPushButton，并且重新定义构造函数为
MyButton(QString normalImg, QString pressImg = “”);
第一个参数为正常状态下的图标的地址，第二个参数为按下状态下的图标地址，默认为空

mybutton.h

#ifndef MYBUTTON_H
#define MYBUTTON_H#include <QObject>
#include <QWidget>
#include <QPushButton>
#include <QDebug>
#include <QPropertyAnimation>class MyButton : public QPushButton
{Q_OBJECT
public:explicit MyButton(QString normalImg, QString pressImg = "");//按钮初始状态下的图片地址QString normalImgPath;//按钮按下状态下的图片地址QString pressedImgPath;signals:public slots://按钮向下移动20像素void zoom1();//按钮向上移动20像素void zoom2();};#endif // MYBUTTON_H

mybutton.cpp

#include "mybutton.h"MyButton::MyButton(QString normalImg, QString pressImg)
{normalImgPath = normalImg;pressedImgPath = pressImg;QPixmap pixmap;bool ret = pixmap.load(normalImgPath);if(!ret){qDebug() << normalImg <<"load image failure!";}this->setFixedSize(pixmap.width(),pixmap.height());this->setStyleSheet("QPushButton{border:0px}");this->setIcon(pixmap);this->setIconSize(QSize(pixmap.width(),pixmap.height()));}void MyButton::zoom1()
{//创建动画对象QPropertyAnimation *animation = new QPropertyAnimation(this, "geometry");//设置时间间隔animation->setDuration(200);//创建开始位置animation->setStartValue(QRect(this->x(),this->y(),this->width(),this->height()));//创建结束位置animation->setEndValue(QRect(this->x(),this->y()+30,this->width(),this->height()));//设置缓和曲线，QEasingCurve::OutBounce为弹跳结果animation->setEasingCurve(QEasingCurve::OutBounce);//开始执行动画animation->start();
}void MyButton::zoom2()
{QPropertyAnimation *animation = new QPropertyAnimation(this, "geometry");animation->setDuration(200);animation->setStartValue(QRect(this->x(),this->y()+30,this->width(),this->height()));animation->setEndValue(QRect(this->x(),this->y(),this->width(),this->height()));animation->setEasingCurve(QEasingCurve::OutBounce);animation->start();}

widget.h

#ifndef WIDGET_H
#define WIDGET_H#include <QWidget>
#include "mybutton.h"QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACEclass Widget : public QWidget
{Q_OBJECTpublic:Widget(QWidget *parent = nullptr);~Widget();private:Ui::Widget *ui;MyButton *startBtn;
};
#endif // WIDGET_H

widget.cpp

startBtn = new MyButton(“:/3.png”);
在Widget构造函数里新创建一个MyButton类，传入按钮初始状态下的图片地址，本案例下按钮没有按下状态
connect(startBtn,&MyButton::clicked,={ startBtn->zoom1(); startBtn->zoom2();
将按钮的点击信号与实现按钮的向下20像素、向上20像素响应动作进行绑定

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);startBtn = new MyButton(":/3.png");startBtn->setParent(this);startBtn->move(this->width()*0.5-startBtn->width()*0.5,this->height()*0.6);connect(startBtn,&MyButton::clicked,[=](){startBtn->zoom1();startBtn->zoom2();});
}Widget::~Widget()
{delete ui;
}

Qt 自定义（异形）形状按钮封装及实现点击弹跳效果相关推荐

qt自定义含有拖动功能的窗口在点击窗口的下拉列表时窗口移动
提要自定义的弹出窗口,窗口可以实现按下鼠标拖动,鼠标释放停止拖动,窗口种含有子控件,下拉列表,在点击下拉列表时窗口移动. 解决方法因为点击下拉列表的时候,触发了窗口的移动事件,所以添加下拉列表的事 ...
java 自定义形状按钮_制作自定义背景Button按钮、自定义形状Button的全攻略
在Android开发应用中,默认的Button是由系统渲染和管理大小的.而我们看到的成功的移动应用,都是有着酷炫的外观和使用体验的.因此,我们在开发产品的时候,需要对默认按钮进行美化.在本篇里,笔者结 ...
qt自定义按钮类，每个按钮自带一个右键弹出框，如何使同一时刻只显示一个弹出框
提要继承于QPushButton的自定义按钮类,其右键弹出一个弹框,创建多个这样的自定义按钮在窗口中,每一时刻只显示一个右键弹出框,避免同一时刻,多个按钮右键弹出弹出框后,未及时关闭弹出框导致的同一 ...
uni-app转小程序遇到的问题（组件使用插槽的问题）（跨端兼容、条件编译）（小程序自定义胶囊按钮封装）(uni-app挂载原型链)
1.uni-app转小程序组件使用插槽的问题 uni-app封装的组件使用问题 1.插槽样式:H5页面编译是有效果的,在小程序中编译的位置错误,它会跳出本来的插槽位置到最后. !!!解决方法: 使用父 ...
qt Dialog自定义右上角的按钮
需求场景: 使用 qt Dialog窗口进行预览文本内容时,发现窗口的右上角只有帮助.关闭按钮,又不想每次通过鼠标改动窗口的大小查看更多的内容. 思路: 修改 Dialog 右上角的按钮为最大 ...
QT自定义精美换肤界面
QT自定义精美换肤界面陆陆续续用QT开发过很多项目,也用QT写过不少私活项目,也写过N个工具,一直梦寐以求能像VC一样可以很方便的有个自定义的界面,QSS的强大让我看到了很好的希望,辗转百度谷歌无数 ...
Qt 自定义信号与槽
注对象与槽理解 //第一个参数lineEdit是激发事件对象,信号中的方法必须在对象中存在,并在对象类头文件signals下定义,//第二个参数信号,//第三个参数this是槽方法所属类的对象,且必 ...
Qt 自定义标题栏，最小化、最大化、关闭窗口，双击最大化，鼠标拖动等效果实现
文章目录前言效果代码 .pro文件 widget.h widget.cpp widget.ui title.h title.cpp title.ui 前言本次实验内容为Qt自定义标题栏,最小化 ...
QT 自定义加载等待(Loading)提示框
QT自定义加载等待提示框一.效果展示二.源代码 #ifndef LOADINGDIALOG_H #define LOADINGDIALOG_H #include <QMovie> #i ...

Qt 自定义（异形）形状按钮封装及实现点击弹跳效果

文章目录

前言

效果