网页右下角上经常会出现一些提示性的信息,桌面软件中也比较常见,类似360新闻、QQ消息提示一样!
这种功能用动画实现起来很简单,这节我们暂时使用定时器来实现,后面章节会对动画框架进行详细讲解。
下面我们来实现一个右下角冒泡的功能。
实现原理
1.显示
定时器启动,右下角缓慢弹出,逐渐改变位置
2.驻留
让界面停留一定的时间,时间过后自动关闭。
3.退出
可以直接点击关闭退出,也可以采用改变透明度的形式模糊退出。
作为新手,我的代码也是在网上炒得,个人做了些注释,用到二三个定时器,我把自己在理解过程中认为重要的都一一做了注释,
放进来的代码都是编辑过的,main.cpp文件不用改,就没有放进来。代码直接拷贝就可以,亲测有效,只是没有放视频,你们自己试试吧,不想复制的,源代码在最下面下载。。。。。
效果:
点击按钮,整个窗口会从右下角上升,直到整个窗口显示出来
widget.ui
widget.h 文件
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
#include <QTimer>
#include <QDialog>
namespace Ui {
class Widget;
}
class Widget : public QWidget
{
Q_OBJECT
public:
explicit Widget(QWidget *parent = nullptr);
~Widget();
void showMessage(const char* str);
private slots:
void onMove();
void onStay();
void onClose();
private:
Ui::Widget *ui;
QTimer * m_pShowTimer;
QTimer * m_pStayTimer;
QTimer * m_pCloseTimer;
QPoint m_point;
int m_nDesktopHeight;
double m_dTransparent;
};
#endif // WIDGET_H
widget.cpp 文件
#include "widget.h"
#include "ui_widget.h"
#include <QPushButton>
#include <QtWidgets/QApplication>
#include <QDesktopWidget>
#include <QRect> //QRect类使用整数精度在平面中定义一个矩形。
#include <QDebug>
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
setWindowFlags(Qt::FramelessWindowHint|Qt::WindowStaysOnTopHint);
m_nDesktopHeight = QApplication::desktop()->height(); //获取桌面高度
qDebug() << "m_nDesktopHeight============" << m_nDesktopHeight;
m_dTransparent = 1.0; //透明度开始设置为1
m_pShowTimer = new QTimer(this);
m_pStayTimer = new QTimer(this);
m_pCloseTimer = new QTimer(this);
connect(ui->pushButton, &QPushButton::clicked, this, [=]
{
showMessage("username");
});
connect(m_pShowTimer, SIGNAL(timeout()), this, SLOT(onMove()));
connect(m_pStayTimer, SIGNAL(timeout()), this, SLOT(onStay()));
connect(m_pCloseTimer, SIGNAL(timeout()), this, SLOT(onClose()));
}
Widget::~Widget()
{
delete ui;
}
void Widget::showMessage(const char* str)
{
ui->m_label->setStyleSheet("background-color:rgb(255,210,200);font:60px;color:blue");
ui->m_label->setText(str);
QRect rect = QApplication::desktop()->availableGeometry(); //获取屏幕大小
m_point.setX(rect.width() - this->width());
m_point.setY(rect.height() - this->height());
qDebug() << "this->width()=" << this->width();
qDebug() << "this->height()=" << this->height();
qDebug() << "x=" << m_point.x();
qDebug() << "y=" << m_point.y();
this->move(m_point.x(), m_point.y()); //移动到右下角
m_pShowTimer->start(5);
}
//m_pShowTimer 定时5ms之后,窗口开始上升
void Widget::onMove()
{
m_nDesktopHeight--; //桌面高度减一,窗口作标就会增高
qDebug() << "m_nDesktopHeight=" << m_nDesktopHeight;
this->move(m_point.x(), m_nDesktopHeight);
if (m_nDesktopHeight <= m_point.y()) //逐渐上升,直到窗口完全显示出来
{
m_pShowTimer->stop();
m_pStayTimer->start(5000); //设置停留时间
}
}
//停留时间到了之后,设置逐渐透明消失定时器
void Widget::onStay()
{
m_pStayTimer->stop();
m_pCloseTimer->start(100);
}
//窗口逐渐透明,直到消失
void Widget::onClose()
{
m_dTransparent -= 0.1; //透明度减0.1
if (m_dTransparent <= 0.0) //直到全部透明,也就是窗口消失
{
m_pCloseTimer->stop();
this->close(); //窗口消失之后,并未释放,所以需要关闭窗口
}
else
{
this->setWindowOpacity(m_dTransparent); //设置不透明度
}
}
体谅一下哈,代码在公众号下载
喜欢的可以扫码关注公众号----嵌入式简单说
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200324173724402.jpg)