JavaFX Scene Builder Grundkurs

Grafische Oberflächen visuell erzeugen

mit Ralph Steyer

36 Videos

(2 Std. 3 min)

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen

Mit „a visual layout tool for JavaFX applications“ bezeichnet Hersteller Oracle seinen GUI-Builder, mit dessen Hilfe sich grafische Oberflächen ganz einfach auch ohne Kenntnisse der Programmiersprache Java erzeugen lassen. In diesem Video-Training lernen Sie sowohl das Programm, aber auch die Layoutkonzepte von JavaFX, die Steuerelemente, grafische Formen, Diagramme und eine ganze Reihe von Tipps & Tricks kennen.

1. Java, JavaFX, FXML und Scene Builder im Überblick

Die Filme in dem Kapitel behandeln Grundlagen, die Sie über den Scene Builder und seinem Umfeld JavaFX/FXML wissen sollten.
- Sie erhalten hier eine kompakte Vorstellung des Java-Umfelds, seiner Historie und Zielen sowie der Java-Voraussetzungen, die Sie für die Arbeit mit dem Scene Builder erfüllen müssen.
  
  Was ist Java?
  
  02:58
- Dieses Video stellt den Scene Builder und dessen Umgebung, Java bzw. JavaFX, wie auch den Sinn und Zweck dieses genialen Tools vor.
  
  Was ist der Scene Builder?
  
  05:05
- Bezug und Installation des Scene Builders sind einfach, aber auf ein paar Feinheiten sollten Sie dennoch achten.
  
  Scene Builder installieren
  
  03:01
- Hier verfolgen Sie, wie Sie mit dem Scene Builder eine erste GUI erzeugen, im FXML-Format speichern und in einer Vorschau ausführen.
  
  Die erste Applikation
  
  08:05
- In diesem Film sehen Sie, wie Sie eine vorhandene FXML-Applikation öffnen können.
  
  Eine FXML-Applikation laden
  
  01:02
- Der Scene Builder stellt mehrere Templates (Schablonen) zur Verfügung, aus denen Sie bereits wichtige Grundstrukturen generieren lassen können.
  
  New from Template
  
  02:09
- Der Aufbau einer GUI mit dem Scene Builder erfolgt grundsätzlich mittels Drag&Drop. Dazu können Sie Komponenten aus dem Library-Bereich in die Fenstervorschau, aber auch in das Hierarchy-Panel ziehen und dort fallen lassen.
  
  GUI mit Scene Builder aufbauen
  
  01:42
- Im Scene Builder lassen sich die Eigenschaften, das Layout und auch die Code-Aufrufe über die Inspector-Ansicht festlegen und analysieren.
  
  Die Inspector-Ansicht in Scene Builder nutzen
  
  06:35
2. Das Layoutkonzept von JavaFX und Scene Builder

Dieses Kapitel dreht sich um die verschiedenen elementaren Aspekte des Layoutkonzepts von JavaFX und Scene Builder.
- 2.1. Grundideen des Layoutkonzepts
  
  Dieser Abschnitt vermittelt das nötige Hintergrundwissen, damit Sie das Layoutkonzept der Pane- und Panelstrukturen verstehen.
  - JavaFX und der Scene Builder organisieren eine GUI über verschachtelte Komponenten und Container, um darüber die vollständige und sinnvolle Anwenderschnittstelle zu erzeugen.
    
    Die Baumhierarchie
    
    04:14
  - Im Scene Builder fügen Sie Oberflächen mit sogenannten Pane- und Panel-Elementen zusammen. Das sind Container, die in der Regel selbst keine sichtbare Repräsentation bzw. keine echten Inhalte haben, aber mit anderen Elementen gefüllt werden können.
    
    Fenster und Container
    
    06:52
- 2.2. Container
  
  In diesem Abschnitt bekommen Sie einen genaueren Überblick über die verschiedenen Container, die Scene Builder bzw. JavaFX bereitstellt. Sie lernen die verschiedenen Möglichkeiten kennen und erfahren, wie man die Container recht einfach mit dem Scene Builder verwenden kann.
  - JavaFX kennt mit dem AnchorPane ein absolutes Layout, um dort Elemente wie Schaltflächen oder Beschriftungen exakt positionieren und deren Größe festlegen zu können. Weitgehend auf gleiche Weise wie ein AnchorPane ist ein Pane einsetzbar.
    
    Absolute Layouts
    
    03:51
  - Ein flexibler, dynamisch änderbarer Container ist das Accordion, das die vertikale Anordnung überlappender Inhalte erlaubt. Für die dynamische Struktur nutzt man mit untergeordneten TitledPane-Containern innere Container für die einzelnen Tabs.
    
    Accordion und TitledPane
    
    02:58
  - Ein BorderPane-Container ist der Nachfolger eines BorderLayout-Layoutmanagers und erlaubt die Anordnung von genau einer Kindkomponente in einem von fünf möglichen Zielbereichen.
    
    BorderPane – im Zeichen des Kompasses
    
    05:45
  - Die Container FlowPane, HBox und VBox verwalten ihre Inhalte fließend. FlowPane ist der Nachfolger des FlowLayout-Layoutmanager.
    
    Fließende Inhalte
    
    06:14
  - Ein sehr leistungsfähiger Anordnungscontainer ist das GridPane. Man kann damit Tabellenstrukturen beziehungsweise Gitter aufbauen, also Inhalt in Zeilen und Spalten organisieren.
    
    Tabellen beziehungsweise Gitter
    
    04:22
  - Das StackPane lässt Elemente übereinander stapeln, wobei immer nur eines angezeigt wird. Mit geeigneten Methoden können die anderen Elemente einzeln in den Vordergrund geholt werden.
    
    Stapelverarbeitung
    
    02:44
  - Das ScrollPane ist ein Container mit einem, bei Bedarf beschnittenen, Ansichtsbereich seines Inhalts. Es ermöglicht dem Benutzer, den Inhalt entweder direkt oder über eine Bildlaufleiste zu erreichen.
    
    Scrollbare Bereiche
    
    02:41
  - Mit einem SplitPane unterteilen Sie Anzeigebereiche vertikal oder horizontal und geben dem Anwender die Möglichkeit, die Größe der Anzeigebereiche mit der Maus zu verändern.
    
    Gesplittete Ansichten
    
    03:30
  - Eine mittlerweile übliche Anordnungsstruktur verwendet überlappende Inhalte in Form von Registerkarten, bei denen die verdeckten Inhalten nur über den Registerkartenreiter erkennbar sind.
    
    Tab-Strukturen
    
    03:30
  - Ein TilePane-Container ordnet seine Kinder in einem Raster gleichmäßig großer Kacheln an. Horizontal (der Standard) sind die die Knoten in Reihen angeordnet, vertikal in Spalten.
    
    Kachelraster mit TilePane-Container anlegen
    
    01:44
  - Ein Toolbar-Container erlaubt die kompakte Anordnung zusammengehöriger Schaltflächen. Wenn Sie mit dem Scene Builder eine Toolbar in das Content-Panel ziehen, wird bereits eine Schaltfläche enthalten sein.
    
    Eine Toolbar
    
    01:19
3. Controls, Formen und Diagramme

Die wichtigsten Möglichkeiten der Interaktion mit einem Anwender per GUI werden über Controls (Steuerelemente) realisiert. JavaFX stellt eine Vielzahl solcher Steuerelemente zur Verfügung. Darüber hinaus kann man auf einer grafischen Oberfläche Dinge zeichnen. Die verfügbaren Komponenten finden Sie im LIBRARY-Panel unter SHAPES (Formen). Diagramme runden die Möglichkeiten ab.
- 3.1. Controls
  
  In diesem Abschnitt erhalten Sie einen Überblick über die wichtigsten Controls, die Ihnen der Scene Builder bzw. JavaFX bereitstellt, und die Sie auch ohne einen Schritt auf die Quellcodeebene bereits erstellen und nutzen können.
  - Das Video stellt in einer kompakten Übersicht einige ausgewählte Steuerelemente vor, die Sie entweder kennen oder vermutlich intuitiv verstehen.
    
    Standardsteuerelemente
    
    03:60
  - Die hier kurz vorgestellten Steuerelemente (HTML Editor, ImageView, Color Picker und Progress Indicator), sind sehr leistungsfähig und im Scene Builder sogar sehr einfach zu verwenden.
    
    Mächtig, aber einfach
    
    02:26
  - In diesem Video lernen Sie die Erstellung von Menüs mit dem Scene Builder kennen.
    
    Menüs
    
    03:57
  - Hier geht es um die Erstellung von Kontextmenüs mit dem Scene Builder:. Das gelingt für einige, aber nicht für alle Controls.
    
    Kontextmenüs
    
    01:37
  - Bei interaktiven Controls sind oft kleine Hinweise für den Anwender sinnvoll, die erklären, was zu tun ist. Wie Sie solche Tooltips hinzufügen können, verrät dieses Video.
    
    Tooltips
    
    02:09
- 3.2. Formen und Diagramme
  
  JavaFX handhabt Formen und Diagramme vollkommen konsistent, wie Controls im JavaFX Scene Graph. In diesem Abschnitt lernen Sie diese dennoch etwas "speziellen" visuellen Typen näher kennen.
  - Formen erlauben das Zeichnen von Objekten (Kreise, Winkel, Rechtecke, etc.) in der grafischen Oberfläche. Gerade auf Formen lassen sich sehr gut diverse Effekte und Transformationen, aber auch Füllungen wie Gradienten etc. anwenden.
    
    Formen
    
    06:40
  - Diagramme sind hauptsächlich dann sinnvoll, wenn sie aus dem eigentlichen Programmcode dynamisch mit Daten gefüllt werden. Die Grundgerüste können mit dem Scene Builder erstellt werden und in einer Preview kann man die Diagramme mit Beispieldaten füllen.
    
    Diagramme
    
    02:23
4. JavaFX-Oberflächen und Scene Builder – Tipps für Fortgeschrittene

Die folgenden Videos warten mit einer Reihe nützlicher Tipps und Tricks für den Umgang mit JavaFX-Oberflächen und dem Scene Builder auf.
- Es gibt in JavaFX bzw. Scene Builder zwar kein horizontales Akkordion, aber mit einem kleinen Trick können Sie eine normale Accordion-Komponente entsprechend umfunktionieren. Das Verfahren ist eine spezielle Anwendung der JavaFX-Transformationstechniken.
  
  Ein horizontales Accordion
  
  02:01
- Wenn Sie mehrere Elemente im Scene Builder selektieren, können Sie deren Eigenschaften gemeinsam im Inspector konfigurieren.
  
  Gemeinsame Konfiguration
  
  02:25
- Die Kontextmenübefehle "Select Parent" und "Fit to Parent" erlauben eine Anpassung zwischen Kindelementen und deren Elterncontainern.
  
  Eltern
  
  01:02
- JavaFX stellt eine ganze Reihe von Effekten zur Verfügung, die konsistent auf alle visuellen Komponenten angewandt werden können. In dem Video lernen Sie, wie einfach diesen Effekte mit dem Scene Builder gelingen.
  
  Effekte
  
  04:26
- Hier erfahren Sie, wie Sie Elemente nachträglich in einen Elterncontainer einfügen. Dieser ummantelt dann die einzelnen Elemente.
  
  Wrap in
  
  01:02
- Bei der Gestaltung von Oberflächen mit JavaFX geht der Trend dahin, auch auf Web-Technologien zu setzen. Das bedeutet, dass Sie zur Gestaltung auch auf CSS zurückgreifen dürfen.
  
  Stylesheets
  
  05:23
- Gerade, wenn Sie explizit CSS zur Gestaltung visueller Komponenten einsetzen, ist es oft nicht leicht, die Ursache einer bestimmten Wirkung zu erkennen. Der CSS Analyzer hilft dabei.
  
  Der CSS Analyzer
  
  01:46
- Der Scene Builder arbeitet in der Praxis mit echtem Java-Code zusammen. In diesem Video sehen Sie, wie man mit einer Java-IDE wie NetBeans eine JavaFX-Applikation erzeugen und den generierten FXML-Code im Scene Builder weiterbearbeiten kann.
  
  FXML und der Scene Builder im Java-Kontext
  
  01:57

Hersteller:

Oracle

Software:

Java 8

Themen:

Programmierung

Entwicklertools

Exklusiv für Abo-Kunden

Erscheinungsdatum:25.03.2014

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!

Gut erklärt

Anonym

In dem Video dreht sich alles um den Scene Builder. Es wird alles sehr gut erklärt. Leute die keine Ahnung von Programmierung haben, dürften hier keine Probleme haben, denn das Thema wird komplett umgangen. Ich habe nur vier Sterne vergeben, weil bei dem Forgeschrittenen Teil doch einiges aus alten Kapiteln wiederholt wird. Trotzdem ist es ein empfehlenswertes Training für einen guten Einstieg.

Gutes Video zum ersten Einstieg in Java FX

Anonym

In diesem Video bekommt man einen recht guten Überblick über die einzelnen Komponenten in JavaFX. Interessant fand ich das Kapitel über die Containerarten und ein Paar Tipps aus dem letzten Kapitel. Die Vorstellung der einzelnen Controls könnte man kürzer halten, da keine tieferen Funktionen erklärt wurden. Ich hätte mir zum Schluss einen Aufbau einer komplexeren Oberfläche mit Einsatz diverser Contrainer und Verschachtelungen gewünscht.

Kunden, die dieses Training angesehen haben, sahen auch folgende Kurse: