Call FXML files from controller file

Question

Call FXML files from controller file

1.9k Views Asked by Schneeelf At 20 October 2024 at 12:44

I just facing a problem to realize a full MVC model with JavaFX. I created an easy structure in an fxml file with a split pane.

The idea is to have on the left side a tree menu and on the left side GUI elements to configure my GUI settings. To fill up the right side I wanted to load corresponding fxml files in the pane. Triggered via mouseclickevents which are realized in the Tree Items.

The problem is, I have no Idea what functions I have to use in the controller.java file to load an fxml file and to make it in visible in the right side of the split pane.

EDIT:

Here is my code:

Thats the FXML MainFrame:

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

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

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="MenuItems.Menu_Item_Controller">
   <children>
         <SplitPane dividerPositions="0.2593984962406015" layoutY="-7.0" prefHeight="600.0" prefWidth="800.0" AnchorPane.bottomAnchor="7.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="-7.0">
            <items>
                <AnchorPane fx:id="Preferences_Left" minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
                   <children>
                           <TreeView fx:id="Preference_Tree" layoutY="23.0" prefHeight="575.0" prefWidth="204.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="23.0">
                              <root>
                                    <TreeItem value="Case Full Name">
                                       <children>
                                          <TreeItem value="Test1">
                                              <children>
                                                  <TreeItem>
                                                      <value>
                                                          <Label fx:id="XML_Center_Fields" onMouseClicked="#XML_Center_Fields" prefWidth="180" text="Test" />
                                                      </value>
                                                  </TreeItem>
                                                  <TreeItem>
                                                      <value>
                                                          <CheckBox id="checkBox2" prefWidth="180.0" text="TWO" />
                                                      </value>
                                                  </TreeItem>
                                                  <TreeItem>
                                                      <value>
                                                          <CheckBox id="checkBox3" prefWidth="180.0" text="THREE" />
                                                      </value>
                                                  </TreeItem>
                                             </children>
                                           </TreeItem>
                                       </children>
                                    </TreeItem>
                              </root>
                           </TreeView>
                   </children>
                  </AnchorPane>
                <AnchorPane fx:id="Preferences_Right" minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
               <children>
                  <AnchorPane fx:id="XML_Center_Field" layoutX="64.0" layoutY="23.0" prefHeight="575.0" prefWidth="588.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="23.0">   
                  </AnchorPane>
               </children>
            </AnchorPane>
            </items>
         </SplitPane>
   </children>
</AnchorPane>

That's the FXML I want to call:

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

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

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="218.0" prefWidth="239.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Button layoutX="130.0" layoutY="122.0" mnemonicParsing="false" text="Button" />
   </children>
</AnchorPane>

And that's the controller File which uses an action from the first FXML to call the other with goal to visualize it at the right side of the split-pane.

package MenuItems;

import javafx.event.Event;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.JavaFXBuilderFactory;
import javafx.scene.Node;
import javafx.scene.Parent;
import javafx.scene.control.Label;
import javafx.scene.control.TitledPane;
import javafx.scene.control.TreeView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;

import java.io.IOException;
import java.io.InputStream;
import java.net.URL;

/**
 * Created by tkeller2 on 25.11.2014.
 */
public class Menu_Item_Controller extends Pane {
    public AnchorPane Preferences_Left;
    public TreeView Preference_Tree;
    public AnchorPane Preferences_Right;
    public AnchorPane XML_Center_Field;

    TitledPane titledPane = new TitledPane();


    public void XML_Center_Fields(Event event) throws Exception {
        final FXMLLoader fxmlLoader = new FXMLLoader( getClass().getResource( "Test.fxml"));


        fxmlLoader.setRoot(XML_Center_Field);
        fxmlLoader.setController(this);
        try {
            fxmlLoader.load();
        } catch( IOException exception) {
            throw new RuntimeException( exception);
        }

        getChildren().add(XML_Center_Field
        );
    }






}

I know it is not working. The error-message is clear:

Caused by: javafx.fxml.LoadException: Root value already specified.

But I haven't any clue. Suggestions?

thanks for the answer. I am sure it points in the right direction, but I couldn't get it running.

Please have a look to my code.

Thats the FXML MainFrame:

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

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

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="600.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="MenuItems.Menu_Item_Controller">
   <children>
         <SplitPane dividerPositions="0.2593984962406015" layoutY="-7.0" prefHeight="600.0" prefWidth="800.0" AnchorPane.bottomAnchor="7.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="-7.0">
            <items>
                <AnchorPane fx:id="Preferences_Left" minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
                   <children>
                           <TreeView fx:id="Preference_Tree" layoutY="23.0" prefHeight="575.0" prefWidth="204.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="23.0">
                              <root>
                                    <TreeItem value="Case Full Name">
                                       <children>
                                          <TreeItem value="Test1">
                                              <children>
                                                  <TreeItem>
                                                      <value>
                                                          <Label fx:id="XML_Center_Fields" onMouseClicked="#XML_Center_Fields" prefWidth="180" text="Test" />
                                                      </value>
                                                  </TreeItem>
                                                  <TreeItem>
                                                      <value>
                                                          <CheckBox id="checkBox2" prefWidth="180.0" text="TWO" />
                                                      </value>
                                                  </TreeItem>
                                                  <TreeItem>
                                                      <value>
                                                          <CheckBox id="checkBox3" prefWidth="180.0" text="THREE" />
                                                      </value>
                                                  </TreeItem>
                                             </children>
                                           </TreeItem>
                                       </children>
                                    </TreeItem>
                              </root>
                           </TreeView>
                   </children>
                  </AnchorPane>
                <AnchorPane fx:id="Preferences_Right" minHeight="0.0" minWidth="0.0" prefHeight="160.0" prefWidth="100.0">
               <children>
                  <AnchorPane fx:id="XML_Center_Field" layoutX="64.0" layoutY="23.0" prefHeight="575.0" prefWidth="588.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="23.0">   
                  </AnchorPane>
               </children>
            </AnchorPane>
            </items>
         </SplitPane>
   </children>
</AnchorPane>

That's the FXML I want to call:

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

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

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="218.0" prefWidth="239.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Button layoutX="130.0" layoutY="122.0" mnemonicParsing="false" text="Button" />
   </children>
</AnchorPane>

And that's the controller File which uses an action from the first FXML to call the other with goal to visualize it at the right side of the split-pane.

package MenuItems;

import javafx.event.Event;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.JavaFXBuilderFactory;
import javafx.scene.Node;
import javafx.scene.Parent;
import javafx.scene.control.Label;
import javafx.scene.control.TitledPane;
import javafx.scene.control.TreeView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;

import java.io.IOException;
import java.io.InputStream;
import java.net.URL;

/**
 * Created by tkeller2 on 25.11.2014.
 */
public class Menu_Item_Controller extends Pane {
    public AnchorPane Preferences_Left;
    public TreeView Preference_Tree;
    public AnchorPane Preferences_Right;
    public AnchorPane XML_Center_Field;

    TitledPane titledPane = new TitledPane();


    public void XML_Center_Fields(Event event) throws Exception {
        final FXMLLoader fxmlLoader = new FXMLLoader( getClass().getResource( "Test.fxml"));


        fxmlLoader.setRoot(XML_Center_Field);
        fxmlLoader.setController(this);
        try {
            fxmlLoader.load();
        } catch( IOException exception) {
            throw new RuntimeException( exception);
        }

        getChildren().add(XML_Center_Field
        );
    }






}

I know it is not working. The error-message is clear:

Caused by: javafx.fxml.LoadException: Root value already specified.

But I haven't any clue. Suggestions?

Original Q&A

There are 1 best solutions below

**Roland** · Answer 1

I do it like this:

public class Task extends Pane {

    TitledPane titledPane;

    public Task() {

        final FXMLLoader fxmlLoader = new FXMLLoader( getClass().getResource( "Task.fxml"));

        titledPane = new TitledPane();

        fxmlLoader.setRoot( titledPane);
        fxmlLoader.setController( this);
        try {
          fxmlLoader.load();
        } catch( IOException exception) {
          throw new RuntimeException( exception);
        }

        getChildren().add( titledPane);

    }

  ...

}

Task is just a custom TitledPane object that's created via fxml. I put several of these Task objects on a scene.

I'm not sure if this is the currently proper way for JavaFX 8, but it works.

Call FXML files from controller file

There are 1 best solutions below

Related Questions in JAVA

Related Questions in JAVAFX

Related Questions in FXML

Related Questions in FXMLLOADER

Trending Questions

Popular # Hahtags

Popular Questions