如何强制JavaFX XYChart的布局更新

Question

我试图在计时器方法中强制更新自定义XYChart，但唯一可行的是调整窗口大小。

import javafx.application.Application;
import javafx.application.Platform;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Shape;
import javafx.scene.transform.Affine;
import javafx.scene.transform.Transform;
import javafx.stage.Stage;
import java.util.*;
import java.util.stream.Collectors;
public class TestCustomLayoutUpdate extends Application {
private LineChart<Number, Number> chart;
private NumberAxis xAxis;
private NumberAxis yAxis;
private ShopItem currentShopItem;
class ShopItem {
private double price;
public ShopItem(double price) {
this.price = price;
}
}
@Override
public void start(Stage primaryStage) {
createChart();
Scene scene = new Scene(chart, 600, 400);
primaryStage.setScene(scene);
primaryStage.setHeight(600);
primaryStage.setWidth(400);
primaryStage.show();
Random rng = new Random();
// Note since this is a regular timer not javafx timer that we should use platform run later.
TimerTask repeatedTask = new TimerTask() {
public void run() {
currentShopItem = new ShopItem(rng.nextDouble() * 100);
Platform.runLater(() -> {
chart.layout();
chart.requestLayout();
xAxis.layout();
});
}
};
Timer timer = new Timer("Timer");
long delay  = 1000L;
long period = 1000L;
timer.scheduleAtFixedRate(repeatedTask, delay, period);
}
public void createChart() {
xAxis = new NumberAxis();
yAxis = new NumberAxis();
xAxis.setAutoRanging(false);
xAxis.setUpperBound(100);
chart = new LineChart<Number, Number>(xAxis, yAxis) {
private List<Shape> shapes = new ArrayList<>();
@Override
public void layoutPlotChildren() {
super.layoutPlotChildren();
getPlotChildren().removeAll(shapes);
shapes.clear();
if (currentShopItem != null) {
Rectangle rect = new Rectangle(0, 0, 10, currentShopItem.price);
rect.getTransforms().setAll(chartDisplayTransform(xAxis, yAxis));
rect.setFill(Color.RED);
shapes.add(rect);
getPlotChildren().addAll(shapes);
}
}
};
}
private Transform chartDisplayTransform(NumberAxis xAxis, NumberAxis yAxis) {
return new Affine(xAxis.getScale(), 0, xAxis.getDisplayPosition(0), 0, yAxis.getScale(),
yAxis.getDisplayPosition(0));
}
public static void main(String[] args) {
Application.launch(args);
}
}

Answer 1

JavaFX将自动布局并重新绘制场景图的任何部分，如果作为图一部分的任何节点的属性发生变化。的问题构造代码的方式是，只在layoutPlotChildren()方法中更改场景图(更改矩形的维度和/或更改图表的绘图子项(，(我相信(这是布局过程的一部分。因此，当您请求布局时，JavaFX会检查场景图中是否有任何内容发生了更改，是否没有发生更改，因此不会执行布局。因此layoutPlotChildren()不会被调用，因此场景图不会发生更改。。。

因此，要解决此问题，您只需要确保现有矩形已更新，或者在基础数据发生更改时，绘图子对象列表也发生了更改。您可以通过使用JavaFX属性并从图表子类中观察它们来实现这一点。(我想还有其他方法，比如在图表子类中定义一个更新矩形的方法，并从动画循环中调用它。但观察JavaFX属性是API引用的方法。(

顺便说一句，如果你想定期更改任何更新图形的内容，在JavaFX中最好使用Timeline，它完全在JavaFX线程上运行，避免了考虑变量同步等问题。

以下是您的示例的一个版本，其中包含了这些更改，可以按需工作：

import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import javafx.animation.Animation;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.scene.Scene;
import javafx.scene.chart.LineChart;
import javafx.scene.chart.NumberAxis;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Shape;
import javafx.scene.transform.Affine;
import javafx.scene.transform.Transform;
import javafx.stage.Stage;
import javafx.util.Duration;
public class TestCustomLayoutUpdate extends Application {
private LineChart<Number, Number> chart;
private NumberAxis xAxis;
private NumberAxis yAxis;

private ObjectProperty<ShopItem> currentShopItem;
class ShopItem {
private double price;
public ShopItem(double price) {
this.price = price;
}
}
@Override
public void start(Stage primaryStage) {
currentShopItem = new SimpleObjectProperty<>();

createChart();
Scene scene = new Scene(chart, 600, 400);
primaryStage.setScene(scene);
primaryStage.setHeight(600);
primaryStage.setWidth(400);
primaryStage.show();
Random rng = new Random();
Timeline timeline = new Timeline(new KeyFrame(Duration.seconds(1),  
evt -> currentShopItem.set(new ShopItem(rng.nextDouble() * 100))
));
timeline.setCycleCount(Animation.INDEFINITE);
timeline.play();
}
public void createChart() {
xAxis = new NumberAxis();
yAxis = new NumberAxis();
xAxis.setAutoRanging(false);
xAxis.setUpperBound(100);
chart = new LineChart<Number, Number>(xAxis, yAxis) {
private List<Shape> shapes = new ArrayList<>();
private Rectangle rect ;
// anonymous class constructor:
{
rect = new Rectangle(0,0, Color.RED);
currentShopItem.addListener((obs, oldItem, newItem) -> {
if (newItem == null) {
rect.setWidth(0);
rect.setHeight(0);
} else {
rect.setWidth(10);
rect.setHeight(newItem.price);
}
});
}
@Override
public void layoutPlotChildren() {
super.layoutPlotChildren();
getPlotChildren().removeAll(shapes);
shapes.clear();
if (currentShopItem != null) {
rect.getTransforms().setAll(chartDisplayTransform(xAxis, yAxis));
shapes.add(rect);
getPlotChildren().addAll(shapes);
}
}
};
}
private Transform chartDisplayTransform(NumberAxis xAxis, NumberAxis yAxis) {
return new Affine(xAxis.getScale(), 0, xAxis.getDisplayPosition(0), 0, yAxis.getScale(),
yAxis.getDisplayPosition(0));
}
public static void main(String[] args) {
Application.launch(args);
}
}