...
Det viktigste å vite om FXML er at det bygger direkte på klassene, metodene og attributtene som finnes i JavaFX-rammeverket og at disse brukes som navn på XML-elementer og attributter. Hvis et element heter javafx.scene.layout.Pane, så er det en direkte referanse til JavaFX-klassen Pane-klassen, og som i Java-kode så er det støtte for å importere navn, så en kan bruke kortformen Pane. Tilsvarende så kan en sette teksten i et Text-objekt med XML-attributtet text i (Text-elementet) fordi Text-klassen har en setText-metode. Sammenhengen mellom hva som er gyldig XML og hvilke klasser, metoder og attributter som finnes i JavaFX-rammeverket er sammenfattet i en del relativt enkle regler, så hvis en kjenner JavaFX-API'et, så er det ikke så vanskelig å bli vant med FXML-formatet.
I midten under ser vi det siste eksemplet kodet som FXML, med koden for å laste den inn og knytte lyttere til textfeltet øverst til venstre.
| Code Block | ||
|---|---|---|
| ||
@Override
public void start(Stage stage) throws Exception {
URL resource = getClass().getResource(this.getClass().getSimpleName() + ".fxml");
Parent root = FXMLLoader.load(resource);
textField = (TextField) root.lookup("#textField");
centerText = (Text) root.lookup("#centerText");
textField.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent arg0) {
centerText.setText(textField.getText().toUpperCase());
}
});
textField.textProperty().addListener(new ChangeListener<String>() {
@Override
public void changed(ObservableValue<? extends String> arg0, String arg1, String arg2) {
centerText.setText(textField.getText());
}
});
Scene scene = new Scene(root);
stage.setScene(scene);
stage.setTitle("BorderPaneApplication");
stage.show();
} |
...
Under ser vi det siste eksemplet kodet som FXML.
| Code Block | ||
|---|---|---|
| ||
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.textfield.*?>
<?import javafx.scene.shape.*?>
<?import java.lang.Double?>
<BorderPane xmlns:fx="http://javafx.com/fxml"
prefHeight="500" prefWidth="500">
<top>
<TextField id="textField" text="center"/>
</top>
<center>
<Pane>
<Line startX="10" startY="10" endX="100" endY="100">
<strokeDashArray>
<Double fx:value="10"/>
<Double fx:value="10"/>
</strokeDashArray>
</Line>
<Rectangle x="150" y="10" width="30" height="40" fill="blue"/>
<Ellipse centerX="40" centerY="180" radiusX="40" radiusY="30" strokeWidth="5" fill="green" stroke="red"/>
<Text id="centerText" x="180" y="180" text="center">
<font>
<Font name="Times" size="32"/>
</font>
</Text>
</Pane>
</center>
<left>
<Text text="left"/>
</left>
<right>
<Text text="right"/>
</right>
<bottom>
<Text text="bottom"/>
</bottom>
</BorderPane> |
...
...