Styling Swing Components with Java CSS

• By Jeff Friesen
• Aug 28, 2009
• Article is provided courtesy of Que

From the author of
Special Edition Using Java 2, Standard Edition, Adobe Reader

JavaFX provides a Cascading Style Sheets (CSS) infrastructure for styling nodes (objects whose ultimate parent class is javafx.scene.Node). If you're a Swing developer who's jealous of JavaFX's good fortune, you'll be pleased to learn that this infrastructure is available to Swing via the open source Java CSS project.

This article introduces you to Java CSS by showing you where to obtain the Java CSS software and how to compile/run Java programs with this software, and by revealing an online demonstration of this technology. It then presents Java CSS fundamentals in terms of key API classes and concepts, and concludes by showing you how to extend Java CSS through a new property type.

Getting Started with Java CSS

Created by developer Ethan Nicholas, Java CSS is an API that implements CSS for Java GUI components. In addition to blogging about this project in summer 2008, Nicholas has provided a Java CSS tutorial and downloadable code at the project's Java.net-hosted website.

You can download the latest Java CSS binary (css-0.2.zip) and source (css-0.2-src.zip) distributions from the website's "Documents & files" section. You can also browse through the website's Javadoc to learn more about this API.

Unzip css-0.2.zip and you'll discover LICENSE and README files in the unzipped css-0.2 home directory. You'll also discover a lib subdirectory containing css.jar and its dependent beansbinding-1.2.1.jar and TimingFramework-1.0.jar JAR files. (This directory also contains appframework-1.0.3.jar and swing-worker-1.1.jar, which don't appear to be used.)

To compile and run a Java program that relies on Java CSS, you'll need to include css.jar in the classpath; for example, javac -cp css.jar... or java -cp css.jar... (assuming that lib is current). You don't need to also include beansbinding-1.2.1.jar and TimingFramework-1.0.jar in the classpath, because css.jar's MANIFEST.MF file includes these JAR files via its Class-Path attribute.

Nicholas's blog post and project website feature a JNLP-launchable tip calculator application that demonstrates Java CSS. Enter a meal amount into the text field, and use the slider to calculate an appropriate tip (shown via a label). If you select a tip that's too small, the slider's background animates to red. Similarly, it animates to green if you select too large a tip. Figure 1 shows the calculator's styled user interface.

Figure 1 The tip calculator also presents an editor window that lets you modify style sheet settings.

The editor window's user interface presents a list of named application-created style sheets in its right pane, the currently selected style sheet's contents in its left editor pane, an Enable Stylesheet checkbox that applies/removes the editor's style information to/from the tip calculator's user interface, and an Update button that reapplies the editor's styling information to the tip calculator UI.