Руководство JavaFX AnchorPane Layout

AnchorPane Layout
Пример с AnchorPane
Дизайн AnchorPanel с Scene Builder

1. AnchorPane Layout

AnchorPane это контейнер (container), довольно похож на BorderPane. BorderPane разделяет его поверхность на 5 отдельных областей, чтобы расположить туда подкомпоненты, когда AnchorPane разделяет его поверхность на 5 областей чтобы поставить анкор (anchor) подкомпонента, заметьте, что 5 областей AnchorPane это всего лишь 5 логических областей, это не настоящие 5 областей.

Подкомпонент находящийся в AnchorPane может поставить анкор (anchor) в один или более логическиъ областей AnchorPane.

Изображение ниже иллюстрирует подкомпонент в AnchorPane, закрепленный на левой и правой стороне AnchorPane. И когда AnchorPane меняет длину (width), длина подкомпонента так же меняется.

Подкомпонент может быть закреплен анкором (anchor) с 4-х сторон AnchorPane:

2. Пример с AnchorPane

BorderPaneDemo.java

package org.o7planning.javafx.anchorpane;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;

public class AnchorPaneDemo extends Application {

   @Override
   public void start(Stage primaryStage) throws Exception {
       AnchorPane root = new AnchorPane();
       Button button1 = new Button("(B1) Top + Left + Right");

       Button button2 = new Button("(B2) Top + Left + Right");
       Button button3 = new Button("(B3) Top + Left + Right");

       Button button4 = new Button("(B4) Top + Left + Right + Bottom");

       // (B1) Anchor to the Top + Left + Right
       AnchorPane.setTopAnchor(button1, 40.0);
       AnchorPane.setLeftAnchor(button1, 50.0);
       AnchorPane.setRightAnchor(button1, 70.0);

       // (B2) Anchor to the Top + Left + Right
       AnchorPane.setTopAnchor(button2, 90.0);
       AnchorPane.setLeftAnchor(button2, 10.0);
       AnchorPane.setRightAnchor(button2, 320.0);

       // (B3) Anchor to the Top + Left + Right
       AnchorPane.setTopAnchor(button3, 100.0);
       AnchorPane.setLeftAnchor(button3, 250.0);
       AnchorPane.setRightAnchor(button3, 20.0);

       // (B4) Anchor to the four sides of AnchorPane
       AnchorPane.setTopAnchor(button4, 150.0);
       AnchorPane.setLeftAnchor(button4, 40.0);
       AnchorPane.setRightAnchor(button4, 50.0);
       AnchorPane.setBottomAnchor(button4, 45.0);

       // Add buttons to AnchorPane
       root.getChildren().addAll(button1, button3, button2, button4);

       Scene scene = new Scene(root, 550, 250);

       primaryStage.setTitle("AnchorPane Layout Demo (o7planning.org)");
       primaryStage.setScene(scene);
       primaryStage.show();
   }

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

}

Запуск примера: