Getting Started

After having received a license, may it either be a trial or a full license, you probably may have spotted your Cezanne Look & Feel inside Pixopia’s Download Area. The products typically come in a bundle which normally is a ZIP archive. This archive should contain everything you need to get started using the Look & Feel.

Depending on the context where your application is developed in, there is only one of several available download archives relevant:

• XLaf-Cezanne Bundle
  This is the bundle to use if your application is mostly built on top of standard Java Swing components or uses 3rd party component libraries like Jide or SwingX. It is also the recommended version for Servoy Smart Clients. This bundle contains obfuscated Java classes.
• XLaf-Cezanne Debug Bundle (optionally available, depending on your license)
  This bundle contains JARs not meant to be used for production systems. They contain unobfuscated Java classes and are mainly intended to be used for debug sessions. It additionally contains sources of the Look & Feel and Cezanne.
• XLaf-Cezanne NetBeans Module
  This is the bundle for users that need the Look & Feel in form of a NBM (NetBeans Module) which can be used with NetBeans’ plugin manager.
• XLaf-Cezanne NetBeans Module Project
  If you need the NetBeans Module in project form, this would be the right download for you.

Hint: “X” stands for the actual Look & Feel name, e.g. “Biz” for BizLaf.

After extracting the “standard” download bundles (“XLaf-Cezanne Bundle”), you will find the following files (please note that denotes the actual version of the respective item, e.g. “3.0.7” or “3.0.7.50”):

• xlaf-<version>.releasenotes.txt
  These are the release notes for the X Look & Feel.
• cezanne-<version>.releasenotes.txt
  This file contains the release notes for the Cezanne Look & Feel engine.
• xlaf-cezanne-<version>.jar
  This is the JAR file containing the X Look & Feel theme combined with the Cezanne Look & Feel engine; this JAR file has to be available in the class path when using the Look & Feel within your application.
• xlaf-support-<version>.jar
  This JAR file contains the support classes. These classes enable you to control the Cezanne Look & Feel out of your application’s code. Please note, that this class is not supported in Servoy due to technical reasons. These classes especially serve the purpose to set Alternative Styles on single component instances. This JAR file can remain part of your application even if the Look & Feel JAR is not needed any more – it does not have any compile-time dependencies to the Look & Feel theme (XLaf) or Cezanne. Though, it is not required to add this JAR file to your classpath to get access to the control classes as its classes are already included within the aforementioned theme and engine JAR file for XLaf.
• xlaf-support-<version>.source.zip
  This archive contains the sources of the support classes.
• Documentation/Cezanne-User-Guide.pdf
  This document represents a user guide for the Cezanne Look & Feel engine. It mainly describes the possible properties with which Cezanne can be influenced.
• Documentation/XLaf-UserGuide.pdf
  A copy of this document.
• Documentation/XLaf-UIDefaults.pdf
  This file lists the available UIDefaults for the Look & Feel theme (XLaf).
• Servoy/XLafAlternativeStyles.css
  Only when used with Servoy: this file contains alternative style definitions for XLaf. Please find details on how to use this further down in this document.
• Servoy/XLafExampleScreen.servoy
  A sample solution that shows Alternative Styles in a prototypical Servoy Smart Client application.

The download bundles for the NetBeans platform also contain some of the above mentioned files plus the files necessary for using the Look & Feel within the NetBeans IDE.

How to activate your Cezanne Look & Feel in your application

To use the Look & Feel in your application, you have to add the XLaf-Cezanne JAR file to the classpath of your application. After that you can set the Look & Feel via the UIManager:

UIManager.setLookAndFeel("de.centigrade.bizlaf.BizLookAndFeel");

The example shows how to do this for BizLaf. For – e.g. LucidLaf – you can replace “bizlaf” by “lucidlaf” and “BizLookAndFeel” by “LucidLookAndFeel”.

Using Alternative Styles

Almost every Cezanne Look & Feel comes with Alternative Styles. If not applied, a component has its “standard” look as determined by the Look & Feel. But, to enable a more vivid GUI, components can use a style different to the standard one that better suits the component’s purpose or context. For example there may be a specific Search Field style with a loupe icon for text fields used for that purpose. So basically Alternative Styles are similar to CSS classes with the main difference being that only one single class can be applied at the same time.

Another example is a JPanel instance that should look different from the standard style which shows a grey background with dark grey pinstripes in the case of BizLaf. To make the application look more visually segmented and more interesting, the JPanel used as footer bar should get the alternative style „FooterBar“ which is dark blue with a slight lighting effect on the upper edge.

All available style names can be found in a class called “de.centigrade.xlaf.support.XLafStyles” (X standing for the actual Look & Feel name) which can be found inside the support package.

For e.g. BizLaf, the class is called “de.centigrade.bizlaf.support.BizLafStyles”

In this class, you can look up the style „FooterBar“:

/**
* Style 'FooterBar' that can be applied to Panel, ToolBar.
*
* @applicable Panel, ToolBar
*/
String FOOTER_BAR = STYLE_PREFIX + "FooterBar";

The Java comment tells you to which components the style can be applied to: JPanel and JToolBar.

To activate the style you have to use the Look & Feel control class. Its name has the common form “de.centigrade.xlaf.XLafControl”, so for e.g., BizLaf it would be called “de.centigrade.bizlaf.support.BizLafControl”.

The get() method gives you access to the instance of this class with which you then can apply the style via the method setStyle(JComponent, String):

JPanel panel = new JPanel();
BizLafControl.get().setStyle(panel, BizLafStyles.FOOTER_BAR);

The style can be removed again by calling removeStyle(JComponent) which gives the JPanel its standard style again.

Step 1: Make the Cezanne Look & feel available to Servoy

To be able to use a Cezanne based Look & Feel in Servoy, it has to be uploaded to the application server first. Please upload the xlaf-cezanne.jar in one of the following ways:

1. Use the servoy-admin page and go to „Upload Library“ in the left menu. Then, choose the JAR files and please make sure to select the type „LAF“ before hitting the „Upload!“ button.
2. Locate your Servoy installation on your hard drive, go to folder „application_server/lafs“ and copy the JAR files into this folder.

Step 2: Update the application server settings and set the Look and Feel

Next, you will have to tell the Servoy application server that the new Look & Feel is the currently selected Look and Feel. To do so, please use the servoy-admin page and go to „Servoy Server Home“. Please update the following entries:

1. Find the entry “selectedlnf”: and enter this string: de.centigrade.xlaf.XLookAndFeel as value ‘(where “x” and “X” are the specific name of the actual Look & Feel, e.g. “biz” or “Biz” for BizLaf).
2. Find the entry “servoy.smartclient.componentStyleClassDelegatePropertyKey”: and enter “Cezanne.Tag” as value (without quotes).

Alternatively, you can also locate your Servoy installation on the hard drive, go to the folder „application_server“ and enter those entries manually into the file “servoy.properties“.
Finally please restart the application server for the changes to take effect.

After performing these steps you should be able to see your application with the new Look & Feel.

Hints when working with a Cezannne Look & Feel in Servoy:
Please note, that many properties that can be set per component in the Servoy Developer (like background, foreground, etc.) change the look of the component as it was defined by the Cezanne Look & Feel. To overcome this, please set those properties back to their default value. For Forms, Borders should best be set to „Empty“.

For some components, you might have to change the default transparency setting. This means, that if the component does not look as expected, please try toggling the transparency setting. A Button for example comes with transparency unchecked after creation and in most cases, it will not look as expected with the Cezanne Look & Feel. Setting the transparency to true will make the Button look like expected.

Please also note, that any already existing Servoy stylesheets also change the look as defined by the Cezanne Look & Feel. It is strongly recommended to remove any already existing stylesheets before using a Cezanne Look & Feel.

Step 3: Using Alternative Styles

Up to now, only the standard styles of the Cezanne Look & Feel are shown in your application. As Cezanne Look & Feels offer more styles for many components, so called Alternative Styles, it is also possible to use them within a Servoy application.

To apply Alternative Styles to instances of components used in your application, a new StyleSheet should be added to the Servoy solution. In most cases, the Cezanne Look & Feel you downloaded already contains those CSS files.

For e.g. BizLaf, the following files are available:

• “BizLafAlternativeStylesBasic.css”
• “BizLafAlternativeStylesProfessional.css”

Mixing of those stylesheets with already existing stylesheets is technically possible – but not recommended. If this is done, it is very likely that components do not look as intended by the Cezanne Look & Feel.

To apply an alternative style, will first have to activate the stylesheet on the form via the property “styleName”. After doing so, it is possible to choose an Alternative Style for a component within the “styleClass” property combo box in the Servoy Designer. There, all styles should be listed. For most components, the effect of choosing a different Alternative Style can already be seen “live” in the Servoy Designer.

Hint: Not all styles offered in the property editor can be applied to any component. To ensure that a style is applicable, please take a look into the sources of of the XLaf CSS file where you can see which styles apply to which types.

NetBeans Extension

Cezanne (and Look & Feel themes that come with styles for NetBeans) offers a dedicated extension to support NetBeans‘ GUI related components. One example of such a component (collection) is the docking framework of NetBeans. The Cezanne NetBeans extension is automatically activated when Cezanne detects the presence of the NetBeans Platform at runtime.

Integration in NetBeans Platform Applications

To integrate a Cezanne Look & Feel into NetBeans Platform applications, the following procedure is recommended:

1. Extract the files contained in the downloaded release package xlaf-netbeans-module-project-<version>.zip to a location on your hard disk.
2. Copy the extracted folder into the folder of your NetBeans application (module suite).
3. In your NetBeans application, right click on „Modules“ and choose „Add Existing…“.
4. In the dialog that opens, navigate to the XLaf module folder and click „Open Project“.
5. If NetBeans opens a dialog showing „Module XLaf is already part of the module suite…“ you can just close the dialog by hitting the „OK“ button.
6. Now you should do a „Clean and build all“ of the application.
7. Finally you can start your application with an activated Cezanne Look & Feel (e.g. BizLaf).