how to load a pane from a different controller into a vbox in the center pane

I have a borderpane with buttons in the TopPane to load views into the leftpane of the borderpane then upon loading the leftpane a button to load a view into a vbox in the centerpane

Main.java

public class Main extends Application {
    @Override
    public void start(Stage stage) throws Exception{
        //this is to load the parent (borderpane)

        FXMLLoader loader = new FXMLLoader(getClass().getResource("/Views/fxml/main.fxml"));
        
        //this is to create a controller for the parent view

        loader.setController(new MainController());
        
        Parent root = loader.load();
        
        Scene scene = new Scene(root);
        stage.setScene(scene);
        stage.show;
        
        /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }
    
    }
    
}

then the Main MainController.java

public class MainController implements Initializable {
    
    @FXML
    protected BorderPane borderPane;

    // This is a VBox occupying the Centerpane of the Borderpane

    @FXML
    protected VBox centerPane;

public MainController(){         
         }
     
    @Override
    public void initialize(URL url, ResourceBundle rb) {
        
                }    

// This loads the layout1 into the left pane of the borderpane from button handler inside the Top pane

    @FXML
    private void showLayout1(ActionEvent event) throws IOException {
        FXMLLoader loader = new FXMLLoader();
        loader.setLocation(getClass().getResource( "/Views/fxml/Layout1.fxml"));
        loader.setController(new Controller1());
        leftPane.getChildren().clear();
        leftPane.getChildren().add(loader.load());
     }
    
}

Layout1Controller.java

public class Layout1Controller implements Initializable{
    private MainController app;
    
    @Override
    public void initialize(URL url, ResourceBundle rb){        
    }
    
    @FXML
    private void ShowLayout2(ActionEvent event) throws IOException{
        FXMLLoader loader2 = new FXMLLoader();
        loader2.setLocation(getClass().getResource("/Views/fxml/Layout2.fxml"));
       loader2.setController(new Controller2());

// This is returning a null causing a java.lang.NullPointerException
           app.centerPane.getChildren().clear();      
           app.centerPane.getChildren().add(loader2.load());  

        }
    }
}

Main.fxml

<BorderPane fx:id="border_pane" prefHeight="650.0" prefWidth="1018.0" style=" type="BorderPane" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
   <left>
      <VBox fx:id="leftPane" alignment="CENTER" prefHeight="569.0" prefWidth="215.0"  />
   </left>
   <center>
      <VBox fx:id="centerPane" alignment="CENTER" prefHeight="586.0" prefWidth="701.0"  BorderPane.alignment="CENTER">
      </VBox>
   </center>
   <top>
      <HBox prefHeight="81.0" prefWidth="876.0" >
<children>
     <Button fx:id="btnSGRE" mnemonicParsing="false" onAction="#ShowLayout1" prefHeight="26.0" prefWidth="151.0" style="-fx-background-color: transparent;" text="REVENUE ENTRIES" textFill="#11124a">
  <font>
     <Font name="Century" size="13.0" />
    </font>
         </Button>
     </children>
        </HBox>
   </top>
</BorderPane>

Layout1.fxml

<AnchorPane prefHeight="565.0" prefWidth="215.0"  xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" >
   <children>
      <VBox alignment="BASELINE_CENTER" layoutY="40.0" prefHeight="415.0" prefWidth="215.0" >
         <children>
            <Text strokeType="OUTSIDE" strokeWidth="0.0" text="Revenue Entries">
               <font>
                  <Font name="System Bold" size="18.0" />
               </font>
            </Text>
            <HBox alignment="BASELINE_CENTER" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="35.0" prefWidth="173.0" >
               <children>
                  <ComboBox fx:id="cmbRevGroup" onAction="#setCenters" prefHeight="35.0" prefWidth="195.0" promptText="Main Revenue Centers"/>
               </children>
            </HBox>
            <HBox alignment="BASELINE_CENTER" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="35.0" prefWidth="173.0">
               <children>
                  <ComboBox fx:id="cmbRevCent" onAction="#SelectedCenter" prefHeight="35.0" prefWidth="195.0" promptText="Revenue Centers"/>
     <Button  mnemonicParsing="false" onAction="#ShowLayout2" prefHeight="43.0" prefWidth="142.0"  text="Revenue Entries" />
               </children>
            </HBox>
         </children>
      </VBox>
</AnchorPane>

Now when I access the VBox, centerPane in mainController from Controller1 it gives me a nullpointer error So please any help on how to load layout2 into the centerPane from Controller1

Okay so finally it was able to get the centerPane to load layout2.fxml. So all I had to do was create a get method for the centerPane pass the MainController when creating Layout1Controller in ShowLayout1

MainController code:

public class MainController implements Initializable {
    
@FXML
protected BorderPane borderPane;
    // This is a VBox occupying the Centerpane of the Borderpane

@FXML
private VBox centerPane;
 
public VBox getCenterPane(){
         return centerPane;
     }

public MainController(){         
         }
     
    @Override
    public void initialize(URL url, ResourceBundle rb) {
        
                }    

// This loads the layout1 into the left pane of the borderpane from button handler inside the Top pane

    @FXML
    private void showLayout1(ActionEvent event) throws IOException {
        FXMLLoader loader = new FXMLLoader();
        loader.setLocation(getClass().getResource( "/Views/fxml/Layout1.fxml"));
        loader.setController(new Controller1());
        Layout1Controller controller = (Layout1Controller)loader.getController();
        controller.setMainController(this);
        leftPane.getChildren().clear();
        leftPane.getChildren().add(loader.load());
     }
    
}

Layout1Controller code:

public class Layout1Controller implements Initializable{
    private MainController app;
    public void setMainController(MainController app){
         this.app = app;
     }
    @Override
    public void initialize(URL url, ResourceBundle rb){        
    }
    
    @FXML
    private void showLayout2(ActionEvent event) throws IOException{
        FXMLLoader loader2 = new FXMLLoader();
        loader2.setLocation(getClass().getResource("/Views/fxml/Layout2.fxml"));
       loader2.setController(new Controller2());

// This is returning a null causing a java.lang.NullPointerException
           app.getCenterPane().getChildren().clear();      
           app.getCenterPane().getChildren().add(loader2.load());  

        }
    }
}