Delicious Transblurency [1]

The ‘focus‘ word has many meanings, ranging from the optical concept of ‘good convergence of light rays generated by an object’ to the cognitive process of directing the attention to a particular target while ignoring other targets.
Now the interesting part: this concept can be used in computers too, especially in user interfaces, to direct the user to relevant information or to help him through a step-by-step process. How to do that? Since every image you see on screen is ‘on focus’ by default, you can easily unfocus unuseful information.

Blurring is the act of altering images so they appear out of focus. My Maestro[2] and other illustriuos people already talked extensively about this topic here on planet KDE. However you don’t improve the world until a technology becomes available to everybody, right?

Then some days ago I read on notmart‘s blog that plasma and kwin supported blurring the background on windows.. so I rebuilt KDE4 svn, restarted it, and… boy.. does it make a difference! Look at Marco’s blog or at this picture I stole from him! All the popups become instantly more readable, even krunner does, and you immediately get the feeling that the plasma panel and all the systray applets really are above your desktop and they look as they were made of some glass/plastic material.

So: why limiting this just to some plasma applets? Well, I think that the usage of this effect must be wise, however I wanted that for my app too…

…’cause I like eye-candy! ;-)

After a quick tour through the beautiful KDE svn I grabbed all the needed source code and loaded Fotowall in creator. Since I already had the structure for the blur-behind on windows in place, adding the KDE4 effect was really easy. Here are some samples of what you can get:

Fotowall using KWin's new Blur effect.

To activate the back blur you need:

  • obviously an application with a transparent background. Qt easily allows to work with transparency on top-level windows.
  • you have to enable the “blur” effect in kwin’s “desktop effects” configuration.
  • a couple of lines of code to ask kwin to activate blurring to your window.

Here is the code that does the magic:

#if defined(Q_WS_X11)
  Blur behind windows (on KDE4.5+)
  Uses a feature done for Plasma 4.5+ for hinting the window manager to draw
  blur behind the window.
#include <X11/Xlib.h>
#include <X11/Xatom.h>
#include <QX11Info>
static bool kde4EnableBlurBehindWindow(WId window, bool enable, const QRegion &region = QRegion())
    Display *dpy = QX11Info::display();
    Atom atom = XInternAtom(dpy, "_KDE_NET_WM_BLUR_BEHIND_REGION", False);

    if (enable) {
        QVector<QRect> rects = region.rects();
        QVector<quint32> data;
        for (int i = 0; i < rects.count(); i++) {
            const QRect r = rects[i];
            data << r.x() << r.y() << r.width() << r.height();

        XChangeProperty(dpy, window, atom, XA_CARDINAL, 32, PropModeReplace,
                        reinterpret_cast<const unsigned char *>(data.constData()), data.size());
    } else {
        XDeleteProperty(dpy, window, atom);

And then you can activate the blur on the caller widget with:

    kde4EnableBlurBehindWindow(winId(), true);

You could add the back blur to your application too, however I advise you that the interface is not standardized, so don’t blame either me or the kwin authors if something changes. Here is another picture, because everybody loves them ;-)

Another back-blurred screen in Fotowall.

And now, as a side note, a picture from my new work place: the beautiful city of San Diego, blessed by the sun and by a ton of great programmers that by some chance happen to be co-workers of me ;-) With all the blue sky and long days, I can’t imagine a more inspiring place for making new blog posts and code experiments!

[1] obviously the name is completely made up ;-)
[2] Italian word meaning “teacher” as in school or life teacher

5 comments on “Delicious Transblurency [1]

  1. “direct the user to relevant information or to help him through a step-by-step process”

    i never thought of this aspect of blurring, but you are damn right!

    Unfortunately, stuff like making windows transparent as in your example (or like the most popular burr effect – the one in vista) does is eye-candy at the cost of usability. It distracts the user from the relevant info instead of helping him to focus.

    We should use the new effect for inactive windows, inactive buttons, or things like plasma popups to make a sensible use of it. As blurred things appear to be further away, we could even blur the wallpaper and plasma when a window is focused or apply different degrees of blurring to windows dependent on their importance.

  2. ciao enrico…

    sai per caso se il plugin blur funzioa anche sotto intel con il nuovo driver mesa 7.8.1?

    nel driver sono presenti sia l estensione framebuffer-object che pixel-buffer object…

  3. Hey, are those in the screenshot new volume and network system tray icons or just an icon pack you’ve installed?

  4. There code in the blog comes directly from libplasma, in fact. So you can also link to libplasma and use:

    Plasma::WindowEffects::enableBlurBehindWindow(WId window, bool enable = true, const QRegion &region = QRegion());

    instead of providing your own implementation. You also get access to other such features as they become available and the code is maintained for you.

    @Kurtins: those are some of the new icons for the system tray icons that will appear in KDE SC 4.5

  5. Most Business Knows How to Use Google ,But Most DO Not Know How their Businesses SHOULD Utilize Google to its Benefit \

Comments are closed.