Important: Please read the Qt Code of Conduct -

[SOLVED] Widget Fade In Effect Possible?

  • Is it possible to have a widget fade-in effect? I'm using Qt 5.5 Open Source.

    Currently I'm doing inline dialogs in my application. So, instead of showing a separate window (complete with titlebar, etc.), I'm showing a promoted widget. So, I dim the background using an opaque QFrame control, and then inside that show a QStackedWidget control where I have each of my dialogs like "Are you sure?" and "Register Product" and "Help & Support Info".

    To make this even snazzier, I want to know if I can fade in the widget and its contents somehow. Is there an easy way to do that, such as a stylesheet transition?

  • Lifetime Qt Champion

    well if you are on windows, you could use the windowOpacity
    see here for some code

    He uses QPropertyAnimation to animate the property.

  • @mrjj I found that your technique works on a Mac as well. (I'm running El Captain version of OSX.)

    QPropertyAnimation *a = new QPropertyAnimation(this,"windowOpacity");
    a->setDuration( 150 );
    a->setStartValue( 0.0 );
    a->setEndValue( 1.0 );

    That works great on a window. If I want to do it on a widget, one technique I found was to just change it's geometry properties like so:

    // w is my widget
    QRect r = QRect();
    QRect r2 = r;
    r2.setX(w->x() + (w->width() / 2));
    r2.setY(w->y() + (w->height() / 2));
    QPropertyAnimation *a = new QPropertyAnimation(w,"geometry");
    a->setDuration( 150 );
    a->setStartValue( r2 );
    a->setEndValue( r );

    Then, reverse this animation on hiding the widget.

  • Alternative approach, use QGraphicsOpacityEffect and animate opacity of QGraphicsOpacityEffect.

  • @LuGRU Very cool! I finally was able to pull this off with my promoted widget, whereas other techniques didn't work unless I switched the effect to width/height animation.

    // w is my widget
    QGraphicsOpacityEffect *eff = new QGraphicsOpacityEffect(this);
    QPropertyAnimation *a = new QPropertyAnimation(eff,"opacity");