如何让JavaFX中RichText的CodeArea实现响应式布局？

问题根源分析 #

布局失效的核心原因在于多层容器的空间分配逻辑错误：

• FXML中editorContainer（VBox）被包裹在HBox中，但未配置HBox的空间增长规则，导致editorContainer无法随窗口宽度拉伸
• 手动绑定VirtualizedScrollPane的prefWidth/prefHeight限制了其自适应能力，与Vgrow/Hgrow规则冲突
• 错误地给VBox内的vsPane设置HBox.setHgrow，该规则仅对HBox的直接子元素生效

分步修复方案 #

1. 修正FXML布局 #

修改ui.fxml，让editorContainer直接作为BorderPane的center子元素，移除多余的HBox嵌套：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.*?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.VBox?>

<!--    Handles the main stage ui   -->

<BorderPane xmlns:fx="http://javafx.com/fxml" fx:controller="com.example.temp.core">
    <center>
        <VBox fx:id="editorContainer" />
    </center>
</BorderPane>

如果业务需要保留HBox，需为editorContainer添加HBox增长规则：

<HBox>
    <VBox fx:id="editorContainer" HBox.hgrow="ALWAYS" />
</HBox>

2. 调整控制器初始化逻辑 #

移除无效的尺寸绑定和错误的增长规则，让VirtualizedScrollPane自动填充父容器：

@FXML
public void initialize() {
    // Set up CodeArea with styling and line numbering
    codeArea = new CodeArea();
    codeArea.setFocusTraversable(true);
    codeArea.setStyle("-fx-font-family: 'Consolas'; -fx-font-size: 14px;");
    codeArea.setParagraphGraphicFactory(createLineNumberFactory());
    codeArea.textProperty().addListener((obs, oldText, newText) -> isModified = true);

    // Place CodeArea in a VirtualizedScrollPane
    VirtualizedScrollPane<CodeArea> vsPane = new VirtualizedScrollPane<>(codeArea);

    // 仅保留VBox垂直增长规则，让vsPane占满editorContainer全部空间
    VBox.setVgrow(vsPane, Priority.ALWAYS);

    editorContainer.getChildren().add(vsPane);

    fileHandler = new OptFile_handler(this);
}

3. 优化行号组件（可选） #

为行号Label添加右对齐样式，提升视觉一致性：

public java.util.function.IntFunction<Node> createLineNumberFactory() {
    return line -> {
        int lineIndex = line + 1;
        Label label = new Label(String.valueOf(lineIndex));
        label.setMinWidth(40);
        label.setPadding(new javafx.geometry.Insets(2, 8, 2, 8));
        label.setStyle(getLineNumberStyle(lineIndex) + "-fx-alignment: center-right;");
        return label;
    };
}

关键原理说明 #

• VirtualizedScrollPane是为RichTextFX组件设计的自适应容器，无需手动绑定尺寸，只要父容器分配足够空间就会自动填充
• 容器的Vgrow/Hgrow属性必须设置在直接子元素上才能生效
• 避免同时使用尺寸绑定和增长规则，二者会互相冲突导致布局异常

内容的提问来源于stack exchange，提问作者Mick Lennar