You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Java BorderPane仅显示左右等分区域实现方案咨询

实现双时钟等分全屏布局的几种方法

针对你想让两个时钟完全等分屏幕、无空白显示的需求,其实有几个比BorderPane更合适的布局选择,当然也可以调整BorderPane的配置来实现,下面给你详细说明:

方法1:使用SplitPane(最省心的选择)

SplitPane天生就是用来分割区域的,默认就能让左右(或上下)区域均分,而且还支持拖拽调整(如果不需要拖拽可以禁用),完美匹配你的需求。

示例代码大概是这样:

// 假设你的时钟组件是Clock类
Clock clock1 = new Clock("北京");
Clock clock2 = new Clock("纽约");

SplitPane splitPane = new SplitPane();
splitPane.getItems().addAll(clock1, clock2);
// 强制设置为50%均分,禁用拖拽调整(如果不需要用户改变比例)
splitPane.setDividerPosition(0, 0.5);
splitPane.setResizableWithParent(clock1, true);
splitPane.setResizableWithParent(clock2, true);

// 把SplitPane作为主容器放到场景中
Scene scene = new Scene(splitPane, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();

方法2:用GridPane实现严格等分

GridPane可以创建1行2列的布局,然后给每列设置相同的权重,这样它们会自动均分宽度,高度也会铺满整个容器。

示例代码:

Clock clock1 = new Clock("伦敦");
Clock clock2 = new Clock("东京");

GridPane gridPane = new GridPane();
// 创建1行2列,每列权重设为1,确保均分宽度
ColumnConstraints col1 = new ColumnConstraints();
col1.setHgrow(Priority.ALWAYS);
col1.setFillWidth(true);
ColumnConstraints col2 = new ColumnConstraints();
col2.setHgrow(Priority.ALWAYS);
col2.setFillWidth(true);
gridPane.getColumnConstraints().addAll(col1, col2);

// 添加时钟到对应单元格
gridPane.add(clock1, 0, 0);
gridPane.add(clock2, 1, 0);

// 设置时钟占满单元格的宽高
GridPane.setFillWidth(clock1, true);
GridPane.setFillHeight(clock1, true);
GridPane.setFillWidth(clock2, true);
GridPane.setFillHeight(clock2, true);

Scene scene = new Scene(gridPane, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();

方法3:调整BorderPane的配置(如果你坚持用BorderPane)

如果你不想换布局,也可以修改BorderPane的约束,让left和right区域占满整个宽度,并且均分:

Clock clock1 = new Clock("巴黎");
Clock clock2 = new Clock("悉尼");

BorderPane borderPane = new BorderPane();
borderPane.setLeft(clock1);
borderPane.setRight(clock2);

// 关键:设置时钟组件支持缩放,并监听窗口宽度变化强制均分
clock1.setPrefWidth(Double.MAX_VALUE);
clock2.setPrefWidth(Double.MAX_VALUE);
clock1.setPrefHeight(Double.MAX_VALUE);
clock2.setPrefHeight(Double.MAX_VALUE);

borderPane.widthProperty().addListener((obs, oldVal, newVal) -> {
    double halfWidth = newVal.doubleValue() / 2;
    clock1.setPrefWidth(halfWidth);
    clock2.setPrefWidth(halfWidth);
});

Scene scene = new Scene(borderPane, 800, 600);
primaryStage.setScene(scene);
primaryStage.show();

这里要注意:你的Clock组件内部的布局要支持缩放,比如如果Clock的根是BorderPane,要确保内部元素(比如时间文本)可以随容器自适应,或者设置合适的对齐方式。

个人最推荐SplitPane,因为它内置了均分逻辑,不需要自己写监听,代码最简洁,而且默认就支持响应式缩放。

内容的提问来源于stack exchange,提问作者haoHaoMinho

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.25 03:59:58