In JavaFx, How can I wrap the BorderPane by ScrollPane

Question

I want to make scroll by wrapping my BorderPane. I tried like this, but it doesn't work. What's my problem?

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Drawing Test");

        VBox content = new VBox(5);
        ScrollPane scroller = new ScrollPane(content);
        scroller.setFitToWidth(true);

        BorderPane root = new BorderPane();     
        initRects(root);

        content.getChildren().add(root);

        Scene scene = new Scene(new BorderPane(scroller, null, null, null, null), 400, 400);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

    void initRects(BorderPane root){
         DrawRect(root, 0);
         DrawRect(root, 100);
         DrawRect(root, 200);
         DrawRect(root, 300);
    }

    void DrawRect(BorderPane root, double y){
        Rectangle rect = new Rectangle(50, 50 + y, 900, 50);
        rect.setFill(Color.DODGERBLUE);
        root.getChildren().add(rect);
    }
}

Here is the result view.

Answer 1

A BorderPane will perform its layout calculations (including the calculations for how large it wants/needs to be) by looking at the nodes placed in the five regions top, right, bottom, left, center.

Since the rectangles are simply added directly to the border pane's list of child nodes, and are not laid out directly by the border pane at all, the border pane does not report any required size. Consequently, the scroll pane wrapping it does not know that it needs to include scroll bars.

If you want to display these rectangles, a plain Pane is a better container for them (they basically manage their own layout, so you don't want a pane that manages layout of the child nodes):

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.ScrollPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Drawing Test");

        VBox content = new VBox(5);
        ScrollPane scroller = new ScrollPane(content);
        scroller.setFitToWidth(true);

        Pane root = new Pane();     
        initRects(root);

        content.getChildren().add(root);

        Scene scene = new Scene(new BorderPane(scroller, null, null, null, null), 400, 400);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

    void initRects(Pane root){
         DrawRect(root, 0);
         DrawRect(root, 100);
         DrawRect(root, 200);
         DrawRect(root, 300);
    }

    void DrawRect(Pane root, double y){
        Rectangle rect = new Rectangle(50, 50 + y, 900, 50);
        rect.setFill(Color.DODGERBLUE);
        root.getChildren().add(rect);
    }
}

This now produces the vertical scroll bar, which is (just) required for this content.

Note that the line

scroller.setFitToWidth(true);

forces the content to be the same width as the scroll pane's viewport, so it will effectively prevent any horizontal scroll bar from being displayed (and, in this case, clip the contained pane). If you remove that, you will also see the horizontal scroll bar (which is what I suspect you want):

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.ScrollPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Drawing Test");

        VBox content = new VBox(5);
        ScrollPane scroller = new ScrollPane(content);
//        scroller.setFitToWidth(true);

        Pane root = new Pane();     
        initRects(root);

        content.getChildren().add(root);

        Scene scene = new Scene(new BorderPane(scroller, null, null, null, null), 400, 400);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }

    void initRects(Pane root){
         DrawRect(root, 0);
         DrawRect(root, 100);
         DrawRect(root, 200);
         DrawRect(root, 300);
    }

    void DrawRect(Pane root, double y){
        Rectangle rect = new Rectangle(50, 50 + y, 900, 50);
        rect.setFill(Color.DODGERBLUE);
        root.getChildren().add(rect);
    }
}