Die Anleitung zum JavaFX für den Anfänger - Hello JavaFX

View more categories:

1- Die Anforderungen

Im Dokument leite ich Sie bei der Programmierung von JavaFX auf  Eclipse IDE an

e(fx)eclipse

e(fx)clipse ist ein Package von der notwendigen Tool und Bibliothek damit Sie JavaFX programmieren. Stellen Sie sicher, dass Sie es als ein Plugin für die Eclipse installiert haben. Wenn nicht, können Sie die Anleitung bei ... lesen

JavaFX Scene Builder

JavaFX Scene Builder ist ein illustrierte Tool, damit Sie eine Interface der Applikation durch Ziehen und Ablegen schnell erstellen können. Und die Kodierung wird in der XML erstellt. Das ist ein Option zur JavaFX-Programmierung. Sie sollen es installieren 
Wenn JavaFX Scene Builder nicht installiert wird, können Sie die Anleitung bei ... leseni:

2- das Projekt Hello World erstellen

Auf die Eclipse wählen Sie
  • File/New/Others..
Das Projekt wurde erstellt
Die Kode vom Beispiel Hello World wird auch erstellt .
Zuerst stellen Sie sicher, dass Sie das Beispiel Hello World erfolgreich laufen. Klicken Sie die Rechtmaustaste auf die Klasse Main und wählen Sie 
  • Run As/Java Application
Die Applikation von Hello World läuft

3- die Erklärung des Beispiel Hello World

Oben haben Sie und erfolgreich das Beispiel Hello World JavaFX.erstellt und durchgeführt
Das Foto unten bezeichnet die Beziehung zwischen Stage, Scene, Container (der Enthalter),  Layout und die   Control:
Im  JavaFX ist  Stage hauptsachlich das Fenster der Applikation. Es hat ein Raum, der Scene heißt. Scene enthaltet die Interface-Elemente wie Button, Text ... oder die anderen Enthalter (container)....

4- JavaFX Scene Builder

Um Eine Applikationsinterface JavaFX zu erstellen, können Sie die Code mit Java ganz schreiben. Allerdings es kostet viele Zeit. JavaFX Scene Builder ist ein illustriertes Tool, damit Sie die Interface des Scene entwerfen können. Die erstellte Code ist XML Code und auf die File mit Ende fxml gespeichert 

5- Das Beispiel mit JavaFX Scene Builder

Das ist ein kleines Beispiel. Ich benutze Scene Builder um die Interface der Applikation zu machen. das Modell MVC wird für das Beispiel angewendet. Sie können das folgenden Bild anschauen 
  1. Nach dem Anschauen auf  VIEW
  2. Der Benutzer benutzt CONTROLLER
  3. die Daten bearbeiten (updatieren, ändern, löschen,..), die Daten auf MODEL haben geändert
  4. Die Daten vom MODEL auf VIEW anzeigen
Schauen Sie das Beispiel an
  • File/New/Other...
Die File MyScene.fxml wurde erstellt 
Sie können die File fxml mit  JavaFX Scene Builder öffnen.
Achtung: Stellen Sie sicher, dass Sie JavaFX Scene Builder installiert haben und es in die   Eclipse integriert
Das Bildschirm der Interface  MyScene.fxml:
Die Element liegen auf Scene:
Suche nach Button und es in die   AnchorPane ziehen
Stellen Sie ID für  Button als  "myButton", Sie können in Button aus Java Kode durch seine ID zugreifen. Setzten Sie, die Methode wird aufgeruft wenn der Button geklickt wird
Das Objekt  TextField in  AnchorPane ziehen und ableden. Stellen Sie  ID für  TextField, das in AnchorPane gezogen und abgelegt wird, als  "myTextField", Sie können in das Objekt TextField auf die Java Kode nach seinem ID
Wählen Sie  File/Save um die Änderung zu speichern. Und wählen Sie  Preview/Show Preview in Window um Ihre Design zu sehen
Das Fenster Scene Builder schließen und das Projekt auf die Eclipse refresh machen. Sie können die Kode sehen, die auf die File MyScene.fxml erstellt wird:
Das Attribute fx:controller für <AnchorPane>, Controller (der Kontrolleur) hat die Auswirkung mit Control in  AnchorPane, gegenständlich   myButton und  myTextField.
Achtung: Die Klasse  org.o7planning.javafx.MyController wird später erstellt

Controller

MyController.java
package org.o7planning.javafx;

import java.net.URL;
import java.text.DateFormat;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.ResourceBundle;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;

public class MyController implements Initializable {

   @FXML
   private Button myButton;
 
   @FXML
   private TextField myTextField;
 
   @Override
   public void initialize(URL location, ResourceBundle resources) {

       // TODO (don't really need to do anything here).
     
   }

   // When user click on myButton
   // this method will be called.
   public void showDateTime(ActionEvent event) {
       System.out.println("Button Clicked!");
     
       Date now= new Date();
     
       DateFormat df = new SimpleDateFormat("dd-MM-yyyy HH:mm:ss.SSS");
     
     
        // Model Data
        String dateTimeString = df.format(now);
       
        // Show in VIEW
        myTextField.setText(dateTimeString);
     
   }
 
}
MyApplication.java
package org.o7planning.javafx;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class MyApplication  extends Application {
   
 
    @Override
    public void start(Stage primaryStage) {
        try {
            // Read file fxml and draw interface.
            Parent root = FXMLLoader.load(getClass()
                    .getResource("/org/o7planning/javafx/MyScene.fxml"));

            primaryStage.setTitle("My Application");
            primaryStage.setScene(new Scene(root));
            primaryStage.show();
        
        } catch(Exception e) {
            e.printStackTrace();
        }
    }
   
    public static void main(String[] args) {
        launch(args);
    }
   
}
MyApplication durchführen

View more categories: