GUI-Builder für Eclipse

Im Gegensatz zu traditionellen Entwicklungsumgebungen besitzt die Java-Workbench von Eclipse keinen integrierten GUI-Builder. Dieser lässt sich jedoch über die Plugin-Schnittstelle von Eclipse leicht nachrüsten. Die wichtigsten GUI-Builder-Plugins stellen wir hier vor.

Die drei bekanntesten GUI-Builder sind die kommerziellen Tools Jigloo und Window Builder Pro (bestehend aus SWT Designer und Swing Designer) sowie der frei erhältliche Visual Editor. Seit einiger Zeit gibt es eine Portierung des bekannten NetBeans-GUI-Builders für die kommerzielle MyEclipse-IDE. Die Portierung nennt sich Matisse4MyEclipse. Etwas aus der Rahmen dieser Aufstellung fällt JAXFront, das grafische Oberflächen aus einem XML-Schema dynamisch erzeugt.

JFormDesigner ist ein kommerzieller GUI-Builder, der sowohl als Standalone-Version als auch als Eclipse-Plugin zur Verfügung steht.

JFormDesign untersützt unter anderem TableLayout, JGoodies Forms FormLayout, GridBagLayout Beim GridBagLayout lassen sich zudem Abstände zwischen Zeilen und Spalten festlegen, was die Erstellung von Formularen vereinfacht, da man somit keine Änderungen an der GridBagConstraints.insets vornehmen muss.

Mittels Nested-Klassen, die sich ebenfalls generieren lassen, kann bei umfangreichen Formularen der Code in Subpanels ausgelagert werden, um so die Übersichtlichkeit zu erhöhen.

Erstellte Design werden standardmäßig im XML-Format abgespeichert, lassen sich aber auch als Java-Code exportieren.

Der GUI-Builder mit dem originellen Namen Jigloo stammt von der US-amerikanischen Firma Cloudgarden.

Wie alle derartigen Eclipse-Module lässt sich das Jigloo-Plugin entweder über die Softwareaktualisierung der Hersteller-Homepage oder konventionell installieren. Letzteres geschieht, indem man die Plugin-Bestandteile in den Plugin-Ordner und die neuen Feature-Bestandteile in den Feature-Ordner von Eclipse zieht und die Workbench neu startet.

Jigloo bereichert die Eclipse-Workbench um einen Form Editor, eine veränderte Outline-View und eine neue Properties-View. Über die Eclipse-Preferences lassen sich das Erscheinungsbild, das Einlesen des Codes (Reverse Engineering) und die Codegenerierung steuern. Zudem können durch die Eclipse-Preferences so genannte Custom Controls angegeben und das Plugin für kommerzielle Zwecke freigeschaltet werden.

Die Einstellungen für das Erscheinungsbild erlauben die gleichzeitige Darstellung von Entwurfsmodus und Quelltext, wobei beide Fenster über einen Splitter getrennt werden. Jigloo lässt sich aber auch so einrichten, dass beide Ansichten getrennt über einen Reiter umgeschaltet werden. Weiterhin können zwei verschiedene Arten von geschützten Blöcken definiert werden. Sie sorgen dafür, dass Codeteile bei der Generierung von neuem Quelltext unberührt bleiben oder sogar beim Reverse Engineering nicht mehr eingelesen werden.

Bei den Einflussmöglichkeiten auf die Codegenerierung hat Jigloo in den letzten Versionen etwas zugelegt. Hier lässt sich zum Beispiel angeben, ob voll qualifizierte Bezeichner verwendet werden sollen. Für das schnelle Oberflächenprototyping ist praktisch, dass das Plugin Vorlagen für manche Widget-Modelle anlegen kann. Wenn man beispielweise eine neue Swing-Tabelle anlegt, erzeugt Jigloo gleich einen Rumpf des dazu passenden Modells.

Weiterhin lässt sich festlegen, ob neue Komponenten im Stil anderer GUI-Builder wie dem Visual Editor angelegt und Layouts in XML-Dateien ausgelagert werden sollen. Die Einstellungen zum Parsing gestatten jetzt, Code einzulesen, der von GUI-Buildern der IDEs NetBeans und JBuilder oder dem Visual Editor stammt.

Jigloo kommt sowohl mit AWT-, Swing- als auch mit den SWT-Klassenbibliotheken des Eclipse-Projekts zurecht. Einzigartig ist das Feature, zwischen einem Swing- und einem SWT-GUI hin- und herschalten zu können. Diese Funktion erzeugt jeweils vollständig neuen Quelltext. Jigloo verfügt über gut strukturierte Paletten mit allen wichtigsten Javabeans der genannten Java-Bibliotheken. Neue Beans lassen sich problemlos hinzufügen. Selbst komplexe Gridbag-Layouts bleiben übersichtlich.

Plus

• Kostenlos für nichtkommerzielle Zwecke
• Ergonomische Oberfläche
• Erzeugt übersichtlichen Java-Code
• Gute WYSIWYG-Unterstützung
• Sehr gutes Reverse-Engineering

Minus

• Synchronisierung fehleranfällig
• Codegenerierung unflexibel

Das Visual-Editor-Projekt (VEP) ist mehr als ein GUI-Builder-Plugin zur Entwicklung grafischer Oberflächen. Bei diesem Projekt standen mehrere Firmen Pate: Der ursprüngliche Code stammt von Advanced Systems Concepts, Canoo, IBM, Instantiations (siehe Window Builder Pro) sowie Red Hat.

Das VEP-Projektteam hat den von den Firmen gespendeten Code mittlerweile in Frameworks konsolidiert und den GUI-Builder Visual Editor geschaffen. Das Tool ist zu Eclipse 3.2 kompatibel und wurde mit Callisto ausgeliefert, funktioniert aber noch nicht ohne Änderungen unter Eclipse 3.3 und unter der aktuellen Eclipse-Version 3.4. Es war in einer Linie als Referenzimplementierung der Frameworks gedacht. Mittlerweile lässt er sich auch sehr gut für die tägliche Arbeit einsetzen. Der Visual Editor arbeitet wie Jigloo und Window Builder Pro mit allen drei Java-GUI-Frameworks zusammen: AWT, Swing und das vom Eclipse-Projekt entwickelte SWT/JFace-Framework.

Zur Installation des Plugins lädt man das Produkt entweder konventionell von der Eclipse-Seite herunter und kopiert es in die entsprechenden Ordner der Eclipse-Installation oder verwendet die integrierte Eclipse-Softwareaktualisierung (Help ⇒ Software Updates). Da sehr viele Abhängigkeiten zu diversen Frameworks existieren, ist der letztere Weg zu empfehlen. Die Softwareaktualisierung prüft vorhandene Abhängigkeiten und lädt alle erforderlichen Bestandteile automatisch über das Internet, so dass eine einwandfreie Funktion des GUI-Builder gewährleistet ist. Eine weitere Möglichkeit ist, sich die Callisto-Version von Eclipse herunterzuladen. Hier ist der Visual Editor bereits enthalten.

Nach der Installation beziehungsweise Aktualisierung findet sich der neue GUI-Builder nicht in der Liste der verfügbaren Views. Er tritt erst dann in Erscheinung, wenn man zum Beispiel eine „visuelle Klasse“ erzeugt oder eine vorhandene visuelle Klasse (Frame, Panel, Dialog, Window etc.) lädt. Zum Erzeugen von visuellen Klassen gibt es diverse Assistenten, die das Auswählen der Packages und Basisklassen erleichtern.

Das Laden einer visuellen Klasse geschieht über Open with ⇒ Visual Editor. Mit diesem Menübefehl lassen sich auch vorhandene Oberflächen einlesen. Der Visual Editor kann so konfiguriert werden, dass er automatisch GUIs erkennt, die von Borlands Jbuilder und IBMs Visual Age stammen. Das Reverse Engineering vorhandener Oberflächen funktioniert bis zu einer gewissen Komplexität eines Layouts ausreichend gut. Will man auch komplexe Layouts einlesen, sind Umstrukturierungen notwendig.

Wird eine visuelle Klasse in den Editor geladen, erscheint auch eine Palette mit Javabeans, aus denen die benötigten Widgets ausgewählt und zu einer Oberfläche arrangiert werden können. Neue Widgets zieht man vorzugsweise auf eine View und arrangiert das neue Element erst später in der Voransicht. Mehrere Elemente lassen sich über den Befehl Customize Layout eines Kontextmenüs nach verschiedenen Kriterien ausrichten und in der Größe und im Abstand abgleichen.

Der Visual Editor ist ein sehr guter GUI-Builder mit einigen kleineren Schwächen. Mit ihm lassen sich sowohl Swing als auch SWT-Oberflächen entwerfen. Einen leistungsstarken Computer vorausgesetzt, geht die Arbeit mit ihm schnell von der Hand. Leider hat das Visual-Editor-Projekt mangels Beteilung von Java-Entwicklern eine ungewisse Zukunft und daher gibt es auch keine offizielle aktuelle Version für Eclipse 3.4. Es ist zu hoffen, dass sich das bald ändert.

Plus

• Open Source
• Ergonomische Oberfläche
• Erzeugt sehr übersichtlichen Java-Code
• Gutes Reverse-Engineering
• Gute WYSIWYG-Ansicht

Minus

• Hoher Verbrauch von Systemressourcen
• Langsam

Instantiations ist der Hersteller der beiden Produkte SWT Designer und Swing Designer, die man entweder einzeln oder als Window Builder Pro im Paket erwerben kann.

Das Produkt ist einfach zu installieren: Man kopiert die Module in den Plugin-Ordner von Eclipse und startet die Workbench neu. Um mit dem Window Builder arbeiten zu können, muss das Produkt allerdings erst beim Hersteller Instantiations freigeschaltet werden. Kostenfrei ist nur eine sehr eingeschränkte Version sowie die Evaluierung der Vollversion.

Nach der Installation erscheint unter den Workbench-Einstellungen (Window ⇒ Preferences) ein eigener Unterpunkt namens Designer. Hier können die Codegenerierung, das Aussehen des Designers, Voreinstellungen zum Anlegen neuer Oberflächen sowie das Verhalten des GUI-Builder bei Swing- und SWT-Layouts festgelegt werden.

Die Codegenerierung beschränkt sich wie bei den Konkurrenzprodukten auf einige wenige Einstellungen. Das Aussehen der Oberfläche des Window Builder kann hingegen nach allen möglichen Arten an den persönlichen Geschmack angepasst werden. Das Anlegen neuer Swing- und SWT-Oberflächen ist ebenfalls konfigurierbar. Hier lassen sich Custom Controls angeben, Look and Feels der Swing-Bibliothek verwalten und Layout-Einstellungen (zum Beispiel das SWT-Formlayout) vornehmen.

Das Laden der entsprechenden Paletten ist abhängig von der Fensterklasse der GUI-Bibliothek, die bearbeitet werden soll. Kommt sie aus dem AWT/Swing-Bereich, zeigt der GUI-Builder nur dazu passende Widgets an, die Auswahl eines SWT-Fensters bewirkt die Anzeige einer SWT-Palette. Auch Window Builder Pro bietet mehrere Assistenten an, die es erlauben, die Einstellungen einer neuen Klasse komfortabel vorzunehmen.

Die Entwurfsansicht ist einfach zu bedienen und gestattet das Arrangement der Widgets nach allen erdenklichen Möglichkeiten. Die Codegenerierung funktioniert genauso problemlos und erzeugt gut strukturierten, übersichtlichen Quelltext. Die Synchronisation zwischen Quelltext und Entwurfsansicht klappt sehr gut lässt sich auch durch mehrmalige Restrukturierungen nicht aus der Ruhe bringen. Auch der Testmodus der Oberfläche lässt kaum Wünsche offen - im Gegensatz zum Reverse Engineering.

Der Window Builder Pro ist insgesamt immer noch der beste GUI-Builder für Eclipse. Sowohl Swing- als auch SWT-Oberflächen lassen sich mit ihm einfach entwerfen und testen. Die Codegenerierung funktioniert tadellos.

Plus

• Ergonomischer Oberfläche
• Erzeugt übersichtlichen Java-Code
• Genaue WYSIWYG-Ansicht
• Stabil

Minus

• Verbesserungsbedürftiges Reverse Engineering
• Unflexible Codegenerierung

Matisse4MyEclipse

Dieser GUI-Builder ist eine Portierung des NetBeans-GUI-Builders Matisse des Herstellers Genuitec. Genuitec stellt die kommerzielle Java-Entwicklungsumgebung MyEclipse her, die eine Erweiterung der Eclipse-IDE ist.

Die Java-Entwicklungsumgebung MyEclipse ist für Linux, Mac OS X und Windows verfügbar. Viele MyEclipse-Plugins funktionieren aber nur unter Linux und Windows. Matisse4MyEclipse ist auch davon betroffen und lässt sich unter Mac OS X nicht ausführen.

Zur Installation benötigt man eine Version von Genuitecs MyEclipse-IDE. Ist diese kommerzielle Eclipse-IDE installiert, kann der GUI-Builder entweder über die Quick-Installation oder über den Eclipse-Update-Manager nachinstalliert werden. Bei beiden Funktionen werden die Abhängigkeiten der zu installierenden Archive automatisch überprüft.

Mit dem Matisse4MyEclipse-GUI-Builder lassen sich Swing-Oberflächen spielend leicht entwerfen. Die Funktionen sind identisch zum NetBeans-Vorbild. Hin und wieder kommt es wie beim Vorbild zu kleineren Fehlern beim Refresh der Oberfläche. Die Ergonomie des Werkzeugs ist hingegen vorbildlich. Man wählt das Layout (Free Design, GridBag-Layout etc.) und ordnet die Komponenten per Drag und Drop an. Im Modus »Free Design« kam man dabei völlig frei gestalten. Das Layout lässt sich danach auch umschalten, ohne dass die Komponenten, wie es bei Konkurrenz des öfteren der Fall ist, chaotisch angeordnet werden.

Matisse4MyEclipse arbeitet mit Form-Dateien, in denen der GUI-Builder Metainformationen im XML-Format speichert. Löscht man diese Dateien, lässt sich das Layout nicht mehr im GUI-Builder öffnen. Vorhandene Form-Dateien aus einem NetBeans-Projekt liest Matisse4MyEclipse problemlos ein. Eine weitere Eigenheit sind die geschützten Codeblöcke, die der GUI-Builder in Java-Dateien anlegt. Sie sollten nicht verändert werden, da sie der GUI-Builder aus den XML-Inhalt der Form-Dateien stets neu erzeugt.

Der GUI-Builder ist auf das Layout von Swing-Oberflächen beschränkt. Bei einem Eclipse-GUI-Builder-Plugin erwartet man natürlich, dass der Entwickler damit nicht nur Swing, sondern auch SWT/JFace-Oberflächen gestalten kann. Zudem kann Matisse4Eclipse nicht in einem Standard-Eclipse eingesetzt werden. Das ist ärgerlich, weil es für die meisten MyEclipse-Plugins mittlerweile kostenfreie Alternativen gibt. Die Subskription von über 50 Dollar pro Jahr nur wegen des GUI-Builders zu bestellen, ist angesichts der Alternativen nicht besonders sinnvoll.

Der Matisse4MyEclipse-GUI-Builder ist wie sein NetBeans-Pendant ein phantastisches Produkt. Von der Ergonomie ist das Vorbild Matisse unbestritten der beste GUI-Builder im Java-Bereich. Trotz dieses Vorteils ist Matisse4MyEclipse keine Alternative zu Jigloo, Visual Editor oder Window Builder Pro. Das liegt vor allem daran, dass es mit Matisse4MyEclipse nicht möglich ist, SWT/JFace-Oberflächen zu entwerfen und das Produkt nicht ohne die MyEclipse-IDE erhältlich ist.

Plus

• Ergonomische Oberfläche
• Erzeugt übersichtlichen Java-Code
• Sehr gute WYSIWYG-Unterstützung
• Sehr gutes Reverse-Engineering

Minus

• Geschützte Codeblöcke
• Nur über kostenpflichtige Subskription von MyEclipse erhältlich
• Kann nicht in einer Standard-Eclipse-Umgebung eingesetzt werden
• Keine Unterstützung für Mac OS X
• Noch etwas buggy

JAXFront

Ein völlig anderen Weg als andere Hersteller von GUI-Buildern beschreitet Hersteller Xcentric. Er bezeichnet sein Verfahren als das erste Model-Driven-GUI-Engineering.

Wie die meisten Eclipse-Plugins lässt sich JAXFront installieren, indem man die entsprechenden Klassen in das Plugin-Verzeichnis von Eclipse kopiert.

Statt wie üblich, grafische Benutzeroberflächen mit Hilfe von Java-Objekten zu programmieren, geht JAXFront einen andere Weg, der eher an ein modellbasiertes Verfahren erinnern. JAXFront basiert darauf, aus XML-Daten dynamisch GUIs zu erzeugen. Als Modell der grafischen Oberfläche dienen hierbei eine Reihe von XML-Dateien, unter anderem ein XML-Schema. Man beginnt damit, einen Fenster oder einen Dialog zu erzeugen, indem man eine XUI-Datei mit strukturierten Informationen füllt. Diese XUI-Datei beschreibt das Aussehen, Verhalten und die Ereignissteuerung der Oberflächenkomponenten. Das eigentliche Datenmodell (Geschäftsdaten) des Fensters besteht aus einer XML-Datei, die zum XSD-Schema passen muss. Diese XML-Datei kann manuell oder maschinell erzeugt werden.

Das Verfahren hat den Vorteil, dass damit Rich-Client ähnlich wie eine Webanwendung aufgebaut sind und eine sehr gute Schichtentrennung erreicht wird. Wer ohnehin mit XML-Daten in seiner Anwendung arbeitet, also seine Daten beispielsweise aus einer XML-Datenbank bekommt, kann diese Daten mit Hilfe des JAXFront-Frameworks automatisch in eine grafische Oberfläche umsetzen lassen. Die Oberfläche wird hierbei nicht wie bei der Konkurrenz visuell komponiert. Der Hauptnachteil ist, dass die Logik der Verarbeitung der XML-/XSD-/XUI-Dateien in proprietären JAXFront-Bibliotheken liegt. Damit können Oberflächen, die mit JAXFront programmiert wurden, nicht mit anderen der hier genannten GUI-Buildern weiter bearbeitet werden.

JAXFront bietet dem GUI-Entwickler ein interessantes Verfahren, bei dem grafische Oberflächen aus XML-Dateien erzeugt werden. Das Verfahren hat Vorteile gegenüber der traditionellen Methode, eine GUI zu gestalten. Der große Nachteil ist, dass man sich damit an ein Entwicklungsmethode bindet, die weltweit nur wenige einsetzen dürften. Die mit diesem Werkzeug entwickelten Oberflächen können mit anderen GUI-Buildern nicht weiter bearbeitet werden.

Plus

• Ergonomische Oberfläche
• Gute Trennung von Daten und Oberflächen
• Gute WYSIWYG-Voransicht

Minus

• Proprietäres Verfahren
• Keine visuelle Komposition

AWT: Das Abstract Window Toolkit war die erste mit dem JDK ausgelieferte Java-GUI-Bibliothek, die aber wegen diverser Mängel heute meistens nur im Zusammenhang mit Swing verwendet wird.

Custom Controls: Selbst geschriebene Widgets (bei Java Javabeans genannt), die selbst gestaltet und mit Hilfsklassen versehen werden.

Entwurfsansicht: In dieser Ansicht lassen sich Menüs, Symbolleisten und Fenster wie Dialoge gestalten. Die Ansicht muss nicht unbedingt WYSIWYG-Kriterien erfüllen.

GUI-Builder: Werkzeug zur Gestaltung von grafischen Oberflächen, häufig auch GUI-Designer, UI-Designer oder Interfacebuilder genannt.

Java-Layoutmanager: Java-Klassen, die es erlauben, Widgets nach bestimmten Bedingungen anzuordnen. Ein Beispiel ist das GridLayout, das gestattet, Widgets auf einem unsichtbaren Gitternetz zu platzieren.

SWT: Standard Widget Toolkit, die GUI-Bibliothek des Eclipse-Projekts und Alternative zu AWT/Swing.

• Eclipse: Ökosystem für Entwickler-Tools
• XDEV 2: Java-Entwicklung für Dummys
• Ajax-Entwicklung erobert Eclipse
• Test: Netbeans wird komfortabler

— Autor: Bernhard Steppan 19.11.2007, 16:51