Combining JavaFX FXML Objects

Question

Exceptionally descriptive and informative answers will receive from me a reward worth 50.

I am developing an application in JavaFX, and for representations I use FXML.

<AnchorPane id="AnchorPane" fx:id="dashboard" prefHeight="400.0" prefWidth="600.0" stylesheets="@css/dashboard.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.hassanalthaf.telemart.viewmodels.DashboardViewModel"> <children> <MenuBar maxWidth="600.0" minWidth="600.0" prefWidth="600.0"> <menus> <Menu mnemonicParsing="false" text="File"> <items> <MenuItem mnemonicParsing="false" text="Close" /> </items> </Menu> <Menu mnemonicParsing="false" text="Help"> <items> <MenuItem mnemonicParsing="false" text="About" /> </items> </Menu> </menus> </MenuBar> <AnchorPane fx:id="home" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> <AnchorPane fx:id="about" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> <AnchorPane fx:id="users" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> </children> </AnchorPane> 

As you can see, this fragment contains several <AnchorPane> with the identifiers home , about , users . These are separate pages of my application. To manipulate these panels, I have to enter them into my code as follows:

 @FXML private AnchorPane home; @FXML private AnchorPane about; @FXML private AnchorPane users; 

It might look neat at the moment, but if there are more than 20 pages, it may seem a little dirty and tedious. Is there a way to group them into an array or something in a clean and efficient mode?

Answer 1

You can use fx:define and fx:reference to put items in a List and in a scene graph and enter the list to the controller:

 <AnchorPane id="AnchorPane" fx:id="dashboard" prefHeight="400.0" prefWidth="600.0" stylesheets="@css/dashboard.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.hassanalthaf.telemart.viewmodels.DashboardViewModel"> <fx:define> <!-- create panes and store them in a list --> <ArrayList fx:id="panes"> <AnchorPane fx:id="home" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> <AnchorPane fx:id="about" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> <AnchorPane fx:id="users" layoutY="29.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="371.0" prefWidth="600.0" /> </ArrayList> </fx:define> <children> <MenuBar maxWidth="600.0" minWidth="600.0" prefWidth="600.0"> <menus> <Menu mnemonicParsing="false" text="File"> <items> <MenuItem mnemonicParsing="false" text="Close" /> </items> </Menu> <Menu mnemonicParsing="false" text="Help"> <items> <MenuItem mnemonicParsing="false" text="About" /> </items> </Menu> </menus> </MenuBar> <!-- add panes in the list to scene graph --> <fx:reference source="home"/> <fx:reference source="about"/> <fx:reference source="users"/> </children> </AnchorPane> 

controller

 @FXML private List<AnchorPane> panes;