Backlit effect

Qt has always the power to render sleek graphic effects. This blog post describes a simple trick to render back light effect for any windows and graphic items. In short, back light effect shows ambient lighting effect behind any graphic element irrespective of its shape and size.

Back light behind a standard dialog

The trick is pretty simple. We use a QGraphicsEllipseItem for the back light. This ellipse takes the rect of the the dialog/window/graphics item which stays on top. To render the effect we use a QGraphicsBlurEffect on ellipse and add it to scene. Note that we have to place it behind the dialog in z order.

    QGraphicsEllipseItem backLight;
    ....
    backLight.setZValue(proxyDlg->zValue()-1);
    backLight.setBrush(QBrush(QColor(Qt::green)));
    backLight.setPen(QPen(Qt::NoPen));
    QGraphicsBlurEffect blurEffect;
    blurEffect.setBlurRadius(30);
    backLight.setGraphicsEffect(&blurEffect);

Find the complete source at http://decii.googlecode.com/svn/trunk/backlight/

Opps! did I mention it needs Qt 4.6 or newer to build. Never make the dialogs boring anymore!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s