Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Widget crossfade attempts



  • QT 5.9.1 - Working on an application where I need to do a true crossfade between two widgets, ie one fades in at the same time the other is fading out. These are QGraphicsProxyWidgets of a QWebEngineView added to a QGraphicsView within a QGraphicsScene. All of this is within a full screen window with a styled black background.

    I'd initially tried placing both the in scene, setting both to the same coordinates, setting QT::WA_TranslucentBackground on the "top" one, then using a QPropertyAnimation to fade the one "on top" to 0 opacity. That simply ended up with a black background and the "bottom" widget was not visible until you actually removed the "top" from the scene.

    So I thought I'd try a fade out on the top while the bottom fades in, like so:

    QPropertyAnimation* a = new QPropertyAnimation(m_centralWidget, "opacity");
    a->setDuration(3000);
    a->setStartValue(1);
    a->setEndValue(0);
    a->setEasingCurve(QEasingCurve::OutBack);
    
    ag->addAnimation(a);
    
    QPropertyAnimation* a2 = new QPropertyAnimation(m_crossFadeWidget, "opacity");
    a2->setDuration(3000);
    a2->setStartValue(0);
    a2->setEndValue(1);
    a2->setEasingCurve(QEasingCurve::InBack);
    
    ag->addAnimation(a2);
    
    connect(ag, SIGNAL(finished()), this, SLOT(onCrossFadeComplete()));
    ag->start(QAbstractAnimation::DeleteWhenStopped);
    

    This somewhat works, however the "top" widget fades out over the duration, there's a short pause of full black, then the "bottom" fades in from black after the pause. The animations are finished within the 3000ms (signal fires at the correct time), but I'm not seeing m_crossFadeWidget fade in as m_centralWidget fades out.

    Anyone have any idea as to how to either correctly layer widgets in a QGraphicsScene, or why an opacity fade in one widget wouldn't reveal the widget underneath?


Log in to reply