[SOLVED] How to make right node in borderpane take up whole right side

How to make right node in borderpane take up whole right side

I have an AnchorPane on right side of the BorderPane and another AnchorPane on the bottom. I was wondering the best way, with resizable kept in mind, to make the right AncorPane take up the whole right side and have the bottom AnchorPane end where the right AnchorPane starts.

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

<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.BorderPane?>


<BorderPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/10.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <bottom>
      <AnchorPane minWidth="200.0" prefHeight="45.0" prefWidth="600.0" BorderPane.alignment="CENTER" />
   </bottom>
   <right>
      <AnchorPane prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER" />
   </right>
</BorderPane>

Solution

First of all, I'd suggest using a regular Pane instead of an AnchorPane.

Then, you can put this in your code, inside of the start method.

    stage.widthProperty().addListener(event -> {
        rightPane.setPrefWidth(stage.getWidth()/2);
        rightPane.relocate(stage.getWidth()/2,0);
    });

    stage.heightProperty().addListener(event -> {
        rightPane.setPrefHeight(stage.getHeight());
    });

    root.getChildren().add(pane);

This makes a pane that takes up half of the stage, or the window, on the right side.

Then, in your fxml file, in

<bottom>
  <AnchorPane minWidth="200.0" prefHeight="45.0" prefWidth="600.0" BorderPane.alignment="CENTER" />
</bottom>
<right>
  <AnchorPane prefHeight="200.0" prefWidth="200.0" BorderPane.alignment="CENTER" />
</right>

remove all the stuff saying the position and the width of the panes.

And then, for the bottom pane, you can add to the widthProperty() and heightProperty() listeners to get this:

    stage.widthProperty().addListener(event -> {
        rightPane.setPrefWidth(stage.getWidth()/2);
        rightPane.relocate(stage.getWidth()/2,0);
        bottomPane.setPrefWidth(stage.getWidth()-rightPane.getPrefWidth());
    });

    stage.heightProperty().addListener(event -> {
        rightPane.setPrefHeight(stage.getHeight());
        bottomPane.setPrefHeight(100); // change 100 to how high you want your bottomPane to be
        //if you want your bottomPane's height to be half the height of the window use this:  bottomPane.setPrefHeight(stage.getHeight()/2);
        bottomPane.relocate(0,stage.getHeight() - bottomPane.getPrefHeight());
        bottomPane.toFront();
    });