Why We Need Such A Look And Feel IDE?
Author: Yun XUAN (Yun.XUAN@easynth.com)
Date: 2008.04.09
Source: http://www.easynth.com
EaSynth Look And Feel Designer is an IDE for Synth based look and feel, which can edit, preview, diagnose and export the look and feel for java swing applications. Why we need such a tool? To answer this, we need to answer the following questions:
What is Look And Feel?
The look and feel is the appearance of the application (look) and how should we operate with the software (feel). The look and feel is an important part of the user interface (UI), which will affect the users' impression of the products.
All applications have their look and feel, no matter proprietary or common. Most software use the common look and feel, it is not bad anyway, but some companies will apply their proprietary look and feel on their products, thus their products looks more professional and impressive. What's more, for some fashionable software's, such as MP3 players, desktop games, movie players etc, look and feel is much more important.
Here are some cool look and feels for MP3 player:
For native applications, the look and feel can be customized by defining the painting methods for different components, normally it is the programmers' work and mix with other logic implement. But a new solution appeared, it separate the look and feel logic from other logic, so that the software can change its look and feel without modifying the source code, just like switching its "skin". The Winamp MP3 player is a representative of this solution.
For java applications that using swing as the GUI framework, the look and feel is "pluggable" by nature, means that all swing based java applications can change their look and feel without modification on their logic implement. So we can develop the look and feel independently, and apply it on any java swing applications, so that the look and feel can also be regarded as a kind of "product".
What is Synth?
You may want to read the Wiki for Synth first.
The development of look and feel for native applications is out of the scope of this article, let's focus on the look and feel for java swing applications. Similar with that for native applications, the java swing applications also have their default look and feel, which is called "Metal" look and feel. It is so famous since it was ugly before it enclosed the "Ocean" theme in JRE5.
Here is a snapshot for the old "steel" theme in Metal look and feel:
And here is a snapshot for the new "ocean" theme in Metal look and feel:
The java programmers can design their own look and feel for java swing applications. Normally they should implement all UI classes for all swing components to define the new look of applications, it is not easy since the programmer have to be the artist at the same time so that they can convert the art work to java code. Maybe that is the reason why there are not so many look and feel available, you can visit javootoo to see the currently available look and feel.
Synth is a new look and feel shipped with JRE5, it try to separate the work for programmer and that for the artist, it promises that we can develop a new look and feel by specifying some attributes and some images in an XML file (let's say it is an image-based mode), it also keep the compatibility with the traditional way to design the look and feel, means redefining the UI classes for swing components are still supported. It is really exciting, isn't it? Unfortunately the first version of Synth look and feel has several bugs, some of them are even hard to live with. In order to design a new look and feel base on Synth, we may have to fix some critical bugs in the UI classes of some swing components. Even then, Synthetica is a product-ready Synth based look and feel that can work under JRE5. What's more, things become better since JRE6, most critical bugs of Synth look and feel are fixed, so using JRE6+ can avoid fighting with those bugs. Nimbus is another Synth based look and feel, which will be part of JavaSE 6 update 10, although originally it was said to be image-based, its developers also redefine some UI classes for components to fix some remaining bugs in Synth. EaSynth look and feel is a also a Synth based look and feel, it is generated by the Designer IDE, and can be used in JRE5+. It is really designed in image-based mode, there is no UI classes enclosed in this look and feel, some workaround for bugs are implemented in the painter class which will be referenced in the Synth definition XML file.
Here is a snapshot for the EaSynth look and feel:
What can the IDE do?
Synth is a good idea to customize the look and feel with less cost, but so far it is not so easy for usage. There are more than 50 components in swing, the Synth definition XML file will be big, managing such a big XML manually is not easy. We also need a tool to view the content of editing look and feel, and preview the effect of the look and feel if possible.
Now, we have EaSynth Look And Feel Designer, this IDE is the tool that meet all the requirements above. We do NOT need to work with the XML file anymore, we can just build the look and feel with the tool, the main use cases are shown in the following figure.
The IDE provide a visual way to edit the content of the XML, we can preview the effect of the specified component style, or preview the whole look and feel on any java swing application. The IDE also perform the data verification on the background, we do not need to read the DTD of the Synth definition XML all the time, the IDE will show us the diagnose result and give us the advise for fixing.
The IDE can generate two kinds of output file: look and feel project file and the look and feel JAR file. The look and feel project file contains all information about the look and feel, you can view the look and feel content by loading a look and feel project file in the IDE, you can also merge several project files into one, so that you can integrate the works in the team. The look and feel JAR file is the stand alone look and feel JAR file that can be integrated in our products. The ability to output files are not activated in trial version, but the output file samples are enclosed, the "EaSynthLookAndFeel.lfp" under the "projects" folder is the EaSynth look and feel project file. the "EaSynthLookAndFeel.jar" under the "lnf" folder is the exported JAR file for EaSynth look and feel.
The EaSynth look and feel, which is a output sample of the IDE, is also used as the default look and feel of the tool, by viewing the project file, you will have a rough idea on how to design a complete look and feel. You can also preview the look and feel in the IDE, to obtain the experience on the preview feature. EaSynth look and feel is open sourced, you can integrate the EaSynth look and feel JAR file in your products under Apache License 2.0.
Conclusion
The EaSynth Look And Feel Designer provides an easy way to design a new Synth based look and feel, it also present an easy way to integrate a new look and feel on any products. By using this tool, Java look and feel can be packed as a separated product easily. We hope that more and more Java look and feels will appear in the future.
REFERRENCE
Using Swing's Pluggable Look and Feel