Getting Started

Nach dem Erhalt einer Lizenz, sei es eine Trial- oder eine vollwertige Lizenz, hat man Zugriff auf die Download Pakete seines Cezanne Look & Feels innerhalb von Pixopia’s Download Bereich. Die Produkt-Pakete sind normalerweise als ZIP Archive verfügbar. Solch ein Archiv sollte alles enthalten, was man benötigt, um mit dem Look & Feel loszulegen.

Abhängig vom Kontext, im dem die Anwendung entwickelt wird, ist nur einer von mehreren verfügbaren Paket-Downloads relevant:

• XLaf-Cezanne Bundle
  Dieses Paket sollte genutzt werden, wenn die Applikation weitestgehend auf Java Swing Komponenten aufbaut oder Komponenten von Dritthersteller Bibliotheken wie Jide oder SwingX nutzt. Es ist auch die empfohlene Variante für Servoy Smart Clients. Dieses Bundle enthält Java Klassen in „obfuscateter“ Form.
• XLaf-Cezanne Debug Bundle (optional verfügbar, je nach Lizenz)
  Die in diesem Bundle enthaltenen JARs sind nicht zur Nutzung in Produktivsystemen vorgesehen. Sie enthalten Java Klassen in „nicht-obfuscateter“ Form und sind gedacht zur Nutzung in Debug Sessions.
• XLaf-Cezanne NetBeans Module
  Das ist das Paket, welches genutzt werden sollte, wenn das Look & Feel als NBM (NetBeans Module) benötigt wird, welches für den NetBeans Plugin Manager geeignet ist.
• XLaf-Cezanne NetBeans Module Project
  Benötigt man das NetBeans Module im Projekt-Format, wäre dies die richtige Download-Variante.

Hinweis: Das „X“ steht für den tatsächlichen Look & Feel Namen, z.B. „Biz“ für „BizLaf“.

Nach dem Entpacken des „standard“ Download Pakets („XLaf-Cezanne Bundle“), findet man die folgenden Dateien vor (steht hierbei für die gerade vorliegende Version des jeweiligen Pakets, also etwa „3.0.7“ oder „3.0.7.50“):

• xlaf-<version>.releasenotes.txt
  Diese Datei enthält die Versionshinweise für das Look & Feel Thema.
• cezanne-<version>.releasenotes.txt
  Diese Datei enthält die Versionshinweise für die Cezanne Look & Feel Engine.
• xlaf-cezanne-<version>.jar
  Das Look & Feel Theme in Kombination mit der Cezanne Look & Feel Engine; diese JAR-Datei muss im Klassenpfad Ihrer Anwendung vorhanden sein.
• xlaf-support-<version>.jar
  Diese JAR-Datei enthält die Supportklassen, um das Cezanne Look & Feel aus Ihrer Anwendung heraus zu steuern. Bitte beachten Sie, dass diese Klasse aus technischen Gründen nicht in Servoy unterstützt wird. Die Support Klassen dienen insbesondere dazu, Alternative Stile auf Einzelkomponenteninstanzen zu setzen. Diese JAR-Datei kann problemlos Teil Ihrer Anwendung bleiben, auch wenn Sie das Cezanne Look & Feel nicht mehr benutzen – sie hat keine Compile-Zeit Abhängigkeiten zu XLaf oder Cezanne. Es ist dennoch nicht erforderlich, diese JAR-Datei zu Ihrem Klassenpfad hinzuzufügen, um Zugriff auf die Steuerungsklassen zu erhalten, da die darin enthaltenten Klassen auch bereits in der oben genannten Theme und Engine JAR-Datei des Look & Feels Themas („XLaf“) mit Cezanne enthalten sind.
• xlaf-support-<version>.source.zip
  Dieses Archiv enthält die Quellen der Supportklassen.
• Documentation/Cezanne-User-Guide.pdf
  Dieses Dokument stellt eine Bedienungsanleitung für die Cezanne Look & Feel Engine dar.
• Documentation/XLaf-UserGuide.pdf
  Eine Kopie dieses Dokuments.
• Documentation/XLaf-UIDefaults.pdf
  Diese Datei listet alle mit diesem Look & Feel Thema (XLaf) verfügbaren UIDefaults auf.
• Servoy/XAlternativeStyles.css
  Nur, wenn mit Servoy benutzt: Enthält die alternativen Stil-Definitionen für XLaf. Details zur weiteren Verwendung finden Sie weiter unten in diesem Dokument.
• Servoy/XLafExampleScreen.servoy
  Nur, wenn mit Servoy benutzt: Eine Beispiel-Solution, welche die Alternativen Stile in einer Servoy Smart Client-Anwendung zeigt.

Die Download Pakete für die NetBeans Plattform enthalten auch einige der vorgenannten Dateien und zusätzlich noch die zur Benutzung in der NetBeans IDE notwendigen Dateien.

Wie Sie Ihr Cezanne Look & Feel in Ihrer Anwendung aktivieren

Um das Look & Feel in Ihrer Anwendung zu verwenden, müssen Sie die XLaf-Cezanne JAR Datei in den Klassenpfad Ihrer Anwendung integrieren. Danach können Sie das Look & Feel mit Hilfe des UIManagers setzen:

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

Das Beispiel zeigt, wie dies mit BizLaf gemacht wird. Für etwa LucidLaf muss „bizlaf“ durch „lucidlaf“ und „BizLookAndFeel“ durch „LucidLookAndFeel“ ersetzt werden.

Verwendung von Alternativen Stilen

So gut wie jedes Cezanne Look & Feel enthält Alternative Stile. Wenn nicht angewandt hat eine Komponente ihr „Standard“ Aussehen, so wie vom Look & Feel definiert. Aber, um eine lebhaftere GUI zu erhalten, können Komponenten einen Alternativen Stil benutzen, der besser zu ihrem Zweck oder Kontext passt. Beispielsweise kann es im Look & Feel einen Search Field Stil mit einem Lupen-Icon geben, der intuitiv die Funktion der Komponente visualisiert. Alternative Stile sind somit sehr ähnlich zu CSS Klassen mit dem entscheidenden Unterschied, dass jeweils nur eine einzige Klasse pro Komponente zugewiesen werden kann.

Ein weiteres Beispiel wäre eine JPanel-Instanz, die man anders als in ihren Standard-Look definiert aussehen lassen möchte. Im Falle von BizLaf ist der Standard-Look eine hellgraue Fläche mit etwas dunkleren vertikalen Nadelstreifen. Um die Anwendung visuell etwas segmentierter aussehen zu lassen, soll das JPanel, welches die Fußzeile darstellt den Alternativen Stil „FooterBar“ erhalten, welcher dunkelblau mit leichtem Lichteffekt am oberen Rand ist.

Die Namen der Alternativen Stile finden sich in einer Klasse namens de.centigrade.xlaf.support.XLafStyles (X steht dabei für den Namen des eigentlichen Look & Feels), welche innerhalb des Support Packages gefunden werden kann.

Für z.B. BizLaf ist der Name der Klasse „de.centigrade.bizlaf.support.BizLafStyles“.

In dieser Klasse kann man den Stil „FooterBar“ nachschlagen:

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

Der Java-Kommentar sagt, auf welche Komponenten der Stil angewendet werden kann: JPanel und JToolBar.

Um den Stil zu aktivieren, können Sie die Control Klasse verwenden. Deren Name ist „de.centigrade.xlaf.support.XLafControl“, also wäre dies für BizLaf „de.centigrade.bizlaf.support.BizLafControl“.

Die get() Methode gibt Ihnen Zugriff auf die Instanz dieser Klasse, mit der Sie dann den Stil über die Methode setStyle(JComponent, String) anwenden können:

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

Der Stil kann durch Aufruf von removeStyle(JComponent) wieder entfernt werden, was dazu führt, dass das JPanel wieder seinen Standardstil bekommt.

Schritt 1: Das Cezanne Look & Feel verfügbar machen

Um XLaf in Servoy nutzen zu können, muss es zunächst auf den Applikationsserver hochgeladen werden. Bitte laden Sie die Datei xlaf-cezanne-.jar auf einem der hier beschriebenen Wege hoch:

1. Über die Seite servoy-admin gehen Sie zu „Upload Library“ im linken Menü. Wählen Sie die JAR-Dateien aus und stellen Sie sicher, dass Sie den Typ „LAF“ auswählen, bevor Sie auf die Schaltfläche „Upload!“ klicken.
2. Suchen Sie Ihre Servoy-Installation auf der Festplatte, gehen Sie in den Ordner „application_server/lafs“ und kopieren Sie die JAR-Dateien in diesen Ordner.

Schritt 2: Aktualisieren Sie die Einstellungen des Application Servers und setzen Sie das Look and Feel

Als nächstes muss dem Servoy Application mitgeteilt werden, dass es sich bei dem neu hochgeladenden Look & Feel um das ausgewählte Look and Feel handelt. Dies kann wie folgt erreicht werden:

Benutzen Sie die Seite servoy-admin und gehen Sie zu „Servoy Server Home“. Bitte aktualisieren Sie dort die folgenden Einträge:

1. Suchen Sie den Eintrag selectedlnf: und geben Sie diesen Wert ein: de.centigrade.xlaf.XLookAndFeel
   Bitte ersetzen Sie xlaf bzw. XLookAndFeel durch den Namen des jeweiligen Look & Feel Themas, also bei BizLaf bswp. durch bizlaf bzw. BizLookAndFeel.
2. Suchen Sie den Eintrag servoy.smartclient.componentStyleClassDelegatePropertyKey: und geben Sie diesen Wert ein: Cezanne.Tag

Alternativ können Sie auch Ihre Servoy-Installation auf der Festplatte öffnen, in den Ordner „application_server“ gehen und diese Einträge manuell in die Datei „servoy.properties“ eintragen.
Nun sollten Sie den Applikationsserver neu starten, damit die Änderungen wirksam werden.

Nach der Durchführung dieser Schritte sollten Sie Ihre Anwendung mit dem neuen Look & Feel sehen können.

Hinweise zur Arbeit mit einem Cezanne Look & Feel unter Servoy:
Bitte beachten Sie, dass viele Eigenschaften, die pro Komponente in Servoy Developer eingestellt werden können (wie Hintergrund, Vordergrund, etc.) das Aussehen der Komponente, wie es durch das Cezanne Look & Feel vorgegeben wird, verändern. Um dies zu umgehen setzen Sie diese Eigenschaften bitte wieder auf den Standardwert zurück. Für Formulare sollten die Rahmen am besten auf „Empty“ gesetzt werden.

Für einige Komponenten müssen Sie möglicherweise die Standardeinstellung für die Transparenz ändern. Das heißt, wenn die Komponente nicht wie erwartet aussieht, versuchen Sie bitte, die Transparenzeinstellung umzuschalten. Beim Button zum Beispiel wird nach der Erzeugung die Transparenz CheckBox nicht selektiert sein und er wird mit einem Cezanne Look & Feel nicht wie erwartet aussehen. Wenn Sie die Transparenz auf true setzen, wird der Button wie erwartet aussehen.

Bitte beachten Sie auch, dass bereits vorhandene CSS Stylesheets ebenso das von einem Cezanne Look & Feel festgelegte Aussehen ändern können. Es wird dringend empfohlen, bereits vorhandene CSS Stylesheets zu entfernen, bevor Sie ein Cezanne Look & Feel verwenden.

Schritt 3: Verwendung von Alternativen Stilen

Bisher sehen Sie in Ihrer Anwendung nur die Standardstile, die das Cezanne Look & Feel zur Verfügung stellt. Da Cezanne Look & Feels für viele Komponenten oft mehrere Stile definieren, sogenannte Alternative Stile, ist es auch möglich, diese in einer Servoy Anwendung zu verwenden.

Um Alternative Stile auf Instanzen von Komponenten anwenden zu können, müssen Sie Ihrer Servoy-Solution unter „Ressourcen/Stile“ ein neues CSS Stylesheet hinzufügen. In den meisten Fällen enthält Ihr heruntergeladenes Cezanne Look & Feel bereits ein oder mehrere CSS Dateien.

Für BizLaf gibt es beispielsweise die folgenden:

• „BizLafAlternativeStylesBasic.css“
• „BizLafAlternativeStylesProfessional.css“

Das Mischen dieser CSS-Stylesheets mit bereits vorhandenen Stylesheets ist technisch möglich, wird aber nicht empfohlen. Wenn Sie vorhandene Stylesheets haben und diese Stylesheets mischen, ist es sehr wahrscheinlich, dass Komponenten nicht so aussehen, wie es vom Cezanne Look & Feel beabsichtigt war.

Um einen alternativen Stil anzuwenden, müssen Sie zunächst das Stylesheet in dem Formular über das Property „styleName“ aktivieren. Danach können Sie eine Komponente im Designer auswählen und einen der Stile im Property-Editor „styleClass“ wählen. Dort sollten alle Alternativen Stile aufgelistet sein. Für die meisten Komponenten sehen Sie den Effekt bereits „live“ im Servoy-Designer.

Hinweis: Nicht alle im Property-Editor angebotenen Stile können auf jede Komponente angewendet werden. Um sicherzustellen, dass ein Stil anwendbar ist, werfen Sie bitte einen Blick in die XLaf CSS Datei, wo Sie sehen können, welche Stile für welche Komponententypen gelten.

NetBeans Extension

Cezanne (und Look & Feel Themes die Stile für NetBeans anbieten) bietet eine spezielle Erweiterung zur Unterstützung von NetBeans‘ GUI-bezogenen Komponenten. Ein Beispiel ist z.B. das Docking-Framework von NetBeans. Die Cezanne NetBeans Erweiterung wird automatisch aktiviert, wenn die NetBeans-Plattform während der Laufzeit erkannt wird.

Integration in NetBeans Plattform-Anwendungen

Um ein Cezanne Look & Feel in NetBeans Plattform-Anwendungen zu integrieren, empfehlen wir die folgende Vorgehensweise:

1. Entpacken Sie die Dateien, die im heruntergeladenen Release-Package xlaf-netbeans-module-project–.zip enthalten sind, an einen Ort auf Ihrer Festplatte.
2. Kopieren Sie den extrahierten Ordner in den Ordner Ihrer NetBeans-Anwendung (Module-Suite).
3. Klicken Sie in Ihrer NetBeans-Anwendung mit der rechten Maustaste auf „Module“ und wählen Sie „Add Existing“.
4. Navigieren Sie in dem sich öffnenden Dialog zum XLaf Modulordner und klicken Sie auf „Open Project“.
5. Wenn NetBeans einen Dialog öffnet, der anzeigt „Module XLaf is already part of the module suite…“, dann können Sie den Dialog einfach durch Drücken der Schaltfläche „OK“ schließen.
6. Nun sollten Sie „Clean and build all“ für die Anwendung durchführen.
7. Abschließend können Sie Ihre Anwendung mit einem aktivierten Cezanne Look & Feel (z.B. BizLaf) starten.