在 VBox 中实现 JavaFX 右对齐 - CSS

在 JavaFX 应用程序中，VBox 是一个常用的布局管理器。有时候我们需要在 VBox 中实现右对齐的效果，这时候我们可以使用 CSS 样式来实现。

1. VBox 的默认布局方式

默认情况下，VBox 是从上到下按顺序布局控件的，对齐方式为左对齐。

VBox vbox = new VBox();
vbox.getChildren().addAll(new Button("Button 1"), new Button("Button 2"), new Button("Button 3"));

效果如下所示：

2. 使用 CSS 实现右对齐

我们可以通过设置 VBox 的对齐方式为右对齐来实现我们的需求。

2.1 创建一个 CSS 文件

我们首先需要创建一个 CSS 文件，命名为 style.css，并将其加载到我们的应用程序中。

Scene scene = new Scene(vbox);
scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());

2.2 设置 VBox 的对齐方式

在 CSS 文件中，我们可以使用以下代码来设置 VBox 的对齐方式为右对齐。

.vbox {
    -fx-alignment: center-right;
}

在 Java 代码中，我们可以使用以下代码来设置 VBox 的样式类。

vbox.getStyleClass().add("vbox");

完整的代码如下所示：

VBox vbox = new VBox();
vbox.getChildren().addAll(new Button("Button 1"), new Button("Button 2"), new Button("Button 3"));
vbox.getStyleClass().add("vbox");

Scene scene = new Scene(vbox);
scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());

primaryStage.setScene(scene);
primaryStage.show();

效果如下所示：

3. 总结

使用 CSS 样式可以很方便地修改 JavaFX 中的 UI 控件的样式和布局。在使用 VBox 布局控件时，可以通过设置对齐方式来实现右对齐的效果。