Point of Sale (POS) systems are usually deployed at retail businesses such as restaurants or grocery stores. Most modern POS systems feature a touch-screen virtual computer that does not have keyboard or mouse. As such, it is operated by navigating through the available menus / features via on-screen selections. Due to the very nature of operating environment, these selections are done mostly manually (with fingers touching the screen). Here is how a sample POS system looks like:
And here is a sample screen of a POS system (click to see full size):
Since pressing your fingers on the screen is the only way to operate a POS system, all the controls need to be extra large.
I have already touched on subject of high-DPI support in Substance look-and-feel (part 1, part 2, part 3). Since the vast majority of Substance visuals are done with vector-based graphics, it should be able to scale to any font size. The real life, however, is not so simple and there are a lot of visual glitches that become apparent only at large scale values.
Here is a screenshot of an editable combobox using 72 pixel font under Substance 4.2. Note the clipped text, the gray margin around the text field editor and cap / join of the arrow icon:
And here is the same editable combobox under Substance 4.3:
Here is a screenshot of an icon button using 72 pixel font under Substance 4.2. Note the icon text gap, focus ring touching the text and the corners radius:
And here is the same button under Substance 4.3:
Here is a screenshot of a radio button using 72 pixel font under Substance 4.2. Note the checkmark text gap, focus ring weight, focus ring corner radius and the outer edge of the checkmark:
And here is the same radio button under Substance 4.3:
And finally, here is a screenshot of a checkbox using 72 pixel font under Substance 4.2. Note the checkmark text gap, focus ring weight and the focus ring corner radius:
And here is the same checkbox under Substance 4.3:
The latest development drop of Substance 4.3 has the first support for very large font sizes (which come with their own set of visual pitfalls, as illustrated above). It is in feature freeze state, with release candidate scheduled on March 31st, and the final release scheduled on April 14.
If you are interested in the topic of high-resolution monitors and the issues that they pose for UI applications in general, and for Swing in particular, please consider coming to a birds-of-feather session that i will be presenting with Mike Swingler (of Apple’s Swing team) at this year’s JavaOne. It is a little late (21:30 on Tuesday), but hopefully it will be worth it. Looking forward to seeing you.
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:
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:
Here are some Swing links that you might have missed during this week:
Thierry Lefortshows how to include table cell styling (foregroud / background colors) in the copy / paste operation. He also shows how to use a single view with highlighting and filtering on multiple SwingX components.
Alex Ruizannounced release 0.9 of the FEST-Swing library for functional Swing testing. One of the major internal changes to the library is first support for testing Groovy-based UIs.
Hans Muller confirms what many have already guessed. His e-mail on the users mailing list of AppFramework (reference implementation of JSR 296) confirms that the development of this project has been dead since last November and will continue to be so through this summer. The subsequent discussion on the mailing list indicates that it is quite unlikely that somebody will step up and be able to provide leadership that is much needed for JSR-level projects. The inclusion in JDK 7 looks like it’s in jeopardy as well.
John O’Connorhas an article on Beans Binding (reference implementation of JSR 295). Unfortunately, these two projects are twin victims of JavaFX for the better part of this year, and one could only hope that JavaFX will live up to its promise and to the investment in engineering resources that have been subverted to it.
Collin Faganhas an article on the intricacies of JTree and TreeModel APIs. The main reason for these is the fact that Swing has too many ways to accomplish the same thing (instead of one “true” way that may not sit well with “gurus”, but makes sure that the learning curve is much less steeper and the code is much more homogenic). I have addressed this issue last June.
Looks like this year brings a renewed interest in the Synth-based look-and-feels. Synth was introduced back in JDK 5.0, and it was marketed as one of the major upgrade reasons. The marketing would have you believe that every respectable designer will jump in and start cranking out sleek and polished Swing look-and-feels. Unfortunately, Synth was not tested to be well suited for this task, and there is only one production-ready family of look-and-feels that is based on it. Even then, its developers acknowledge that the base Synth implementation is ridden with multiple bugs.
However, things are changing for the better with Nimbus, the new Synth-based look-and-feel that will be part of JavaSE 6 update 10. While originally it was said to be image-based, its developers have settled for mostly Java2D-based rendering, fixing scores of core Synth bugs along the way. Jasper Potts (one of Nimbus developers) had a very interesting announcement a few months back, saying that they are working on a designer tool for Nimbus. While the full details will most probably be revealed at this year’s JavaOne, the tool allows designing the visuals in a Photoshop-like tool (with support for layering, gradients and effects). Then, the tool generates the Java2D code that produces the matching visuals at runtime.
This tool was not the first attempt at Synth designer. Romain Guyhad a prototype of such a builder back in 2005. Fred Lavigne worked on such a builder from 2005 to 2006. After that, Patrick Forhan has taken Fred’s code with the intent of continuing the development, but it appears that the initial check in in September 2006 was also the last one. Finally, Luan O’Carrollhas a Synth builder in his XUI framework (this branch has not seen any activity in the last six months).
Now, we have another attempt at writing a Synth designer. This time it comes from EaSynth that has announced the availability of version 1.00. While the tool itself is not free, the base EaSynth look-and-feel is available under the Apache license. While any new look-and-feel is welcome, at least for now it looks quite rough around the edges, especially compared with the existing Synthetica themes.
The previous entry on auto-scrolling in Swing applications under the latest development drops of Substance look-and-feel did not show this functionality in action. To get a feel of auto-scroll, click on the button below and click the middle mouse button in either the “Buttons” tab (the first one) or the “Scroll pane” tab after selecting the “Has auto scroll” checkbox in its control panel.
And here is a short video of auto-scroll in action, showing both vertical and horizontal auto-scroll:
