Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Events - Registrierung von Events.
  • Outline - Abbildung der Komponenten-Hierarchie in einer UI oder View.
  • Palette - In der Palette werden alle UI-Komponenten aufgeführt, die für die Erstellung einer grafischen Oberfläche zur Verfügung stehen.
  • Project Management - Unter User Interface werden die UI sowie sämtliche Views einer Oberfläche verwaltet. 
  • Properties - Auflistung der Eigenschaften und Einstellungen für die selektierten UI-Komponente.
  • Quick Launch - Vorschau starten oder fertige Anwendung deployenBauen und starten des Maven-Projektes.
  • Toolbox - Funktionen zum Positionieren und Layouten von UI-Komponenten.

Image RemovedImage Added


Refresh

Sollte es beim Designen zu Darstellungsproblemen kommen, klicken Sie rechts oben auf , um einen Refresh des GUI-Builders durchzuführen.  Für größere Änderungen (wie z.B. Löschen & Hinzufügen von CSS-Dateien) muss der Hintergrundserver neugestartet werden, dazu klicken Sie rechts oben auf Image Added.

Theme

Über die Theme Combobox können Sie das Theme für die gesamte Oberfläche wechselndes Projektes ändern.

Zoom

Mit Hilfe der Zoom-Funktion können Sie Ihren Entwurf bei Bedarf vergrößern und verkleinern. Die Auswahl des Zoom-Faktors lässt sich sowohl über eine Combobox, als auch mit gedrückter Strg Taste + Mausrad einstellen.

Verwendung von Devices

Durch die Verwendung von Devices können Sie Ihrer Arbeitsfläche im GUI-Builder eine vordefinierte Größe geben. Wählen Sie dazu in der Toolbar Image Added aus und wählen dort Ihre zukünftige Größe der Oberfläche.

Image Added        Image Added

In Kombination mit dem Zoom können Sie somit auch auf kleinerem Raum Oberflächen mit sehr hoher Auflösung erstellen.

UI und Views bearbeiten

Durch Doppelklick auf eine UI oder View im Project Management > main-java wird diese zum Bearbeiten in einem neuen GUI-Builder Tab geöffnet, z.B. MainView.ui.xml. Um den generierten Java-Code zu sehen kann auf MainView.java im Project Management geklickt werden, oder per 'Strg + Shift + E' umgeschalten werden. 

Image RemovedImage Added

Layouts

Um eine grafische Oberfläche bestehend aus UI-Komponenten erstellen zu können, müssen Sie Ihrer View ein Layout zuweisen.Standardmäßig wird ein VerticalLayout als das Root-Layout verwendet. Das kann mit einen "Rechtsklick → Change Bean Type" zu jedem anderen Layout (z.B. HorizontalLayout) umgeändert werden.

Image Added

UI-Komponenten einfügen

...

Für eine Mehrfachauswahl müssen Sie die Shift Taste die Strg Taste gedrückt halten und die gewünschten GUI-Komponenten nacheinander anklicken. Die zuerst selektierte GUI-Komponente ist die führende GUI-Komponente, an der sich die anderen GUI-Komponenten der Mehrfachauswahl ausrichten lassen. Bei einer Mehrfachauswahl wird nur die führende GUI-Komponenten im Hierarchie-Pfad des GUI-Builders angezeigt. Um die führende GUI-Komponente zu wechseln, müssen Sie eine andere GUI-Komponente der Mehrfachauswahl anklicken.

...

  1. Klicken Sie mit Rechtsklick die UI-Komponente an, die Sie austauschen möchten, z.B. ein XdevTextField TextField.
  2. Wählen Sie im Kontextmenü > Change Bean Type.
  3. Geben Sie im folgenden Dialog die neue UI-Komponente an, z.B. XdevComboBoxComboBox.
  4. Klicken Sie auf OK.
  5. Klicken Sie auf Speichern.

...

  • Durch das Austauschen gelayouteter UI-Komponenten kann das Gesamtlayout beeinträchtigt werden.
  • Layout-Änderungen - Nach dem Austauschen eines Layouts werden die darin enthaltenen UI-Komponenten nach den Regeln des gewählten Layouts völlig neu angeordnet.

...

  • Mit Replace all ... werden in der aktuellen View alle UI-Komponenten des gewählten Typs (TextField), durch den neuen Typ (ComboBox) ersetzt.

Achtung!

    Manchmal geht der GUI-Builder kaputt und zeigt eine Fehlermeldung an. Das passiert wenn die Anwendung einen Runtime-Fehler hat. Dieser muss erst gefixed werden, bevor der GUI-Builder nach einen Background-Server-Neustart wieder funktioniert.
    Häufige Fehlerquellen sind hier zu finden.


Code-Generierung

Nach jeder Änderung im GUI-Builder generiert RapidClipse automatisch XML-Code und daraus Javacode.

...