inserting a data to a gridpane in another fxml file - javafx

Question

my first fxml (button) :
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<StackPane xmlns:fx="http://javafx.com/fxml" fx:controller="fxml_grid_test.fxml_gridtest_controller" >
<Button fx:id="insertBut" text="insert" onMouseClicked="#insertData"/>
</StackPane>
my second fxml (gridpane) :
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<BorderPane xmlns:fx="http://javafx.com/fxml" fx:controller="fxml_grid_test.fxml_gridtest_controller">
<top>
<GridPane fx:id="gpane">
</GridPane>
</top>
</BorderPane>
my controller :
package fxml_grid_test;
import java.io.IOException;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class fxml_gridtest_controller extends Application {
#FXML private Button insertBut;
#FXML private GridPane gpane;
#FXML private void insertData() throws IOException{
gpane.add(new Label("test"), 0, 0);
Stage primaryStage = new Stage();
Parent root = FXMLLoader.load(getClass().getResource("grid_fxml.fxml"));
Scene scene = new Scene(root, 500, 350);
primaryStage.setScene(scene);
primaryStage.show();
}
#Override
public void start(Stage primaryStage) throws Exception {
throw new UnsupportedOperationException("Not supported yet."); //To change body of generated methods, choose Tools | Templates.
}
}
my main :
package fxml_grid_test;
import java.io.IOException;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class Fxml_grid_test extends Application {
#Override
public void start(Stage primaryStage) throws IOException {
Parent root = FXMLLoader.load(getClass().getResource("button_fxml.fxml"));
Scene scene = new Scene(root, 300, 275);
primaryStage.setTitle("insert data test");
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
the idea is :
when i pressed the button, i want to insert some data to my gridpane , and then show the fxml.
both of my fxml share the controller, i feel this is the root of the problem, but i dont know how to solve it.

Answer 1

Controllers are compiled class that implement the "code behind" the object hierarchy defined by the fxml. These are useful to define methods which manipulate the UI elements and can be called by other classes, if necessary.
In your case, we need to define a controller for the grid.fxml because we want to create a method which will be responsible for adding elements to the grid.This method will be called in the MainController, which is responsible for loading grid.fxml and updating it.
FXMLLoader helps us to get an instance of the controller which is being referenced in the fxml.
So, you can have two different controllers for each of your fxml file. For the fxml with button, lets call the controller as ParentController since it is responsible for loading the sencond fxml.
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.stage.Stage;
import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
public class ParentController implements Initializable {
#FXML
private Button insertButton;
#Override
public void initialize(URL location, ResourceBundle resources) {
}
#FXML
private void insertData() throws IOException {
Stage newStage = new Stage();
FXMLLoader loader = new FXMLLoader(getClass().getResource("gridpane.fxml"));
Parent root = loader.load();
//Get controller instance from the FXMLLoader
GridPaneController controller = loader.getController();
controller.updateGridPane();
Scene scene = new Scene(root, 500, 350);
newStage.setScene(scene);
newStage.show();
}
}
As you can see, we are fetching the controller instance and then trying to call a method in the GridPaneController class.
GridPaneController controller = loader.getController();
controller.updateGridPane();
This updateGridPane() contains the logic for updating your GridPane, if you need something to be set on the GridPane, you can include parameters to the method and use them.
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Label;
import javafx.scene.layout.GridPane;
import java.net.URL;
import java.util.ResourceBundle;
public class GridPaneController implements Initializable {
#FXML private GridPane gpane;
public void updateGridPane() {
Label newLabel = new Label("test");
gpane.add(newLabel, 0, 0);
}
#Override
public void initialize(URL location, ResourceBundle resources) {
}
}
The FXML does nothing special, it just have different controllers.
grid.fxml
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.GridPane?>
<BorderPane xmlns:fx="http://javafx.com/fxml" fx:controller="fxml_grid_test.GridPaneController">
<top>
<GridPane fx:id="gpane">
</GridPane>
</top>
</BorderPane>
main.fxml
<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.StackPane?>
<StackPane xmlns:fx="http://javafx.com/fxml" fx:controller="fxml_grid_test.ParentController" >
<Button fx:id="insertButton" text="insert" onMouseClicked="#insertData"/>
</StackPane>