java - 如何根据单个节点的位置对齐 GridPane？

Question

说我有一个场景。我有一个网格窗格，其中包含 2 x 2 按钮。我可以通过简单地将整个网格窗格完全对齐在中心，gridPane.setAlignment(Pos.CENTER);但是我希望将整个网格窗格定位在一个节点的位置上。

这是一个插图： 整个网格窗格居中对齐。我想要的是r2 c1精确地设置在中心的位置，我希望其他三个节点分别位于它的上方和旁边。我可以定位一个按钮，但我不知道如何根据一个节点的位置定位整个网格窗格。

这是我为插图编写的代码：

    private BorderPane root = new BorderPane();
    private Scene scene = new Scene(root, 1366, 768);

    @Override
    public void start(Stage primaryStage) {
        GridPane gridPane = new GridPane();
        gridPane.addRow(0, new Button("r1 c1"), new Button("r1 c2"));
        gridPane.addRow(1, new Button("r2 c1"), new Button("r2 c2"));
        gridPane.setVgap(20);
        gridPane.setHgap(30);
        gridPane.setAlignment(Pos.CENTER);
        root.setCenter(gridPane);

        primaryStage.setTitle("Test");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

r2c1 节点应恰好位于中间，其余按钮应根据其位置定位。这是所需的视图： r2c1 正好从屏幕中心开始，其他节点相应地移动。

任何帮助将不胜感激。

标签： javajavafx

Answer 1

“将整个 GridPane 作为一个整体移动”需要更改GridPane其父级中的布局方式（而不是其GridPane自身的内部布局）。
有几种方法可以实现它。操作父布局就是其中之一。
将翻译设置GridPane为另一个：

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

public class FxMain extends Application {

    private static final int VGAP = 20, HGAP = 30;

    @Override
    public void start(Stage primaryStage) {

        GridPane gridPane = new GridPane();
        Button button1 = new Button("r1 c1");
        gridPane.addRow(1, button1, new Button("r1 c2"));
        gridPane.addRow(2, new Button("r2 c1"), new Button("r2 c2"));
        gridPane.setVgap(VGAP); gridPane.setHgap(HGAP);
        gridPane.setAlignment(Pos.CENTER);
        //apply row-height + vgap down translate (row height represented by
        //button height)
        gridPane.translateYProperty().bind(button1.heightProperty().add(VGAP));

        BorderPane root = new BorderPane();
        Scene scene = new Scene(root, 200, 200);
        root.setCenter(gridPane);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

---

编辑：澄清所需的布局后：
该技术是相似的。将 括GridPane起来AnchorPane并应用所需的翻译：

public class FxMain extends Application {

    private static final int VGAP = 20, HGAP = 30;

    @Override
    public void start(Stage primaryStage) {

        GridPane gridPane = new GridPane();
        AnchorPane root = new AnchorPane(gridPane); //enclose grid in an AnchorPane
        gridPane.addRow(1, new Button("r1 c1"), new Button("r1 c2"));
        gridPane.addRow(2, new Button("r2 c1"), new Button("r2 c2"));
        gridPane.setVgap(VGAP); gridPane.setHgap(HGAP);

        //apply y translation: (root height/2)  minus grid pane height
        gridPane.translateYProperty().bind(root.heightProperty().divide(2).subtract(gridPane.heightProperty()));
        //apply x translation of root widt / 2
        gridPane.translateXProperty().bind(root.widthProperty().divide(2));

        Scene scene = new Scene(root, 400, 400);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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