Not able to customize the view with Included Components in Java FX

Question

I've created one child component and and I included it in another parent component using fx:include.

The controllers for the parent and the child are instantiated well.
However, in the parent FXML, I have GridPane as the parent for the child fxml. The child fxml is added by default at (0, 0). When I want to change the view and put the child component inside a different row/column index using SceneBuilder, I am not able to drag the component into it.

I am only able to organize the components inside VBox which doesn't meet my needs.

Parent FXML:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.AnchorPane?>
<fx:root maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" type="AnchorPane" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <fx:include source="test.fxml" />
   </children>
</fx:root>

Child FXML:

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Label?>
<Label text="Label" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" />

Please try to see if you are able to play with the child view inside the parent view. For example, I am not able to put the child inside a grid view in some arbitrary place.

Answer 1

After discussion with OP, I found that the OP actually wanted to have the GridPane in the parent fxml and he wanted to place the included fxml at a particular row and column index of the GridPane. By default the SceneBuilder adds the FXML to (0,0).

This is currently not supported by the SceneBuilder.

You can however edit the FXML directly and change the rowIndex and columnIndex in there.

Parent.fxml

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.layout.GridPane?>

<GridPane xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1">
    <children>
        <fx:include source="child.fxml" GridPane.rowIndex="1" GridPane.columnIndex="1" />
    </children>
</GridPane>

---

Steps to include a FXML in SceneBuilder :

• Choose GridPane as the root layout

• Go to "Include FXML"

• Choose FXML to include

• FXML added to GridPane