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;
}
相关推荐
sg_knight2 天前
设计模式实战:命令模式(Command)
python·设计模式·命令模式
yaaakaaang2 天前
十四、命令模式
java·命令模式
无籽西瓜a2 天前
【西瓜带你学设计模式 | 第十八期 - 命令模式】命令模式 —— 请求封装与撤销实现、优缺点与适用场景
java·后端·设计模式·软件工程·命令模式
23.11 天前
【Linux】grep -F 及 双横线--的妙用
linux·命令模式
摸鱼仙人~13 天前
快照模式 vs 命令模式:一篇分清什么时候用谁
命令模式
2301_7644413313 天前
Dify工作流中实现查询优化(QO):将查询复杂度分类法与QOL框架融入工作流
人工智能·语言模型·自然语言处理·命令模式
fe7tQnVan13 天前
三大 Agent-UI 协议深度剖析:AG-UI、A2UI 与 MCP-UI 的设计哲学与工程实践
ui·状态模式·命令模式
程序员小寒15 天前
JavaScript设计模式(八):命令模式实现与应用
前端·javascript·设计模式·ecmascript·命令模式
砍光二叉树18 天前
【设计模式】行为型-命令模式
设计模式·命令模式
心前阳光21 天前
UI在指定区域内拖拽
ui·命令模式