Oxygen + Gtk

For the past few month, Ruslan Kabatsayev, Cédric Bellegarde and I have been working on writing (yet another) Gtk port of KDE's oxygen widget style.

Unlike previous attempts we decided to

• start a new gtk-engine from scratch (as opposed to re-using an existing one). All painting is performed using Cairo; there is no hidden interfacing to Qt, nor hard-coded pixmaps.

• stick as close as possible to KDE's and oxygen's options. Amongst other things, the engine loads kde palette, icons, and fonts; it respects the color contrast setting, and a number of oxygen's display options (such as the tab style, the list's expander style, the scrollbar width, etc.)
• try implement at least some of the fancy features of KDE's Oxygen style. Amongst other things, we added mouse-over effects on almost all widgets; support for ARGB colormap (in order to have nice non-pixelated corners for menus, combo boxes or tooltips), and full support for grabbing windows from empty areas (a feature that is in KDE's Oxygen since KDE SC 4.5). We also have plans for adding a large number of the animations found in KDE's Oxygen style, but that will be for the next release.
  

The primary goal of this port is to improve significantly the integration of Gtk/Gnome applications in KDE. However, we also aim to provide Oxygen as a modern, professional and polished theme for other desktop environments, that works seamlessly without having KDE even installed.

Some screenshots are available at the end of this post.

The sources for this first release are available on KDE ftp servers. We plan to follow the same release plan as KDE:

• one minor bug-fixing release every month,
• one major feature release every 6 month

Daring users can also get the latest sources from the git repository directly. We are hosted by git.kde.org.

Bug reports and feature requests can be sent to KDE bug tracking system. When doing so one should select product=Oxygen, and component=gtk-engine.

One can also talk to the developers and give direct feedback on IRC, channel #oxygen (ask for hugo).

Now for the screenshots:

Nautilus (front) and Dolphin (back)

GEdit (front) and Kate (back)

Compiz Config Settings Manager (CCSM)

Mandriva's RPM manager (urpmi)

Firefox (unthemed)

Performance issues, one script, and call for testers

Since kde4.5 is out, a number of users with various NVidia graphic cards suffer from performance issues when using the oxygen style:

• Lag, when scrolling some large views, like, e.g. in Dolphin
• system becoming unresponsive over time
  
• etc.

It is hard for me to anticipate such issues, as well as to fix them, since I have an integrated Intel graphic card, and none of these are present (believe me, my oxygen is snappy, I would not commit the changes otherwise). The curl pit appears to be the number of pixmaps that oxygen allocates, and stores in caches, to perform its animations. The fuller the caches would become the more unresponsive the system would be. I'm not 100% sure about it, but so it seems.

So I've been trying to optimize the code, and reduce the number of allocated pixmaps. Its a bit like shooting in the dark, since I can't see much difference here, from one change to the other.

Last night I made a decisive step in this direction by applying some discretization to the various animations, effectively reducing the number of cached pixmaps by a factor 10 to 20 (it's configurable), normally without any noticeable difference to the eye.

Now, well, I need testers (with an NVidia graphic card, and with a driver for which some of the problems above are present).

For users willing to help, I wrote a script available here that allows one to checkout, configure, compile, and install oxygen sources from kde svn trunk, without the need for compiling anything else of kde.

It should work against any kde4.4 and kde4.5 version, as well as trunk, naturally.

To use the script one must:

• create a clean directory
• run the script and follow instructions

One needs to have the necessary development packages installed for the sources to compile. They are: gcc-c++, subversion, cmake, kdebase-workspace-devel, libxrender-devel, libx11-devel (note that the names might change from one linux distribution to the other).

Once the code is successfully compiled and installed, any newly launched application should use the latest oxygen as opposed to the one provided by your distribution (which gets erased in the process).

I'll be available for debugging, in case of trouble.

If the patches I committed to trunk recently are effectively fixing the issues above, I'll backport them to the kde4.5 branch (and to oxygen-transparent), so that hopefully kde4.5.2 can benefit from it.

Notes:

• kde anonymous svn is sometimes not very responsive and the checkout or update will fail. Just take a deep breath, wait 5 minutes, and retry.
  
• in case one wants to revert to the 4.5 version of oxygen, one can run the same script (in a separate directory), with the additional argument --branch 4.5

Edit:

• Since the feedback on the recent commits is largely positive, last night I backported the changes to the kde4.5 branch. So that hopefully this oxygen+nvidia issue will all be fixed in kde4.5.2. You can run oxygen-setup.pl --branch 4.5 to get this code, instead of the one from trunk (which has many other unrelated changes).
• I also backported the change to oxygen-transparent
  

Oxygen rewrite and Dragging tabs around

This is a technical post, with a small video for entertainment.

Today, a major change to the oxygen code was committed to SVN, so that the style now derives from QCommonStyle as opposed to KStyle in the past. This is the first (and most difficult) step towards writing a fork of the oxygen widget style that would depend on Qt only, and not on KDE, so that one could, for instance, use oxygen natively on Windows (TM) for all Qt applications. Additionally, this change also results in better performances in painting widgets, and a more maintainable code.

This effectively constitutes a quasi-complete rewrite of the oxygen core code, as illustrated by the number of lines removed and added, from the svn commit log:

M +6227 -5224 oxygenstyle.cpp
M +886 -310 oxygenstyle.h

Hopefully no functionality have been lost and no regression introduced, although to be honest, further testing is needed, and more pairs of eyes than just mine (hence the commit).

While rewriting, some of the remaining oxygen visual bugs that I know of have been fixed, concerning notably how tabs are displayed when the active tab is being dragged around. (Tab widgets are by far the most difficult Qt widgets to render properly in the style). The result is illustrated in the following screencast.



Notes:

• the animation itself is provided by Qt, not by oxygen;
• it was already supported in kde4.4 and kde4.5. Unfortunately it had some visual glitches that are now fixed;
• the application used for the demonstration is oxygen-demo, from kde svn trunk (it has been modified since kde4.5 to handle movable tabs). It is available from the command line since KDE4.5.0, serves as a showcase on how widgets are rendered with oxygen (or any other style), and as a visual debugging tool for me;
• the same feature is available in e.g. Dolphin, and kmail;
• unfortunately (in my opinion), other applications such as konqueror and konsole, use their own private mechanism to drag tabs around. I wish they would rely on Qt only instead, for consistency across applications, and since it is a 'one line of code', literally, namely:

tabBar->setMovable( true );

some oxygen screenshots in kde SC 4.5

KDE SC 4.5 (release candidate) is out, so I figured I could post some screenshots of how oxygen looks like in this release. We payed a lot of attention to detail polishing, fixing 1 pixel here and there at a time, to

• improve alignment between widgets
• make borders sharper, visible notably in menus, comboboxes, MDI windows (although they are largerly unused)
• fix glitches where widgets would interact one with another (notably in tabbed view)

So, not much innovation graphics wise in kde4.5 with respect to kde4.4, but the former should just feel better than the latter, without one being able to pinpoint what it really comes from (the devil is in the details).

Note that we did change the buttons a bit (based on the huge feedback from the previous post), in a subtle way that will for sure not make everyone happy (this you can never achieve), but hopefully won't displease people who liked them already, and will satisfy some of the people who complained.

As discussed in other posts there are new features though:

• more widget animations
• more configuration options, using oxygen-settings (give a try to follow-mouse animations for menus, menubars and toolbars, for instance)
• the ability to move windows by clicking in empty areas

Now the screenshots:

kcalc and desktop settings

Dolphin and Amarok

Konsole and Kate

What we have in mind for kde4.6 (in arbitrary order of preference, and without any guaranty of having any of these actually implemented):

• support for consistent transparency (+blur) in the style and the decoration
• support for sideways decoration title
• having a Qt-only oxygen style (because I wish my Qt apps running on windows could use oxygen without having to install the entire kde suite)
• on the tech-side: optimization of pixmaps caching in the style (because it seems to cause problems to some users)
• and of course (with highest priority): bug fixing and optimization

What's wrong with oxygen buttons ?

Since there are recurring complains about how oxygen buttons look like, and requests to make them more beautiful, whereas, on the other hand, both Pinheiro and I are quite happy with them (we are, really), I'd like to gather some more details about what's really wrong with them.

Picture on the top-left shows basically all the buttons that oxygen can draw. I'd like to know what's not right with them. Margins? Shadows? Gradients? The way they look when pressed?

Things like: "they're ugly", and without any constructive idea to counterbalance the statement will be ignored. Also, things like "they should look like plastique" (or any other theme) will not help much either (since this is precisely the point of oxygen, not to look like plastique).

Other than that, if anyone has comments on these, or even better: mockups, feel free.

Moving windows around

A new feature added to Oxygen for KDE SC 4.5 is the possibility to move windows around by clicking (with left mouse button) in any of its 'empty' area and dragging it around, in a way that is similar to what one usually does with the window decoration titlebar.

How this works is illustrated in the following screencast (sorry for the poor quality of the video):



This feature has been present in bespin (another kde4 widget style) for quite a while. It has been ported (and largely rewritten) to Oxygen, on popular demand.

It is believed to be very useful, notably on touch-screens, for which dragging windows from the sometimes tiny decoration titlebar might end up being problematic.

Now, this is still quite experimental and conflicts might exist between dragging the window and some other mouse actions for some applications. I hope we can identify, and fix, most of these conflicts in KDE SC 4.5 beta cycle, so that a well crafter and fully functional feature can be delivered to users with the first release candidate.

oxygen-settings

Since KDE SC 4.4 many hidden options have been added to oxygen to 'fine-tune' the appearance of widgets and window decorations. At the time, they have been made hidden, in order not to scare normal users by facing them with a large number of choices with most of which they would have no idea what to do.

As a drawback, there was a number of bug reports and wishes from advanced users asking for features and configure options which in fact were already there, but not easily accessible. The answer to such reports have been: "edit your configuration file (usually $HOME/.kde4/share/config/oxygenrc), and add this or that line, in this or that section". Not very satisfactory.

For KDE SC 4.5, a new application has been added to remedy the above. It is called oxygen-settings (it runs from either krunner or one's favorite terminal), and provides access to all the previously hidden options. The other advantage of oxygen-settings is that all options for both the widget style and window decoration are regrouped at the same place, fewer clicks away one from the other.

Hopefully this addition will make advanced users happy, without scaring normal users, who would not care about all the functionalities offered here.

Below are a few screenshots of this application.

The first page, corresponding to widgets' style configuration:



The animations page:



It allows to customize each animation used in the widget style independently from the other.

The window decoration page:



It is very similar to what's available in KDE's configuration tool (systemsettings) but includes a number of additional, otherwise hidden, options

After about a year coding for KDE's Oxygen widget style and window decoration, and because KDE SC 4.5 is around the corner (first two beta versions are already out), I finally decided to start a blog to:

• advertise new features
• gather comments
• get feedback

This is not about oxygen icons (icons are Nuno's realm), this is about how widgets and window decorations look like, how they animate, and how to make it all look better.