Qt平滑弹出页面

目标功能:

(1)按下btn,弹出绿色页面。

(2)按下btn2,绿色页面隐藏。

(3)按下左边余下的区域,绿色页面也隐藏。

(4)平滑地显示和隐藏

效果:

form.h

cpp 复制代码
#ifndef FORM_H
#define FORM_H

#include <QWidget>

namespace Ui {
class Form;
}

class Form : public QWidget
{
    Q_OBJECT

public:
    explicit Form(QWidget *parent = nullptr);
    ~Form();

private slots:
    void on_pushButton_clicked();

private:
    Ui::Form *ui;
signals:
    void begin_move();
};

#endif // FORM_H

form.cpp

cpp 复制代码
#include "form.h"
#include "ui_form.h"

Form::Form(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Form)
{
    ui->setupUi(this);
}

Form::~Form()
{
    delete ui;
}

void Form::on_pushButton_clicked()
{
    emit begin_move();
}

widget.h

cpp 复制代码
#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include "form.h"
#include <QPropertyAnimation>
#include <QMouseEvent>
QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
protected:
    void mousePressEvent(QMouseEvent *event) override;
    bool eventFilter(QObject *obj,QEvent *event) override;
private slots:
    void on_pushButton_clicked();
private:
    Ui::Widget *ui;
    Form *f;
    QPropertyAnimation *animation,*animation1;
    bool flag;
    bool isShow;
};
#endif // WIDGET_H

widget.cpp

cpp 复制代码
#include "widget.h"
#include "ui_widget.h"
#include <QDebug>
#include <QEvent>

#pragma execution_character_set("utf-8")
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    f=new Form(this);
    f->hide();
    flag=1;
    isShow=0;
    ui->pushButton_2->installEventFilter(this);
    connect(f,&Form::begin_move,this,[=](){
        if(isShow == 1){
            animation1->start();
            isShow=0;
        }
    });
}

Widget::~Widget()
{
    delete ui;
}

void Widget::mousePressEvent(QMouseEvent *event)
{
    if(event->button()==Qt::LeftButton){
        qDebug()<<"按下了鼠标左键";
        qDebug()<<event->pos();
        if(isShow == 1){
            animation1->start();
            isShow=0;
        }
    }
}

bool Widget::eventFilter(QObject *obj, QEvent *event)
{
    if(obj==ui->pushButton_2){
        if(event->type() == QEvent::MouseButtonPress){
            qDebug()<<"按下按钮";
            QMouseEvent * me =static_cast<QMouseEvent *>(event);
            if(me->button() & Qt::LeftButton){
                qDebug()<<"按下左键";
                if(isShow == 1){
                    animation1->start();
                    isShow=0;
                }
            }
            return false;
        }
    }
    return QWidget::eventFilter(obj,event);
}

void Widget::on_pushButton_clicked()
{
    if(flag==1){
        flag=0;
        f->resize(300,height());
        f->move(width(),0);
        f->show();

        animation = new QPropertyAnimation(f,"pos");
        animation->setDuration(1000);  //设置动画完成的时间长度
        animation->setStartValue(QPoint(width(),0)); //设置动画的开始值
        animation->setEndValue(QPoint(width()-f->width(),0)); //设置动画的结束值

        animation1 = new QPropertyAnimation(f,"pos");
        animation1->setDuration(1000);  //设置动画完成的时间长度
        animation1->setStartValue(QPoint(width()-f->width(),0)); //设置动画的开始值
        animation1->setEndValue(QPoint(width(),0)); //设置动画的结束值
    }
    animation->start(); //启动动画
    isShow=1;
}
相关推荐
hqxstudying21 小时前
Java行为型模式---命令模式
java·开发语言·后端·eclipse·命令模式
ttod_qzstudio21 小时前
基于typescript严格模式以实现undo和redo功能为目标的命令模式代码参考
typescript·命令模式
vvilkim1 天前
深入理解设计模式:命令模式详解
设计模式·命令模式
DKPT5 天前
Java设计模式之行为型模式(命令模式)
java·笔记·学习·设计模式·命令模式
秋田君8 天前
深入理解JavaScript设计模式之命令模式
javascript·设计模式·命令模式
花好月圆春祺夏安8 天前
基于odoo17的设计模式详解---命令模式
设计模式·命令模式
前端开发与ui设计的老司机15 天前
数字孪生技术为UI前端注入灵魂:实现产品全生命周期的可视化管理
前端·ui·命令模式
勤奋的知更鸟25 天前
Java 编程之命令模式
java·开发语言·设计模式·命令模式
charlie11451419125 天前
从C++编程入手设计模式——命令模式
c++·设计模式·命令模式
范纹杉想快点毕业1 个月前
Qt构造函数详解:布局与快捷键实战
c语言·开发语言·数据库·c++·qt·命令模式