java - 如何创建没有中心的 JavaFX BorderPane?
问题描述
我想在 JavaFX 中创建一个没有中心窗格的 BorderPane 布局。
到目前为止我写的代码只实现了左右边框,如下:
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class GUI_Practice extends Application {
@Override
public void start(Stage stage) throws Exception {
String blackBorder = "-fx-border-style: solid; -fx-border-width: 1; -fx-border-color: black";
/* Left column */
Button save = new Button("Save");
Button del = new Button("Delete");
HBox settings = new HBox(save, del);
VBox leftCol = new VBox(settings);
leftCol.setStyle(blackBorder);
/* Right column */
Button calculate = new Button("Calculate");
Button cancel = new Button("Cancel");
HBox runButtons = new HBox(calculate, cancel);
VBox rightCol = new VBox(runButtons);
rightCol.setStyle(blackBorder);
/* Set up borderpane */
BorderPane root = new BorderPane();
root.setPadding(new Insets(15));
root.setLeft(leftCol);
root.setRight(rightCol);
Scene scene = new Scene(root, 800, 600);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch();
}
}
它给出的输出如下图所示:
但是,我希望它看起来更像这样:
其中左右列的宽度相等,并占据了窗口的整个宽度。此外,列不随窗口改变宽度,所以中间的空白会随着窗口变大而变大。
我需要更改什么才能使列填充窗口的宽度?
(PS我还在学习,所以如果解决方案可以避免FXML(我还不明白),那就太好了)
编辑:根据@k88 的建议,我的启动方法现在看起来像这样:
public void start(Stage stage) throws Exception {
String blackBorder = "-fx-border-style: solid; -fx-border-width: 1; -fx-border-color: black";
Button calculate = new Button("Calculate");
Button cancel = new Button("Cancel");
HBox runButtons = new HBox(calculate, cancel);
VBox rightCol = new VBox(runButtons);
rightCol.setStyle(blackBorder);
Button save = new Button("Save");
Button del= new Button("Delete");
HBox settings = new HBox(save, load);
VBox leftCol = new VBox(settings);
leftCol.setStyle(blackBorder);
HBox root = new HBox(leftCol, rightCol);
root.setPadding(new Insets(15));
Scene scene = new Scene(root, 800, 600);
stage.setScene(scene);
stage.show();
}
给出一个看起来像这样的窗口:
解决方案
有不同的方法可以解决这个问题。
- 如果您仍想从中获得好处
BorderPane
(例如拥有顶部和底部窗格),则可以将HBox
/设置GridPane
为中心(不设置左/右)。 - 如果您不关心顶部和底部布局实现,那么正如@k88 建议的那样,您可以直接使用
HBox
或GridPane
作为根节点使用。
使用HBox
:
HBox.setHGrow(leftCol,Priority.ALWAYS);
HBox.setHGrow(rightCol,Priority.ALWAYS);
HBox root = new HBox();
root.setPadding(new Insets(15));
root.getChildren().addAll(leftCol, rightCol);
使用GridPane
:
GridPane root = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(50);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(50);
root.getColumnConstraints().addAll(col1,col2);
root.addRow(0, leftCol,rightCol);
更新:在任何一种情况下,如果您希望按钮自动拉伸,请将按钮的宽度绑定到其布局。这样你就可以控制按钮的宽度比例HBox
。
Button calculate = new Button("Calculate");
Button cancel = new Button("Cancel");
HBox runButtons = new HBox(calculate, cancel);
calculate.prefWidthProperty().bind(runButtons.widthProperty().divide(2));
cancel.prefWidthProperty().bind(runButtons.widthProperty().divide(2));
更新 2:请在下面找到示例演示。
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class Sample extends Application {
public void start(Stage stage) throws Exception {
String blackBorder = "-fx-border-style: solid; -fx-border-width: 1; -fx-border-color: black";
Button calculate = new Button("Calculate");
Button cancel = new Button("Cancel");
HBox runButtons = new HBox(calculate, cancel);
calculate.prefWidthProperty().bind(runButtons.widthProperty().divide(2));
cancel.prefWidthProperty().bind(runButtons.widthProperty().divide(2));
VBox rightCol = new VBox(runButtons);
rightCol.setStyle(blackBorder);
Button save = new Button("Save");
Button del = new Button("Delete");
HBox settings = new HBox(save, del);
save.prefWidthProperty().bind(settings.widthProperty().divide(3)); // 1/3
del.prefWidthProperty().bind(settings.widthProperty().divide(3).multiply(2)); // 2/3
VBox leftCol = new VBox(settings);
leftCol.setStyle(blackBorder);
GridPane root = new GridPane();
ColumnConstraints col1 = new ColumnConstraints();
col1.setPercentWidth(50);
ColumnConstraints col2 = new ColumnConstraints();
col2.setPercentWidth(50);
root.getColumnConstraints().addAll(col1,col2);
root.addRow(0, leftCol,rightCol);
Scene scene = new Scene(root, 800, 600);
stage.setScene(scene);
stage.show();
}
public static void main(String... a) {
Application.launch(a);
}
}
推荐阅读
- cookies - 在 Blazor 服务器端创建和读取 Cookie
- amazon-web-services - 哪种 AWS S3 加密技术为加密密钥提供轮换策略?
- python - 在 django 中添加 html 文件后出现属性错误
- parallel-processing - IPython-Parallel:找不到 ipcluster 和 ipcontroller-client.json
- java - 更改组件可见性时 Android Studio 空对象引用错误
- python - 附加在同一列表中的空列表。为什么是 [[...]] 而不是 []
- c++ - 捕获所有信号相当于捕获所有段故障?
- postgresql - 如何优化包含 INNER JOIN 的 PostgresqlSQL 查询
- python - 有没有办法在 matplotlib 的颜色图上区分非零值?
- statistics - n 个相关伯努利变量的分布是什么?