当前位置：首页 > news >正文

Qt实现可伸缩的侧边工具栏(鼠标悬浮控制伸缩栏)

news 2025/8/27 1:48:42

Qt实现可伸缩的侧边工具栏

一直在网上找，发现大多的实现方案都是用一个按钮，按下控制侧边栏的伸缩，但是我想要实现鼠标悬浮在侧边栏的时候就伸出，移开就收缩的功能，也没找到好的参考，所以决定自己实现一个，只在C++代码里面就可以实现了，不需要用到qss。

效果演示

代码也是功能演示Demo，用了显眼的颜色来突出功能。实际用的时候需要继续完善加入到项目中。
在这里插入图片描述

实现方法

首先看看我的主界面UI

在这里插入图片描述
可以看到我就是用了一个水平布局，布局里就放置黄色和红色两个QWidget，然后黄色的作为侧边栏（黄色里面的布局不用管他，只是用来布局侧边栏里面的功能键），然后红色的不会去动他。

给黄色的QWidget使用重写悬浮事件来控制伸缩

需要先用到语句给黄色侧边栏开启悬浮事件判断

 ui->widget->setAttribute(Qt::WA_Hover, true);

在主窗口类里需要重写两个事件（待会再写具体实现），分别是

protected:
1. bool eventFilter(QObject* obj, QEvent* event);
2. void resizeEvent(QResizeEvent* event);

然后要给黄色侧边栏加载主窗口的事件，才能用到在主窗口类中重写的事件

ui->widget->installEventFilter(this);

重写事件，在事件中使用QPropertyAnimation来控制伸缩动画

在主窗口类中先声明一个私有变量QPropertyAnimation* propertyAnimation提供给事件调用。再声明一个布尔值bool sideFlag = true来表示当前侧边栏的伸缩状态。

在主窗口构造函数中初始化propertyAnimation：

propertyAnimation = new QPropertyAnimation(ui->widget, "geometry");
propertyAnimation->setEasingCurve(QEasingCurve::InOutQuint);
propertyAnimation->setDuration(200);

重写事件resizeEvent：

void QtApplication::resizeEvent(QResizeEvent* event)
{width = ui->widget->width();				//width和height都是主窗口类的私有变量height = ui->centralWidget->height();propertyAnimation->setStartValue(QRect(-1, 0, 10, height));		//参数代表左，上，右，下坐标propertyAnimation->setEndValue(QRect(-1, 0, width, height));
}

这一步是为了重新设置当前窗口下的伸缩的起点和重点位置坐标。这一步是难点：在布局下的widget的长度和宽度都是经过改变的，不在resize事件下重新获取widget的长度和宽度，只会得到最初始的无布局下的widget的长度和宽度，简单的说不是正确的数据，需要在resizeEvent下或者paintEvent下“在程序运行后”“延后地”获取widget的长度和宽度才是正确的尺寸数据。

重写事件eventFilter：

bool QtApplication::eventFilter(QObject* obj, QEvent* event)
{if (obj == ui->widget){if (event->type() == QEvent::HoverEnter)	//鼠标进入黄色侧边栏中悬浮，正向播动画{propertyAnimation->setDirection(QAbstractAnimation::Forward);propertyAnimation->start();return true;}else if (event->type() == QEvent::HoverLeave) //鼠标离开黄色侧边栏，反向播动画{propertyAnimation->setDirection(QAbstractAnimation::Backward);propertyAnimation->start();return false;}}return QWidget::eventFilter(obj, event);
}