SplitPane

SplitPane in JavaFX is a container that divides its area into two or more resizable sections, separated by draggable dividers.

It’s very useful when you want something like:

• a sidebar + main content
• two text areas side by side
• file explorer + preview pane

Basic Example

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.SplitPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class SplitPaneExample extends Application {

    @Override
    public void start(Stage stage) {

        // Left content
        VBox leftPane = new VBox();
        leftPane.getChildren().add(new Label("Left Side"));

        // Right content
        VBox rightPane = new VBox();
        rightPane.getChildren().add(new Label("Right Side"));

        // Create SplitPane and add children
        SplitPane splitPane = new SplitPane();
        splitPane.getItems().addAll(leftPane, rightPane);

        // Optional: set initial divider position (0.3 = 30% width for left)
        splitPane.setDividerPositions(0.3);

        Scene scene = new Scene(splitPane, 400, 200);
        stage.setTitle("SplitPane Example");
        stage.setScene(scene);
        stage.show();
    }

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

Key Methods & Properties

splitPane.getItems();               // list of child nodes
splitPane.setDividerPositions(0.3); // initial divider positions (0.0 - 1.0)
splitPane.setOrientation(Orientation.VERTICAL); // vertical split instead of horizontal

• Orientation.HORIZONTAL (default): left-right split
• Orientation.VERTICAL: top-bottom split

Example: Vertical Split

SplitPane splitPane = new SplitPane();
splitPane.setOrientation(Orientation.VERTICAL);

VBox topPane = new VBox(new Label("Top"));
VBox bottomPane = new VBox(new Label("Bottom"));

splitPane.getItems().addAll(topPane, bottomPane);
splitPane.setDividerPositions(0.5); // half-half

FXML Version

<SplitPane xmlns:fx="http://javafx.com/fxml" dividerPositions="0.3">
    <items>
        <VBox>
            <children>
                <Label text="Left Side"/>
            </children>
        </VBox>
        <VBox>
            <children>
                <Label text="Right Side"/>
            </children>
        </VBox>
    </items>
</SplitPane>

Use Cases

• Sidebar + main content in apps
• Compare text files side by side
• Image preview + controls
• Any interface where the user can resize sections

Tip: You can combine SplitPane with other layouts:

SplitPane splitPane = new SplitPane();

VBox leftSidebar = new VBox(new Button("Home"), new Button("Settings"));
FlowPane rightContent = new FlowPane(); // e.g., thumbnails or monitors

splitPane.getItems().addAll(leftSidebar, rightContent);
splitPane.setDividerPositions(0.25); // 25% sidebar

This is exactly how file managers, IDEs, or dashboard apps organize their panels.