User Tools

Site Tools


de:javafx

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
de:javafx [2018/12/22 13:31]
roehner [ContextMenu]
de:javafx [2019/04/07 20:05] (current)
roehner
Line 2: Line 2:
 JavaFX wird ab Version 14.0 vom Java-Editor unterstützt. Die Entwicklung dieser neuen grafischen Benutzeroberfläche für den Java-Editor hat viele Monate in Anspruch genommen. Doch ich denke, dass sich die Arbeit insgesamt gelohnt hat. Man kann nun mit einer zeitgemäßen GUI-Bibliothek arbeiten, die auch mit CSS gestaltet werden kann. Das Erstellen einer GUI-Oberfläche wird für Programmieranfänger noch leichter gemacht, weil der Objekt-Inspektor standardmäßig nur die wichtigsten Attribute von GUI-Komponenten anzeigt. Dadurch können die GUI-Komponenten deutlich leichter konfiguriert werden. Außerdem stehen jetzt grafische Grundfiguren wie Kreis, Rechteck und Vieleck zur Verfügung, womit sich auch im Unterricht einfacher GUI-Anwendungen mit grafischen Objekten gestalten lassen. JavaFX wird ab Version 14.0 vom Java-Editor unterstützt. Die Entwicklung dieser neuen grafischen Benutzeroberfläche für den Java-Editor hat viele Monate in Anspruch genommen. Doch ich denke, dass sich die Arbeit insgesamt gelohnt hat. Man kann nun mit einer zeitgemäßen GUI-Bibliothek arbeiten, die auch mit CSS gestaltet werden kann. Das Erstellen einer GUI-Oberfläche wird für Programmieranfänger noch leichter gemacht, weil der Objekt-Inspektor standardmäßig nur die wichtigsten Attribute von GUI-Komponenten anzeigt. Dadurch können die GUI-Komponenten deutlich leichter konfiguriert werden. Außerdem stehen jetzt grafische Grundfiguren wie Kreis, Rechteck und Vieleck zur Verfügung, womit sich auch im Unterricht einfacher GUI-Anwendungen mit grafischen Objekten gestalten lassen.
  
-Beachten ​Sie bitte, dass Sie in der Konfiguration unter //Sichtbarkeit// einstellen können, welche Registerkarten angezeigt ​werden. ​Für JavaFX benötigen Sie FX Base, FX Controls und FX Shapes. Die Registerkarten für AWT und Swing können Sie hier deaktivieren.+Ab dem JDK 11 ist JavaFX nicht mehr im JDK enthalten und muss zusätzlich installiert werden. ​Sie können sich über https://​gluonhq.com/​products/​javafx/​ ein JavaFX Windows SDK herunterladen und parallel zum OpenJDK installieren. In der Konfiguration ​trägt man unter [[Konfiguration#​Interpreter|Interpreter/JavaFX-Ordner]] den JavaFX-Ordner ein. 
 + 
 +Eine Dokumentation von JavaFX kann über https://www.oracle.com/technetwork/​java/​javase/​documentation/​jdk8-doc-downloads-2133158.html heruntergeladen ​werden. ​Den Pfad der Indexdatei wird unter [[Konfiguration#​Dokumentation|Dokumentation - Manual Java FX]] eingetragen
  
 {{:​de:​javafxconf.png|}} {{:​de:​javafxconf.png|}}
 +
 +Beachten Sie bitte, dass Sie in der Konfiguration unter //​Sichtbarkeit//​ einstellen können, welche Registerkarten angezeigt werden. Für JavaFX benötigen Sie FX Base, FX Controls und FX Shapes. Die Registerkarten für AWT und Swing können Sie hier deaktivieren.
  
 Gerhard Röhner\\ Gerhard Röhner\\
Line 16: Line 20:
 Eine Label-Komponente kann außer Text auch ein Bild oder Beides darstellen.  ​ Eine Label-Komponente kann außer Text auch ein Bild oder Beides darstellen.  ​
 Um ein Bild darzustellen wählt man im Objekt-Inspektor beim Attribut //Graphic// die gewünschte Bilddatei aus. Um ein Bild darzustellen wählt man im Objekt-Inspektor beim Attribut //Graphic// die gewünschte Bilddatei aus.
-Dabei wird die ausgewählte Bilddatei automatisch in den Ordner //images// kopiert.\\+Dabei wird die ausgewählte Bilddatei automatisch in den Ordner //images// kopiert.
  
 Beispiel: {{:​de:​Jlabel.png}} Beispiel: {{:​de:​Jlabel.png}}
Line 30: Line 34:
 {{:​de:​jtextfield.png}} {{:​de:​jtextfield.png}}
 <code java>​String Name = tfName.getText();</​code>​ <code java>​String Name = tfName.getText();</​code>​
-\\ 
 ---- ----
 ==== NumberField ==== ==== NumberField ====
Line 45: Line 48:
 <code java>​nfSumme.setDouble(Summe); ​   // maximale Anzahl von Nachkommastellen:​ 3657.42323426347834 ​   ​ <code java>​nfSumme.setDouble(Summe); ​   // maximale Anzahl von Nachkommastellen:​ 3657.42323426347834 ​   ​
 nfSumme.setDouble(Summe,​ 2); // zwei Nachkommastellen: ​               3657.42 </​code>​ nfSumme.setDouble(Summe,​ 2); // zwei Nachkommastellen: ​               3657.42 </​code>​
-\\ 
 ---- ----
 ==== TextArea ==== ==== TextArea ====
Line 58: Line 60:
 <code java> ​ taAusgabe.setText("​Ausgabe:​\n\n"​);​ <code java> ​ taAusgabe.setText("​Ausgabe:​\n\n"​);​
   taAusgabe.appendText("​Zahl " + Zahl + " gefunden! \n"​);</​code>​   taAusgabe.appendText("​Zahl " + Zahl + " gefunden! \n"​);</​code>​
-\\ 
 ---- ----
 ==== Button ==== ==== Button ====
Line 82: Line 83:
 {{:​de:​isselectedde.png}} {{:​de:​isselectedde.png}}
 <code java> ​ if (MeineCheckBox.isSelected()) ...</​code>​ <code java> ​ if (MeineCheckBox.isSelected()) ...</​code>​
-\\ 
 ---- ----
 ==== RadioButton & ToggleGroup ==== ==== RadioButton & ToggleGroup ====
Line 97: Line 97:
 <code java>​RadioButton gewählterRadioButton = (RadioButton) toggleGroup1.getSelectedToggle(); ​ <code java>​RadioButton gewählterRadioButton = (RadioButton) toggleGroup1.getSelectedToggle(); ​
 String gewählt = gewählterRadioButton.getText();​ </​code>​ String gewählt = gewählterRadioButton.getText();​ </​code>​
-\\ 
 ---- ----
 ==== ListView ==== ==== ListView ====
Line 124: Line 123:
 <code java> ​ String s = (String) meineListe.getSelectionModel().getSelectedItem();​ <code java> ​ String s = (String) meineListe.getSelectionModel().getSelectedItem();​
   int Zahl = Integer.parseInt(s);</​code>​   int Zahl = Integer.parseInt(s);</​code>​
-\\ 
 ---- ----
 ==== ComboBox ==== ==== ComboBox ====
Line 149: Line 147:
  
 Um automatisch auf eine Eingabe oder Auswahl in einer ComboBox reagieren zu können, erstellt man im Objekt-Inspector eine Ereignismethode für //action//. Um automatisch auf eine Eingabe oder Auswahl in einer ComboBox reagieren zu können, erstellt man im Objekt-Inspector eine Ereignismethode für //action//.
-\\ 
 ---- ----
 ==== Spinner ==== ==== Spinner ====
Line 159: Line 156:
 Zur Laufzeit kann man mit der Methode getValue() den aktuellen Wert abfragen: Zur Laufzeit kann man mit der Methode getValue() den aktuellen Wert abfragen:
 <code java> ​ int Wert = meinSpinner.getValue(); ​      </​code>​ <code java> ​ int Wert = meinSpinner.getValue(); ​      </​code>​
-\\ 
 ---- ----
 ==== Canvas ==== ==== Canvas ====
Line 190: Line 186:
  
 Mit einer MenuBar-Komponente kann man eine Menüleiste erstellen. Die Menüleiste zeigt die Menüs (Menu-Komponenten) an, die ihr zugeordnet werden. Mit einer MenuBar-Komponente kann man eine Menüleiste erstellen. Die Menüleiste zeigt die Menüs (Menu-Komponenten) an, die ihr zugeordnet werden.
-\\ 
 ---- ----
 ==== Menu ==== ==== Menu ====
Line 198: Line 193:
  
 Für jeden Menübefehl erzeugt der Java-Editor eine zugehörige Ereignismethode. Für jeden Menübefehl erzeugt der Java-Editor eine zugehörige Ereignismethode.
-\\ 
 ---- ----
 ==== ContextMenu ==== ==== ContextMenu ====
Line 216: Line 210:
  
 Im Objekt-Inspektor gibt man unter //​MenuItems//​ die Menübefehle ein. Zu jedem Menübefehl wird eine Ereignismethode angelegt. Im Objekt-Inspektor gibt man unter //​MenuItems//​ die Menübefehle ein. Zu jedem Menübefehl wird eine Ereignismethode angelegt.
-\\ 
 ---- ----
 ==== SplitMenuButton ==== ==== SplitMenuButton ====
Line 222: Line 215:
  
 Im Objekt-Inspektor gibt man unter //​MenuItems//​ die Menübefehle ein. Zu jedem Menübefehl und zum SplitMenuButton selbst wird eine Ereignismethode angelegt. Im Objekt-Inspektor gibt man unter //​MenuItems//​ die Menübefehle ein. Zu jedem Menübefehl und zum SplitMenuButton selbst wird eine Ereignismethode angelegt.
-\\ 
 ---- ----
 =====JavaFX Controls===== =====JavaFX Controls=====
Line 233: Line 225:
   double value = slider1.getValue();​   double value = slider1.getValue();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== ProgressBar==== ==== ProgressBar====
Line 241: Line 232:
   progressBar1.setProgress(0.3);​   progressBar1.setProgress(0.3);​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== ProgressIndicator==== ==== ProgressIndicator====
Line 249: Line 239:
   progressIndicator1.setProgress(0.75);​   progressIndicator1.setProgress(0.75);​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== ToolBar==== ==== ToolBar====
Line 258: Line 247:
 toolBar1.getItems().addAll(bNeu,​ bOeffnen, new Separator(),​ bDrucken); ​ toolBar1.getItems().addAll(bNeu,​ bOeffnen, new Separator(),​ bDrucken); ​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== Separator==== ==== Separator====
 {{:​de:​separator.png}} Mit einer Separator-Komponente kann man GUI-Komponenten durch eine Linie voneinander abtrennen. {{:​de:​separator.png}} Mit einer Separator-Komponente kann man GUI-Komponenten durch eine Linie voneinander abtrennen.
-\\ 
 ---- ----
 ==== ToggleButton==== ==== ToggleButton====
Line 270: Line 257:
     if (toggleButton1.isSelected()) ...     if (toggleButton1.isSelected()) ...
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== PasswordField==== ==== PasswordField====
 {{:​de:​password.png}} Mit einer PasswordField-Komponente kann man ein Passwort eingeben, bei dem die einzelnen Zeichen verdeckt angezeigt werden.. {{:​de:​password.png}} Mit einer PasswordField-Komponente kann man ein Passwort eingeben, bei dem die einzelnen Zeichen verdeckt angezeigt werden..
-\\ 
 ---- ----
 ==== ChoiceBox==== ==== ChoiceBox====
 {{:​de:​choicebox.png}} Eine ChoiceBox-Komponente ist eine ComboBox-Komponente,​ bei der man nur auswählen, aber nichts eingeben kann. {{:​de:​choicebox.png}} Eine ChoiceBox-Komponente ist eine ComboBox-Komponente,​ bei der man nur auswählen, aber nichts eingeben kann.
-\\ 
 ---- ----
 ==== Hyperlink==== ==== Hyperlink====
 {{:​de:​hyperlink.png}} Eine Hyperlink-Komponente stellt einen Text als Verweis dar, den man anklicken kann. Wie bei einem Button wird dann ein Ereignis ausgelöst, auf das man in einer Ereignismethode reagieren kann. {{:​de:​hyperlink.png}} Eine Hyperlink-Komponente stellt einen Text als Verweis dar, den man anklicken kann. Wie bei einem Button wird dann ein Ereignis ausgelöst, auf das man in einer Ereignismethode reagieren kann.
-\\ 
 ---- ----
 ==== HTMLEditor==== ==== HTMLEditor====
Line 291: Line 274:
 String s = hTMLEditor1.getHtmlText();​ String s = hTMLEditor1.getHtmlText();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== WebView==== ==== WebView====
 {{:​de:​webview.png}}\\ {{:​de:​webview.png}}\\
 Eine WebView-Komponente kann die Webseite zu einer Internetadresse anzeigen. Im Attribut //URL// des Objekt-Inspektors gibt man die Internetadresse mit Protokoll an, z.B. http://​www.javaeditor.org. Eine WebView-Komponente kann die Webseite zu einer Internetadresse anzeigen. Im Attribut //URL// des Objekt-Inspektors gibt man die Internetadresse mit Protokoll an, z.B. http://​www.javaeditor.org.
-\\ 
 ---- ----
 ==== ColorPicker==== ==== ColorPicker====
-{{:​de:​colorpicker.png}}\\+{{:​de:​colorpicker.png}}
 Mit einer ColorPicker-Komponente kann man eine Farbe auswählen. Mit einer ColorPicker-Komponente kann man eine Farbe auswählen.
  
Line 305: Line 286:
 Color c = colorPicker1.getValue();​ Color c = colorPicker1.getValue();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== DatePicker==== ==== DatePicker====
Line 314: Line 294:
 LocalDate d = datePicker1.getValue();​ LocalDate d = datePicker1.getValue();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== Pagination==== ==== Pagination====
 {{:​de:​pagination.png}} Mit einer Pagination-Komponente kann man zwischen Seiten eines Inhalts navigieren. {{:​de:​pagination.png}} Mit einer Pagination-Komponente kann man zwischen Seiten eines Inhalts navigieren.
-\\ 
 ---- ----
 ==== FileChooser==== ==== FileChooser====
Line 336: Line 314:
 File f = fileChooser1_openFile();​ File f = fileChooser1_openFile();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== FileChooser==== ==== FileChooser====
Line 354: Line 331:
 File f = fileChooser1_saveFile();​ File f = fileChooser1_saveFile();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== DirectoryChooser==== ==== DirectoryChooser====
Line 372: Line 348:
 File d = directoryChooser1_openDirectory();​ File d = directoryChooser1_openDirectory();​
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== ImageView==== ==== ImageView====
 {{:​de:​imageview.png}} Mit einer ImageView-Komponente kann man ein Bild (//Image//) anzeigen. {{:​de:​imageview.png}} Mit einer ImageView-Komponente kann man ein Bild (//Image//) anzeigen.
-\\ 
 ---- ----
 ==== MediaView==== ==== MediaView====
 {{:​de:​mediaview.png}} Mit einer MediaView-Komponente kann man ein Video mit dem MediaPlayer anzeigen. {{:​de:​mediaview.png}} Mit einer MediaView-Komponente kann man ein Video mit dem MediaPlayer anzeigen.
-\\ 
 ---- ----
 ==== TableView==== ==== TableView====
Line 387: Line 360:
 Im Attribut //​GenericType//​ gibt man den Typ der darzustellenden Zeilen an.  Im Attribut //​GenericType//​ gibt man den Typ der darzustellenden Zeilen an. 
 Im Attribut //​tableView1Items//​ werden die in der Tabelle anzuzeigenden Daten gespeichert. Im Attribut //​tableView1Items//​ werden die in der Tabelle anzuzeigenden Daten gespeichert.
-\\ 
 ---- ----
 =====JavaFX Shapes===== =====JavaFX Shapes=====
Line 404: Line 376:
  
 </​code>​ </​code>​
-\\ 
 ---- ----
 ==== Rectangle ==== ==== Rectangle ====
 {{:​de:​rectangle.png}} Eine Rectangle-Komponente stellt ein Rechteck dar. Das Attribut //Fill// legt seine Füllfarbe, das Attribut //Stroke// seine Rahmenfarbe fest. {{:​de:​rectangle.png}} Eine Rectangle-Komponente stellt ein Rechteck dar. Das Attribut //Fill// legt seine Füllfarbe, das Attribut //Stroke// seine Rahmenfarbe fest.
-\\ 
 ---- ----
 ==== Ellipse ==== ==== Ellipse ====
 {{:​de:​ellipse.png}} Eine Ellipse-Komponente stellt ein Ellipse dar. Das Attribut //Fill// legt seine Füllfarbe, das Attribut //Stroke// seine Rahmenfarbe fest. {{:​de:​ellipse.png}} Eine Ellipse-Komponente stellt ein Ellipse dar. Das Attribut //Fill// legt seine Füllfarbe, das Attribut //Stroke// seine Rahmenfarbe fest.
-\\ 
 ---- ----
 ==== Polygon==== ==== Polygon====
 {{:​de:​polygon.png}} Eine Polygon-Komponente stellt einen geschlossenen Streckenzug dar. Im Attribut //Points// gibt man die Koordinaten der Streckenpunkte an. Sie beziehen sich auf das den Streckenzug umgebende Rechteck. {{:​de:​polygon.png}} Eine Polygon-Komponente stellt einen geschlossenen Streckenzug dar. Im Attribut //Points// gibt man die Koordinaten der Streckenpunkte an. Sie beziehen sich auf das den Streckenzug umgebende Rechteck.
-\\ 
 ---- ----
 ==== Polyline==== ==== Polyline====
 {{:​de:​polyline.png}} Eine Polyline-Komponente stellt einen offenen Streckenzug dar. Im Attribut //Points// gibt man die Koordinaten der Streckenpunkte an. Sie beziehen sich auf das den Streckenzug umgebende Rechteck. {{:​de:​polyline.png}} Eine Polyline-Komponente stellt einen offenen Streckenzug dar. Im Attribut //Points// gibt man die Koordinaten der Streckenpunkte an. Sie beziehen sich auf das den Streckenzug umgebende Rechteck.
-\\ 
 ---- ----
 ==== Arc ==== ==== Arc ====
 {{:​de:​arc.png}} Eine Arc-Komponente stellt einen Kreis- oder Ellipsenbogen dar. //​StartAngle//​ ist der Anfangswinkel,​ //Length// die Bogenlänge in Grad und //Type// gibt den Bogentyp an.  {{:​de:​arc.png}} Eine Arc-Komponente stellt einen Kreis- oder Ellipsenbogen dar. //​StartAngle//​ ist der Anfangswinkel,​ //Length// die Bogenlänge in Grad und //Type// gibt den Bogentyp an. 
-\\ 
 ---- ----
 ==== Line ==== ==== Line ====
 {{:​de:​line.png}} Eine Line-Komponente stellt eine Strecke dar. Neben der Farbe der Strecke (//​Stroke//​) gibt es einige weitere Attribute zu deren Gestaltung. {{:​de:​line.png}} Eine Line-Komponente stellt eine Strecke dar. Neben der Farbe der Strecke (//​Stroke//​) gibt es einige weitere Attribute zu deren Gestaltung.
-\\ 
 ---- ----
 ==== Text ==== ==== Text ====
 {{:​de:​text.png}} Eine Text-Komponente stellt einen Text dar. Mit \n kann man Zeilenumbrüche erzeugen. {{:​de:​text.png}} Eine Text-Komponente stellt einen Text dar. Mit \n kann man Zeilenumbrüche erzeugen.
-\\ 
 ---- ----
 ==== QuadCurve ==== ==== QuadCurve ====
 {{:​de:​quadcurve.png}} Die QuadCurve-Komponente definiert ein quadratisches parametrisches Bézier-Kurvensegment im (x, y) -Koordinatenraum. Es wird eine Kurve gezeichnet, die die angegebenen Koordinaten (startX, startY) und (endX, enfY) schneidet, wobei der angegebene Punkt (controlX, controlY) als Bézier-Steuerpunkt verwendet wird. {{:​de:​quadcurve.png}} Die QuadCurve-Komponente definiert ein quadratisches parametrisches Bézier-Kurvensegment im (x, y) -Koordinatenraum. Es wird eine Kurve gezeichnet, die die angegebenen Koordinaten (startX, startY) und (endX, enfY) schneidet, wobei der angegebene Punkt (controlX, controlY) als Bézier-Steuerpunkt verwendet wird.
-\\ 
 ---- ----
 ==== CubicCurve ==== ==== CubicCurve ====
 {{:​de:​cubiccurve.png}} Die CubicCurve-Komponente definiert ein kubisch parametrisches Bézier-Kurvensegment im (x, y) -Koordinatenraum. Es wird eine Kurve gezeichnet, die die angegebenen Koordinaten (startX, startY) und (endX, enfY) schneidet, wobei die angegebenen Punkte (controlX1, controlY1) und (controlX2, controlY2) als Bézier-Steuerpunkte verwendet werden. {{:​de:​cubiccurve.png}} Die CubicCurve-Komponente definiert ein kubisch parametrisches Bézier-Kurvensegment im (x, y) -Koordinatenraum. Es wird eine Kurve gezeichnet, die die angegebenen Koordinaten (startX, startY) und (endX, enfY) schneidet, wobei die angegebenen Punkte (controlX1, controlY1) und (controlX2, controlY2) als Bézier-Steuerpunkte verwendet werden.
-\\ 
 ---- ----
 ==== SVGPath==== ==== SVGPath====
 {{:​en:​svgpath.png}} Die SVGPath-Komponente stellt eine einfache geometrische Form dar, die durch Analysieren von SVG-Pfaddaten aus einem String erstellt wird. {{:​en:​svgpath.png}} Die SVGPath-Komponente stellt eine einfache geometrische Form dar, die durch Analysieren von SVG-Pfaddaten aus einem String erstellt wird.
-\\ 
 ---- ----
de/javafx.1545481869.txt.gz · Last modified: 2018/12/22 13:31 by roehner