Benutzer-Werkzeuge

Webseiten-Werkzeuge


de:javafx

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen RevisionVorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
Nächste ÜberarbeitungBeide Seiten der Revision
de:javafx [2017/07/18 13:28] – [FileChooser] roehnerde:javafx [2018/12/22 13:32] – [FileChooser] roehner
Zeile 1: Zeile 1:
 =====JavaFX===== =====JavaFX=====
-JavaFX wird ab 22.02.2017 vom Java-Editor unterstützt. Die Entwicklung dieser neuen grafischen Benutzeroberfläche für den Java-Editor hat viele Monate in Anspruch genommen. Mit dem ersten Erscheinen in Version 14.00 ist von einem längeren Zeitraum auszugehen, in dem eine Fehlerbereinigung stattfinden muss. Der neu entwickelte Programmcode ist so umfangreich, dass trotz vieler Tests noch einige Fehler darauf warten, beseitigt zu werden. +JavaFX wird ab Version 14.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.
- +
-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. 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.
Zeile 34: Zeile 32:
 \\ \\
 ---- ----
- 
 ==== NumberField ==== ==== NumberField ====
 {{:de:Jnumberfieldicon.png}} {{:de:Jnumberfieldicon.png}}
Zeile 64: Zeile 61:
 ---- ----
 ==== Button ==== ==== Button ====
-{{:de:Jbuttonicon.png}} +{{:de:jbuttonicon.png}}
 Klickt man in einem GUI-Formular eine Button-Komponente an so wird die zum Button gehörende Ereignismethode ausgeführt. Klickt man in einem GUI-Formular eine Button-Komponente an so wird die zum Button gehörende Ereignismethode ausgeführt.
  
-Jede Button-Komponente erhält automatisch eine Ereignismethode für das Ereignis, das beim Anklicken eines Buttons erzeugt wird+Jede Button-Komponente erhält automatisch eine Ereignismethode für das Anklicken des Buttons. 
  
 Beispiel: Beispiel:
Zeile 79: Zeile 75:
 Gibt man im Objekt-Inspektor im Attribut //Text// die Beschriftung eines Buttons ein, so wird automatisch ein passender Name für den Button erzeugt. Gibt man im Objekt-Inspektor im Attribut //Text// die Beschriftung eines Buttons ein, so wird automatisch ein passender Name für den Button erzeugt.
 ---- ----
- 
 ==== CheckBox ==== ==== CheckBox ====
 {{:de:Jcheckboxicon.png}} {{:de:Jcheckboxicon.png}}
Zeile 87: Zeile 82:
 {{:de:isselectedde.png}} {{:de:isselectedde.png}}
 <code java>  if (MeineCheckBox.isSelected()) ...</code> <code java>  if (MeineCheckBox.isSelected()) ...</code>
-\\ 
 \\ \\
 ---- ----
- 
 ==== RadioButton & ToggleGroup ==== ==== RadioButton & ToggleGroup ====
 {{:de:radiobuttonde.png}} {{:de:radiobuttonde.png}}
Zeile 106: Zeile 99:
 \\ \\
 ---- ----
- 
 ==== ListView ==== ==== ListView ====
 {{:de:list.png}} {{:de:list.png}}
Zeile 159: Zeile 151:
 \\ \\
 ---- ----
- 
 ==== Spinner ==== ==== Spinner ====
 {{:de:jspinner.png}} {{:de:jspinner.png}}
Zeile 170: Zeile 161:
 \\ \\
 ---- ----
- 
- 
- 
- 
- 
 ==== Canvas ==== ==== Canvas ====
 {{:de:canvas.png}} {{:de:canvas.png}}
Zeile 189: Zeile 175:
  
 <code java>  gc.strokeLine(40, 10, 10, 40);</code> <code java>  gc.strokeLine(40, 10, 10, 40);</code>
-\\ 
 ---- ----
- 
 ==== Turtle ==== ==== Turtle ====
- 
 {{:de:fxturtle.png}} {{:de:fxturtle.png}}
  
Zeile 202: Zeile 185:
 Beispiel: Beispiel:
 {{:de:turtlesetorigin.png}} {{:de:turtlesetorigin.png}}
-\\ 
 ---- ----
- 
 ==== MenuBar ==== ==== MenuBar ====
 {{:de:menubardemo.png}} {{:de:menubardemo.png}}
Zeile 211: Zeile 192:
 \\ \\
 ---- ----
- 
 ==== Menu ==== ==== Menu ====
 {{:de:jmenudemo.png}} {{:de:jmenudemo.png}}
Zeile 218: Zeile 198:
  
 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 ====
 {{:de:contextmenude.png}}   {{:de:contextmenude.png}}  
Zeile 233: Zeile 211:
  
 {{:de:contextmenude2.png}}   {{:de:contextmenude2.png}}  
- 
-\\ 
 ---- ----
- 
- 
 ==== MenuButton ==== ==== MenuButton ====
 {{:de:menubutton.png}} Mit einer MenuButton-Komponente kann man ein Kontextmenü öffnen.  {{:de:menubutton.png}} Mit einer MenuButton-Komponente kann man ein Kontextmenü öffnen. 
  
 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.
- 
 \\ \\
 ---- ----
Zeile 249: Zeile 222:
  
 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.
- 
 \\ \\
 ---- ----
Zeile 261: Zeile 233:
   double value = slider1.getValue();   double value = slider1.getValue();
 </code> </code>
- 
-\\ 
 ---- ----
- 
 ==== ProgressBar==== ==== ProgressBar====
 {{:de:progressbar.png}} Mit einer ProgressBar-Komponente kann man den Fortschritt einer Operation im Bereich 0 bis 1 als horizontalen Balken anzeigen. {{:de:progressbar.png}} Mit einer ProgressBar-Komponente kann man den Fortschritt einer Operation im Bereich 0 bis 1 als horizontalen Balken anzeigen.
Zeile 271: Zeile 240:
   progressBar1.setProgress(0.3);   progressBar1.setProgress(0.3);
 </code> </code>
- 
 \\ \\
 ---- ----
- 
 ==== ProgressIndicator==== ==== ProgressIndicator====
 {{:de:progressindicator.png}} Mit einer ProgressIndicator-Komponente kann man den Fortschritt einer Operation im Bereich 0 bis 1 als Kreisausschnitt anzeigen. {{:de:progressindicator.png}} Mit einer ProgressIndicator-Komponente kann man den Fortschritt einer Operation im Bereich 0 bis 1 als Kreisausschnitt anzeigen.
Zeile 281: Zeile 248:
   progressIndicator1.setProgress(0.75);   progressIndicator1.setProgress(0.75);
 </code> </code>
- 
 \\ \\
 ---- ----
- 
 ==== ToolBar==== ==== ToolBar====
 {{:de:toolbar.png}} Mit einer ToolBar-Komponente kann man mehrere Buttons und Separators zusammen fassen. {{:de:toolbar.png}} Mit einer ToolBar-Komponente kann man mehrere Buttons und Separators zusammen fassen.
Zeile 292: Zeile 257:
 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====
 {{:de:togglebutton.png}} Eine ToggleButton-Komponente kann wie ein Schalter auf //ein// oder //aus// stehen. {{:de:togglebutton.png}} Eine ToggleButton-Komponente kann wie ein Schalter auf //ein// oder //aus// stehen.
Zeile 308: Zeile 269:
     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====
 {{:de:htmleditor.png}}  {{:de:htmleditor.png}} 
Zeile 336: Zeile 289:
 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.
  
Zeile 353: Zeile 302:
 Color c = colorPicker1.getValue(); Color c = colorPicker1.getValue();
 </code> </code>
- 
-\\ 
 ---- ----
- 
 ==== DatePicker==== ==== DatePicker====
 {{:de:datepicker.png}}\\ {{:de:datepicker.png}}\\
Zeile 364: Zeile 310:
 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====
 {{:de:filechooser.png}} Mit einer FileChooser-Komponente kann man eine Datei auswählen. {{:de:filechooser.png}} Mit einer FileChooser-Komponente kann man eine Datei auswählen.
Zeile 390: Zeile 332:
 File f = fileChooser1_openFile(); File f = fileChooser1_openFile();
 </code> </code>
- 
-\\ 
 ---- ----
- 
 ==== FileChooser==== ==== FileChooser====
 {{:de:filechooser2.png}} Mit einer FileChooser-Komponente kann man eine Datei auswählen. {{:de:filechooser2.png}} Mit einer FileChooser-Komponente kann man eine Datei auswählen.
Zeile 410: Zeile 349:
 File f = fileChooser1_saveFile(); File f = fileChooser1_saveFile();
 </code> </code>
- 
-\\ 
 ---- ----
- 
 ==== DirectoryChooser==== ==== DirectoryChooser====
 {{:de:directorychooser.png}} Mit einer DirectoryChooser-Komponente kann man einen Ordner auswählen. {{:de:directorychooser.png}} Mit einer DirectoryChooser-Komponente kann man einen Ordner auswählen.
Zeile 430: Zeile 366:
 File d = directoryChooser1_openDirectory(); File d = directoryChooser1_openDirectory();
 </code> </code>
 +\\
 +----
 +==== ImageView====
 +{{:de:imageview.png}} Mit einer ImageView-Komponente kann man ein Bild (//Image//) anzeigen.
 +\\
 +----
 +==== MediaView====
 +{{:de:mediaview.png}} Mit einer MediaView-Komponente kann man ein Video mit dem MediaPlayer anzeigen.
 +\\
 +----
 +==== TableView====
 +{{:de:tableview.png}} Mit einer TableView-Komponente kann man eine Tabelle anzeigen.
  
 +Im Attribut //GenericType// gibt man den Typ der darzustellenden Zeilen an. 
 +Im Attribut //tableView1Items// werden die in der Tabelle anzuzeigenden Daten gespeichert.
 \\ \\
 ---- ----
- 
- 
 =====JavaFX Shapes===== =====JavaFX Shapes=====
  
Zeile 450: Zeile 398:
  
 </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 ====
 +{{: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 ====
 +{{: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====
 +{{: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.txt · Zuletzt geändert: 2023/02/25 20:07 von roehner