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

QGraphicsEffect控件添加特效

news 2025/10/29 17:48:14

一、QGraphicsEffect基本概念

二、常见子类应用

2.1 QGraphicsDropShadowEffect

2.2 QGraphicsBlurEffect

2.3 QGraphicsColorizeEffect

2.4 QGraphicsOpacityEffect

一、QGraphicsEffect基本概念

QGraphicsEffect 是 Qt 中用于为控件添加图形视觉效果的基类，例如模糊、阴影、色调调整和透明度变化等。它不改变控件本身的几何结构，而是在绘制阶段对控件的像素内容进行后期处理，从而实现美观且性能较高的视觉特效。

二、常见子类应用

2.1 QGraphicsDropShadowEffect

添加阴影效果，常用于按钮、弹窗提升层次感。

{
   QGraphicsDropShadowEffect *shadow = new QGraphicsDropShadowEffect;
   shadow->setBlurRadius(8);//设置阴影的模糊半径阴影边缘将有 8 像素的模糊扩散范围数值越大越虚越小约贴近边缘
   shadow->setColor(QColor(0, 0, 0, 100));//黑色作为阴影透明度（Alpha）= 100（范围 0~255）半透明黑色可以避免阴影显得过于生硬，使整体视觉更自然
   shadow->setOffset(2, 2);//设置阴影相对于原始控件的偏移量。
   /*第一个参数 2：水平方向向右偏移 2 像素；第二个参数 2：垂直方向向下偏移 2 像素；
   模拟“光源来自左上方”的自然光照效果，这也是大多数 UI 风格所采用的标准投影方向。
   若设置为(0, 0)，则阴影居中于控件下方，看起来像“浮空”但无方向感。*/
   ui.pushButton->setGraphicsEffect(shadow);
}

2.2 QGraphicsBlurEffect

实现高斯模糊，可用于背景虚化、对话框蒙层。
{
   // 对组件内容应用模糊（模拟模态背景）
   QGraphicsBlurEffect *blurEffect = new QGraphicsBlurEffect;
   blurEffect->setBlurRadius(8);
   ui.mainwindow->setGraphicsEffect(blurEffect);
   //...授权验证


   if(authority)
   { // 3秒后关闭模糊效果（模拟加载完成）
       QTimer::singleShot(3000, [&]() {
           ui.mainwindow.setGraphicsEffect(nullptr); // 恢复清晰
       });
   }
}

2.3 QGraphicsColorizeEffect

为控件整体着色，适用于主题切换或状态提示。

{

   QGraphicsColorizeEffect *colorize = new QGraphicsColorizeEffect;
   colorize->setColor(Qt::red);
   colorize->setStrength(0.6);//设置颜色叠加效果的强度0-1
   ui.label_9->setGraphicsEffect(colorize);

   static bool isBright = true;
   QTimer *timer = new QTimer(this);
   QObject::connect(timer, &QTimer::timeout, [=]() {
       if (ui.label_9)
       {
           QGraphicsEffect* effect = ui.label_9->graphicsEffect();
           if (effect && dynamic_cast<QGraphicsColorizeEffect*>(effect) == colorize) {
               colorize->setStrength(isBright ? 0.8 : 0.3);
               isBright = !isBright;
           }
           else {
               // 如果 label 或 effect 不存在了，停止定时器防止继续崩溃
               timer->stop();
           }
       }});
   timer->start(500);
}

        结合属性动画QPropertyAnimation实现呼吸灯效果提示QPropertyAnimation 用它来平滑地改变一个对象的某个属性值，在指定的时间内从起始值过渡到结束值，从而产生流畅的动画效果。
        与直接使用 QTimer 定时修改属性不同，QPropertyAnimation 不仅自动完成“插值计算”，还支持缓动曲线（Easing Curves），使动画具有缓入、缓出、弹跳等自然视觉效果，让界面更生动。
{
   // 创建颜色高亮效果
   QGraphicsColorizeEffect *colorize = new QGraphicsColorizeEffect;
   colorize->setColor(Qt::red); // 设置为红色
   colorize->setStrength(0.6); // 初始强度
   ui.label_9->setGraphicsEffect(colorize); // 应用到 label

   // 创建属性动画：在 strength 属性上做动画
   QPropertyAnimation *anim = new QPropertyAnimation(colorize, "strength");
   anim->setStartValue(0.3); // 弱红
   anim->setEndValue(0.8); // 强红
   anim->setDuration(600); // 动画时长（毫秒），控制呼吸频率
   anim->setLoopCount(-1); // 无限循环
   //anim->setEasingCurve(QEasingCurve::InOutSine); // 平滑呼吸感（比 SineCurve 更自然）
   anim->setEasingCurve(QEasingCurve::SineCurve);

   anim->start(QAbstractAnimation::DeleteWhenStopped); // 自动释放内存
}

2.4 QGraphicsOpacityEffect

控制控件的透明度，支持渐显/渐隐动画。
QGraphicsOpacityEffect 透明效果实现控件的透明度，结合属性动画QPropertyAnimation实现控件淡入淡出等效果
{
   ui.label_9->setGraphicsEffect(new QGraphicsOpacityEffect);

   QGraphicsOpacityEffect *effect = qobject_cast<QGraphicsOpacityEffect*>(ui.label_9->graphicsEffect());
   QPropertyAnimation *anim = new QPropertyAnimation(effect, "opacity");
   anim->setDuration(10000); // 动画持续1秒
   anim->setStartValue(0.0); // 起始完全透明
   anim->setEndValue(1.0); // 结束完全显示
   anim->setEasingCurve(QEasingCurve::OutQuad);

   anim->start(QAbstractAnimation::DeleteWhenStopped);
   ui.label_9->show();
}