Modern borders on Swing components

September 21st, 2007

One item suggested by Romain a year ago and missing up until now in Substance was an option to add lighter inner border to different components. Here is a sample screenshot of a few controls under Windows Vista:

Vista inner borders

As you can see, pretty much all the controls have a lighter inner border. Look at the checkboxes, radio buttons, scroll bars and buttons. Note that even the highlight indication on the selected list item has a lighter inner border. This approach was adopted by Microsoft designers back in Windows Vista, and has found its way into a few Synthetica themes as well.

Finally, i got around into providing this functionality in the latest binary drops of Substance. A handful of core skins now use different kinds of inner border painters, and here are a few examples.

We’ll start with Autumn skin. Here is how it looked before:

And here is how it looks now:

As you can see, pretty much all the relevant controls have lighter inner borders, including buttons, checkboxes, radio buttons, combos, text fields, scroll bars and tabs. Here is one more “before” shot under Autumn:

And here is the same application under the latest drop:

As you can see, you get consistent borders on the selected elements in lists and trees as well. This is due to the generic internal implementation of Substance border painting, which means that you get it on a very wide range of controls (including progress bars, text components, sliders and menus as well) for a very small increase in the library size.

Let’s move on to the Business skin. Here is the “before”:

And here is “after”:

Moving on to Creme skin, here is the “before”:

And here is the “after”:

Moving on to Raven Graphite skin, here is the”before”:

And the “after”:

And the last one is Raven Graphite Glass. The “before” screenshot:

And the “after”:

For more details on how to use the new inner border painter on custom Substance skins, read the source code of the relevant core skins mentioned above (until the documentation is ready).

Introducing Strider

September 16th, 2007

The previous teaser post showed a small video with “ripple” effects – an application showing a ripple overlay with waves originating on mouse click, bouncing off component borders and decaying over time, along with the superposition effects. It gives me a great pleasure to announce the first alpha drop of the Strider project (code-named Alento), that will provide these effects to Swing applications.

It provides a custom glass pane that can be installed and configured in the following way:

private RippleGlassPane rgp;

this.rgp = new RippleGlassPane(getRootPane());
this.rgp.ignoreClicksOn(JTextComponent.class, true);
this.rgp.markAsMedium(AbstractButton.class, true);
this.rgp.markAsWall(JTextComponent.class, true);
this.rgp.setOpaque(false);
this.setGlassPane(this.rgp);

The following RippleGlassPane methods can be used in the application code:

  • ignoreClicksOn – mouse clicks on the specified components will not result in a ripple wave.
  • markAsWall – bounds of the specified components will be marked as walls, resulting in ripple waves bouncing off.
  • markAsMedium – area of the specified components will be marked as medium, resulting in ripple waves propagating slower.

The current drop is in alpha stage, lacking a few features (proper support for resizing and granularity). It’s very small (about 28KB, and unlikely to gain much more as the development continues), and can be used in any Swing application. It should be noted that it’s quite CPU intensive, since the entire wave simulation is done in software.

Once again, thanks to Paul Falstad who donated the original code under the BSD license. Stay tuned for more.

Wolfgang is writing about a new component available in the latest release of Synthetica Addons called System Monitor:

If you’re interested about details on how to fetch the system information, look at this article i’ve written a few weeks ago for java.net. While some information is available in the System and Thread classes, you can access much more using JMX MBeans, including the information on threads and memory.

Note that with JMX, you can get the information not only on the current JVM, but on any running JVM that supports JMX. For now, it looks like the System Monitor component only allows tracing information on the current JVM (but i might be wrong).

New version of color wheel

September 12th, 2007

Luan O’Carroll of Xoetrope has been very active lately working on bug fixes and enhancements to the Xoetrope Color Wheel. It’s a Swing component that allows choosing colors in a very nice and visually appealing way, and it can be used in JColorChooser or as a part of larger UI (see video links below).

The latest additions available in the XUI itself as well as in the development version of Substance 4.1 add mouse-wheel support for the color wheel and the brightness / saturation sliders. This screencast shows the new features in action, and this screencast shows how the color wheel can be used in a larger UI.

In short, you can use the mouse wheel on the color wheel itself to play with the hue, and on the sliders to play with the brightness and saturation of the selected color. In addition, holding the Control key while wheeling over the sliders will apply the brightness / saturation on the color wheel itself. Here is how the color wheel looks like in default mode:

Color chooser Xoetrope color wheel - default

Here is how it looks like with decreased brightness:

Color chooser Xoetrope color wheel - decreased brightness

And here is how it looks like with decreased saturation:

Color chooser Xoetrope color wheel - decreased saturation

If you want to reuse this component in your code (like the Colorspace of Teppefall), make sure that you read and follow the terms of XUI license (identical to Mozilla Public License) in XUI.license of Substance distribution.