Sunday, 30 July 2006

RGBA Windows

Today we had a sort of mini-hackfest at the office. Earlier in the week Larry Ewing had shown how to use Xgl+compiz's support for RGBA windows to implement window translucency in F-Spot in a very nice way, so I thought I'd extend Mozilla's translucent window support to use this mechanism. Up till now, on X we've only used the Shape extension, which only provides 1-bit transparency.

In a cairo build, it is almost no effort to implement. Basically you just need to call gdk_screen_get_rgba_colormap and make that the colormap for the toplevel GTK widget. A general patch for Mozilla will be a little more complicated because we need to set the colormap before "realizing" the widget, at which point we don't actually know whether the window will need translucency or not. I'm not quite sure what to do about this, but it might be OK to just always use RGBA windows all the time when Xgl and compiz are active (which we can detect).

Obligatory eye candy follows. The example is a standalone HTML document with a transparent background, containing HTML form widgets, script, and SVG.


  1. That's pretty crazy. Does anyone actually find transparent/translucent windows usable?

  2. It might be nice to provide this for XULRunner and Firefox extensions, but I would never want to allow any random old webpage to do this.

  3. Robert O'Callahan1 August 2006 at 11:59

    HeroreV: That goes without saying.
    db48x: This example is a bit over the top, but I have seen examples that make sense. For example F-Spot has a magnification lens window that floats over your photo and is an odd shape, part of which is a translucent overlay over the photo. It's hard to describe but I can't find a screenshot. Also people apparently like to use this stuff for OSX Dashboard widgets and the like, for shadow effects etc.

  4. Well, I suppose there are possibly some uses then. I guess whenever I hear the words "translucent windows" I think of unreadable term windows with the background showing through.

  5. groovy ... could u please post some sample code ?
    I just read that translucent window support made it into "Bon Echo 2" but i can't find any code on how to use/set it (newbie here ^_^).

  6. Robert O'Callahan7 August 2006 at 07:29

    Jens: on Windows this has worked for a while, with some limitations. Things should get better in Gecko 1.9. Nothing really changed in FF2 in this area.

  7. Hi,
    I'm trying to achieve something similar with mozilla and GTK2. How did you manage to get the window translucent exactly? Any pointers or diffs to original code would be greatly appreciated. Thanks.

  8. Robert O'Callahan23 November 2007 at 22:01

    PV: you set up an RGBA visual for the window in nsWindow.cpp and make sure you create COLOR_ALPHA surface when you do cairo_push_group to double-buffer Mozilla's painting.

  9. Hmm..
    You were using thebes gfx? In this version that I'm hacking gtk gfx is used, i.e. no cairo_push_group used. And mozilla is used via libgtkmozembed...

  10. Robert O'Callahan24 November 2007 at 22:23

    PV: Yeah I was doing it on trunk with cairo. cairo understands alpha translucency, gdk's drawing API doesn't.