GridPane 中的间隔 JavaFX 线图

Spacing JavaFX LineCharts in GridPane

所以现在我正在尝试编写一个程序来在 JavaFX LineCharts 中显示数据。我的主面板是一个 BorderPane,在 top/left/right/etc.. 面板的中央有一些功能,我想显示 LineChart(s)。最少 1 个,最多 4 个。

所以我想在主面板的中央设置一个网格面板来实现类似这样的结果:

Sample Gridpane

我现在的问题是,当我尝试将 LineCharts 添加到 GridPane 时(使用 .add(chart, 0, 0),图表不会与 parent 匹配。如果我继续添加更多图表,结果是这样的:

Something like this

我查了很多关于 parent 匹配的东西,但不知何故我没有得到任何结果:/我需要知道边框的 "center" 的大小,然后我可以相应地调整 LineCharts 的大小。但是我找不到它...也许你们中有人有线索?

干杯!

您可以向 GridPane 添加监听器以获取其子元素的大小,并根据子元素列表的大小更新子节点的布局约束。

import javafx.application.Application;
import javafx.beans.binding.Bindings;
import javafx.collections.ObservableList;
import javafx.geometry.*;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.chart.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;

import java.util.stream.IntStream;

public class GridViewer extends Application {
    @Override
    public void start(final Stage stage) throws Exception {
        ChartGrid grid = new ChartGrid();

        grid.getChildren().setAll(
                IntStream.range(1, 5)
                        .mapToObj(this::createLineChart)
                        .toArray(Chart[]::new)
        );

        stage.setScene(new Scene(grid));
        stage.show();
    }

    class ChartGrid extends GridPane {
        ChartGrid() {
            setHgap(5);
            setVgap(5);
            setPadding(new Insets(5));

            setPrefSize(500, 500);

            Bindings.size(getChildren()).addListener((observable, oldSize, newSize) -> {
                ObservableList<Node> nodes = getChildren();
                for (int i = 0; i < newSize.intValue(); i++) {
                    GridPane.setConstraints(
                            nodes.get(i),
                            i / 2, i % 2,
                            1, 1,
                            HPos.CENTER, VPos.CENTER,
                            Priority.ALWAYS, Priority.ALWAYS
                    );
                }
            });
        }
    }

    private Chart createLineChart(int idx) {
        NumberAxis xAxis = new NumberAxis();
        NumberAxis yAxis = new NumberAxis();
        LineChart<Number, Number> chart = new LineChart<>(xAxis, yAxis);
        chart.setTitle("Chart " + idx);
        chart.setMinSize(0, 0);

        return chart;
    }

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

注意:此解决方案的一个重要部分是将图表的 minSize 设置为 0:

chart.setMinSize(0, 0);

这是因为如果您将 GridPane 的可用区域设置为小于图表最小大小的总和(默认情况下不为 0),那么图表将开始相互重叠绘制,这不是你想要的。