The ribbon component is one the major building blocks of the Flamingo component suite. It is designed to work well with the existing core and third-party look-and-feels, adopting the appearance of the current skin / theme. It also provides a collection of extensible UI delegates that allow third-party look-and-feel developers to further tweak the appearance and the functionality of the ribbon component.

Perhaps the biggest addition to the upcoming release 4.3 of Substance look-and-feel are two new painter types, highlight and decoration. The decoration painters come especially handy for “offsetting” the ribbon component from the rest of the application UI. This is, indeed, how the original Office 2007 command bar (f.k.a. Ribbon) looks like under the Black and Blue themes.

The new public SubstanceLookAndFeel.setDecorationType API allows the applications to mark specific visual areas as decoration areas. The current Substance skin then decides how to paint the background of these areas, as well as all the controls that lie inside them. Specifically for the ribbon component, the Substance plugin for Flamingo sets the following decoration types on the ribbon (see below for the screenshots):

• The ribbon itself is marked as DecorationAreaType.HEADER.
• The task buttons and task bands are marked as DecorationAreaType.GENERAL.

The first makes the ribbon blend with the title pane, especially under decorated mode. The second makes all the ribbon controls be a) visually different from the title pane and b) provide a slightly different visual appearance than the “real” application area. Let’s see a few screenshots of the ribbon to better understand these two points.

Here is the ribbon under the last Substance release and Autumn skin:

And here is the same ribbon under the latest dev drop of Substance 4.3. Note how the ribbon blends much better with the title pane, clearly delineating the currently selected task:

The old implementation under Coffee Creme skin:

And the new visuals that make the top part of the application look more polished:

Finally, the old visuals under the Business Blue Steel skin:

And the new visuals (see explanation below):

Note that Business Blue Steel defines a separate theme for the DecorationAreaType.GENERAL decoration areas. For ribbon, it helps to make it stand apart from the rest of the application window, but not in a too “aggressive” way. Also note how this theme is applied to all ribbon visuals, including the command buttons, icons, in-ribbon galleries and the usual controls (combo boxes, buttons).

While the “tagging” of various ribbon areas is done by the Substance plugin for Flamingo, the SubstanceLookAndFeel.setDecorationType is public API and open for the application use.

To try the latest Substance and Flamingo visuals on your applications, use:

• The dev 4.3 version of Substance (code-named Nairobi)
• The dev 3.1 version of Flamingo (code-named Eilinora)
• The dev 4.3 version of Substance plugin for Flamingo

The version 4.3 of Substance is in feature freeze state, with release candidate scheduled on March 31st, and the final release scheduled on April 14.