3.06 Szene wechseln

Inhalt dieser Seite

Einleitung

Wir haben die Möglichkeit, in einer Anwendung die Szene innerhalb eines Fensters zu wechseln. Das kann zum Beispiel nützlich sein, wenn wir einen Startdialog einbauen möchten oder in unterschiedlichen Situationen verschiedene Bildschirmelemente benötigen.

Wie wir die Szene wechseln können, sehen wir uns in einem kleinen Beispiel an.

Beispiel

Unser Startbildschirm
Zuerst sehen wir dies.

Wir verwenden hier ein Anwendungsbeispiel aus einer früheren Lektion. Bevor jedoch die uns bekannte Anwendung startet, sehen wir nur einen Startbildschirm mit einem Button, der uns dann zur eigentlichen Anwendung führt.

In der Praxis könnten wir diesen Startbildschirm natürlich noch weiter ausschmücken und beispielsweise mit einer PIN-Abfrage versehen oder mit einem Textfeld den Benutzernamen abfragen.

Im Grunde ist unser Vorgehen einfach. Wir erstellen von Beginn an zwei Szenen. Eine ist wie gewohnt die Szene der Bühne beim Programmstart. Bei Klicken des Buttons wird mit der Methode setScene der Bühne die zweite Szene zugewiesen:

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Pos;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.control.ToggleButton;
import javafx.scene.layout.BorderPane;

public class MehrereSzenenFX extends Application {

    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage meineStage) throws Exception {

        // Erstellen der Komponenten und des Layouts
        meineStage.setTitle("erste Szene");

        // Button fuer erste Szene
        final Button startButton = new Button();
        startButton.setText("LOS!");

        // Layout fuer erste Szene
        BorderPane firstRoot = new BorderPane();
        firstRoot.setCenter(startButton);
        Scene firstScene = new Scene(firstRoot, 100, 60);

        // Elemente fuer zweite Szene
        final TextField meinTextField = new TextField("Name");
        final ToggleButton ersterToggleButton = new ToggleButton("Morgen");
        final ToggleButton zweiterToggleButton = new ToggleButton("Anrede");
        final Button meinButton = new Button("START");
        final Label meinLabel = new Label("");

        // Ausrichtung der Komponenten
        BorderPane.setAlignment(meinLabel, Pos.CENTER);
        BorderPane.setAlignment(ersterToggleButton, Pos.CENTER);
        BorderPane.setAlignment(zweiterToggleButton, Pos.CENTER);

        // Layout fuer zweite Szene
        final BorderPane secondRoot = new BorderPane();
        secondRoot.setCenter(meinButton);
        secondRoot.setTop(meinTextField);
        secondRoot.setLeft(ersterToggleButton);
        secondRoot.setRight(zweiterToggleButton);
        secondRoot.setBottom(meinLabel);
        final Scene secondScene = new Scene(secondRoot, 200, 100);

        // Zuerst wird erste Szene angezeigt
        meineStage.setScene(firstScene);
        meineStage.show();

        // Ereignissteuerung
        startButton.addEventHandler(ActionEvent.ACTION,
                new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent meinEvent) {
                meineStage.setScene(secondScene);
                meineStage.setTitle("zweite Szene");
            }
        });

        meinButton.addEventHandler(ActionEvent.ACTION, new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent myEvent) {
                if (ersterToggleButton.isSelected()) {
                    meinLabel.setText("Guten Morgen");
                } else {
                    meinLabel.setText("Guten Tag");
                }

                if (zweiterToggleButton.isSelected()) {
                    meinLabel.setText(meinLabel.getText() + " " + meinTextField.getText());
                }
                meinTextField.setText("");
            }
        });
    }
}

Betrachte genau die Ereignissteuerung von startButton. Dort wird die Szene gewechselt.