时间戳

首页 > 解决方案 > JavaFX - 如何使轴刻度线标签居中

javafx - JavaFX - 如何使轴刻度线标签居中

问题描述

想要为 JavaFX 图表的 x 轴刻度标签设置text-alingment为。center

我有一个带日期的 JavaFX NumberAxis X 轴，使用多行文本作为刻度标签。使用 . 将刻度标签设置为 "dd/MMM\YYYY" 或 "HH:mm\ndd/MMM AxisX.setTickLabelFormatter(getTimeAxisString())" 用户函数 getTimeAxisString() 为刻度标签提供格式化字符串。默认情况下，这会导致文本左对齐，如下图所示： 轴刻度标签

是否有 JavaFx 方法来更改此处的文本？我可以为刻度标签分配一个 CSS 类吗？

标签： javafxchartsaxis

解决方案

令人惊讶的是，不直接支持标记标签的样式。此外，所有图表和协作者都非常注意不要在任何 api 中暴露其层次结构中的节点（甚至在内部也不公开）。所以看起来我们需要依赖 Axis 的实现细节..

  • 封装标签状态的类是 TickMark
  • 它有一个字符串类型的字段，命名为标签：这是值的字符串表示形式，可通过转换器值 -> 字符串进行配置
  • 它有一个 Text 类型的字段，名为 textNode：这是添加到 Axis 的节点和我们要设置样式的节点
  • 文本本身没有默认样式类，无法通过axis.lookup(style)
  • textNode 没有可能由其父轴设置的默认自定义样式（与轴标签相反）

基本任务是通过直接配置其属性或设置自定义样式类并通过 css 配置来访问文本然后对其进行样式设置。

基本的解决路径是监听axis children，添加时配置所有Text类型节点的属性。下面的代码片段设置了一个自定义样式类。

xAxis.getChildrenUnmodifiable().addListener((ListChangeListener<Node>) c -> {
    while (c.next()) {
        if (c.wasAdded()) {
            for (Node mark : c.getAddedSubList()) {
                if (mark instanceof Text) {
                    mark.getStyleClass().add("axis-tick-mark-text-node");
                }
            }
            
        }
    }
});

示例样式：

.axis-tick-mark-text-node {
    -fx-text-alignment: center;
    -fx-fill: red;
}

推荐阅读