javafx
Scene Builder

Invoering

Opmerkingen

Basis JavaFX-project met FXML

Dit is een basisproject dat FXML gebruikt, gemaakt met NetBeans (Nieuw project -> JavaFX -> JavaFX FXML-toepassing). Het bevat slechts drie bestanden:

Hoofdtoepassingsklasse

package org.stackoverflow;

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

public class BasicApplication extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("BasicFXML.fxml"));

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }

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

FXML-bestand

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" xmlns:fx="http://javafx.com/fxml/1" fx:controller="org.stackoverflow.BasicFXMLController">
    <children>
        <Button layoutX="126" layoutY="90" text="Click Me!" onAction="#handleButtonAction" fx:id="button" />
        <Label layoutX="126" layoutY="120" minHeight="16" minWidth="69" fx:id="label" />
    </children>
</AnchorPane>

controleur

package org.stackoverflow;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Label;

public class BasicFXMLController {

    @FXML
    private Label label;

    public void initialize() {
        // TODO
    }   

    @FXML
    private void handleButtonAction(ActionEvent event) {
        label.setText("Hello World!");
    }

}

Rennen

Het bouwen en uitvoeren van het project moet een klein venster weergeven met een klikbare knop:

Hoe het werkt

In het kort, in de belangrijkste Application klasse, de FXMLLoader laadt basicFXML.fxml uit de pot / classpath, zoals gespecificeerd door FXMLLoader.load(getClass().getResource("BasicFXML.fxml")) .

Bij het laden van basicFXML.fxml zal de lader de naam van de controllerklasse vinden, zoals gespecificeerd door fx:controller="org.stackoverflow.BasicFXMLController" in de FXML.

Vervolgens maakt de loader een instantie van die klasse, waarin wordt geprobeerd alle objecten met een fx:id in de FXML te injecteren en worden gemarkeerd met de annotatie @FXML in de controllerklasse.

In dit voorbeeld maakt de FXMLLoader het label op basis van <Label ... fx:id="label"/> en injecteert het de @FXML private Label label; in het @FXML private Label label; .

Ten slotte, wanneer de hele FXML is geladen, roept de FXMLLoader de initialize de controller op en wordt de code die een actie-handler bij de knop registreert, uitgevoerd.

bewerken

Hoewel het FXML-bestand kan worden bewerkt binnen de IDE, wordt dit niet aanbevolen, omdat de IDE alleen standaard syntaxiscontrole en autocompletion biedt, maar geen visuele begeleiding.

De beste aanpak is om het FXML-bestand te openen met Scene Builder, waar alle wijzigingen in het bestand worden opgeslagen.

Scene Builder kan worden gestart om het bestand te openen:

Of het bestand kan rechtstreeks vanuit Scene worden geopend met Scene Builder:

• Dubbelklik vanuit NetBeans op het projecttabblad op het bestand of klik met de rechtermuisknop en selecteer Open .
• Klik vanuit IntelliJ op het projecttabblad met de rechtermuisknop op het bestand en selecteer Open In Scene Builder .
• Klik vanuit Eclipse op het projecttabblad met de rechtermuisknop op het bestand en selecteer Open with Scene Builder .

Als Scene Builder correct is geïnstalleerd en het pad is toegevoegd aan de IDE (zie Opmerkingen hieronder), wordt het bestand geopend:

Wijzigingen kunnen worden aangebracht door nieuwe containers of nieuwe besturingselementen uit de linkervensters te slepen, en eigenschappen en lay-outwaarden kunnen in de rechtervensters worden gewijzigd.

Merk op dat een van de id-tags waarmee FXML in de Java-code kan worden geïnjecteerd fx:id . Het kan worden ingesteld in de Code venster:

Nadat u de wijzigingen hebt aangebracht, slaat u het bestand op (Scene Builder -> Bestand -> Opslaan). Als er wijzigingen worden aangebracht in het bewerken van het bestand vanuit de IDE, worden deze bij het opslaan van het bestand bijgewerkt in Scene Builder.