JavaFX fxml files wechseln

[elidor]

Hallo

Ich möchte bei JavaFX auf einen Knopfdruck reagieren, indem ich eine andere fxml Datei in mein Fenster lade. Eine einzige FXML Datei anzuzeigen und dort auf Eingaben und Knöpfe zu reagieren ist kein Problem, allerdings weiß ich nicht, wie ich jetzt auf die nächste Seite kommen soll. Da mein Projekt keine aufwändigen Grafiken hat, kann das gerne auch alles gleichzeitig geladen sein.

Bisher lade ich meine FXML Dateien so:

private Stage stage;

    @Override
    public void start(Stage primaryStage) throws Exception {
        stage = primaryStage;
        Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
        stage.setScene(new Scene(root));
        primaryStage.show();

    }

Vielleicht hat jemand von euch auch ein einfaches Beispielprogramm, indem 2 fxml Dateien sind, in der einen ein Knopf mit "Button 1" und in der anderen mit "Button 2" und beim betätigen der Knöpfe wechseln die Seiten...


Danke im Vorraus
elidor

 

[knilch]

Hi,
Nachfolgend mal ein Beispiel:

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

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        try {           
            final FXMLLoader loader = new FXMLLoader(getClass().getResource("Fxml1.fxml"));
            final Parent root = (Parent) loader.load();
            Scene scene = new Scene(root);
            primaryStage.setTitle("FXML-Test V1.0");
            primaryStage.setScene(scene);           
            primaryStage.show();
        } catch(Exception e) {
            e.printStackTrace();
        }
    }
    public static void main(String[] args) {
        launch(args);
    }
}

FXML-Controller:

package application;
import java.io.IOException;
import javafx.application.Platform;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.Node;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;

public class FxmlController {
    private Node node;
    private Stage stage;
    private Scene scene;
    private FXMLLoader fxmlLoader;
    private Parent root;
   
    @FXML AnchorPane mainAnchorPane;
    @FXML Button exitBtn;
    @FXML Button newLayoutBtn;
    @FXML Button oldLayoutBtn;   
   
    @FXML
    protected void handleExitBtnEvent(ActionEvent event) {
        Platform.exit();
    }
   
    @FXML
    protected void handleNewLayoutBtnEvent(ActionEvent event) {
        try {
            node = (Node) event.getSource();
            stage = (Stage) node.getScene().getWindow();
            scene = stage.getScene();
            fxmlLoader = new FXMLLoader(getClass().getResource("Fxml2.fxml"));
            root = (Parent) fxmlLoader.load();
            scene.setRoot(root);
        } catch (IOException e) {
            e.printStackTrace();
        }         
    }
   
    @FXML
    protected void handleBackToOldLayoutBtnEvent(ActionEvent event) {
        try {
            node = (Node) event.getSource();
            stage = (Stage) node.getScene().getWindow();
            scene = stage.getScene();
            fxmlLoader = new FXMLLoader(getClass().getResource("Fxml1.fxml"));
            root = (Parent) fxmlLoader.load();
            scene.setRoot(root);
        } catch (IOException e) {
            e.printStackTrace();
        }     }
   
   
    @FXML
    protected void handleNewBtnEvent(ActionEvent event) {
        System.out.println("Du hast den neuen Button gedrückt.");
    }
}

FXML1:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.control.Button?>

<AnchorPane fx:id="mainAnchorPane" prefHeight="200.0" prefWidth="400.0" xmlns:fx="http://javafx.com/fxml/1"
    xmlns="http://javafx.com/javafx/2.2" fx:controller="application.FxmlController">
    <Button fx:id="newLayoutBtn" text="neues Layout" layoutX="10" layoutY="20" onAction="#handleNewLayoutBtnEvent"/>
    <Button fx:id="exitBtn" text="Exit" layoutX="350" layoutY="170" onAction="#handleExitBtnEvent"/>
</AnchorPane>

FXML2:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.control.Button?>

<AnchorPane fx:id="mainAnchorPane" prefHeight="200.0" prefWidth="400.0" xmlns:fx="http://javafx.com/fxml/1"
    xmlns="http://javafx.com/javafx/2.2" fx:controller="application.FxmlController">
    <Button fx:id="oldLayoutBtn" text="zurück zum alten Layout" layoutX="10" layoutY="20" onAction="#handleBackToOldLayoutBtnEvent"/>
    <Button fx:id="newBtn" text="Ich bin ein neuer Button" layoutX="10" layoutY="50" onAction="#handleNewBtnEvent"/>
    <Button fx:id="exitBtn" text="Exit" layoutX="350" layoutY="170" onAction="#handleExitBtnEvent"/>
</AnchorPane>

Du kannst nun die Beispiele oben so anpassen, wie es dir passt.

 

[elidor]

Perfekt, ich danke dir!

Falls noch jemand dieses Problem hat:

Ich habe erst versucht diesen Quelltest 1:1 in Netbeans zu übernehmen. Das hat nur Fehler gebracht.
Letztendlich war nach 2h Suchen die Lösung das einfach in IntelliJ zu kopieren... Wie das mit Eclipse aussieht kann ich leider nicht sagen, mit IntelliJ hats auf Anhieb funktioniert

 

[dzim]

In Ecllipse "musst" du e(fx)clipse nutzen (wenn du das Tooling möchtest/benötigst). Ich verwende es derzeit für meine Entwicklung, verzichte aber auch komplett auf den SceneBuilder und verwende die FXGraph-DSL (JSON-ähnliche DSL, die dann durch das Plugin in FXML übersetzt wird). Finde ich in Kombination mit dem Live Preview-View (wenn gewünscht, inkl. derController) einfach am Effektivsten.

 

[mdcelebi]

Es klappt wunderbar auch mit eclipse.
Man sollte nur bei der FXML Dateien, wenn man kopiert und ersetzt die Zeilen mit [XML] und am ende [/XML] nicht mit kopieren. Danch läuft es gleich.

Danke knilch, das diese Beitrag geschrieben hat.