javafx动画: displaying circles

Question

我想显示 5 个随机定位的彩色圆圈。这是很容易的部分。现在我想将这段代码调整为动画。该应用程序应该无休止地生成随机圆圈，但条件是它应该只在屏幕上保留最后五个圆圈。这就是我被困住的地方。 JavaFx提供ListChangeListener。我认为这是我应该使用的。但如何呢？ 以下是我未完成的代码:

import java.util.Random;

import javafx.application.Application;
import javafx.collections.ListChangeListener;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

public class RandomColorTest extends Application {

    int radius = 20;
    int sceneWidth = 300;
    int sceneHeight = 300;

    private void init(Stage primaryStage) {
        Group root = new Group();
        primaryStage.setResizable(false);
        primaryStage.setScene(new Scene(root, sceneWidth,sceneHeight));

        for (int i = root.getChildren().size(); i < 5; i++) {
            root.getChildren().add(createCircle());
            // the following should convey the idea:
            // if the collection holds 5 elements then keep least recently generated element for 1 second and then delete it
            // add one new element 
            // if the collection holds 5 elements then keep least recently generated element for 1 second and then delete it
            // add one new element 
            // and so on
            root.getChildren().addListener(new ListChangeListener<E>() {
                @Override
                public void onChanged(
                        javafx.collections.ListChangeListener.Change<? extends E> arg0) {
                    // TODO Auto-generated method stub
                }
            });

        }
    }

    // Create randomly positioned and colored circle
    private Circle createCircle() {
        final Circle circle = new Circle();
        circle.setRadius(radius);

        Random r = new Random();
        int rCol1 = r.nextInt(256);
        int rCol2 = r.nextInt(256);
        int rCol3 = r.nextInt(256);
        int rX = radius+r.nextInt(sceneWidth);
        if (rX>sceneWidth-radius) {
            rX=rX-2*radius;
        }
        int rY = radius+r.nextInt(sceneHeight);
        if (rY>sceneHeight-radius) {
            rY=rY-2*radius;
        }
        circle.setLayoutX(rX);
        circle.setLayoutY(rY);

        circle.setStroke(Color.BLACK);
        circle.setFill(Color.rgb(rCol1,rCol2,rCol3));
        System.out.println(rCol1+"-"+rCol2+"-"+rCol3+"-"+rX+"-"+rY);
        return circle;
    }

    @Override public void start(Stage primaryStage) throws Exception {
        init(primaryStage);
        primaryStage.show();
    }
    public static void main(String[] args) { launch(args); }
}

在设法使 ListChangeListener 编译没有错误后，它仍然无法按预期方式工作。对 for 循环所做的更改:

for (int i = root.getChildren().size();;i++) {
            final ObservableList<Node> ol = root.getChildren();
            // the following should convey the idea:
            // if the collection holds 5 elements then keep least recently generated element for 1 second and then delete it
            // add one new element 
            // if the collection holds 5 elements then keep least recently generated element for 1 second and then delete it
            // add one new element 
            // and so on
            ol.add(createCircle());
            ol.addListener( new ListChangeListener<Node>(){
                @Override
                public void onChanged(
                    javafx.collections.ListChangeListener.Change<? extends Node> arg0) {
                    // TODO Auto-generated method stub
                    System.out.println("one new element added, size:"+ol.size());
                    if (ol.size()==5) {
                        ol.remove(0);
                    }
                }   
            });
        } 

For 循环被定义为无限循环(可能也不是解决这个问题的正确方法)，我可以从控制台看到圆圈在程序运行期间被删除和添加。唉，我再也看不到 GUI 了。

Answer 1

Oracle forums last year 上也有人提出类似的问题。 .

这是使用时间轴的示例解决方案，我更喜欢依赖工作线程的解决方案。虽然两者都可以完成工作，但我发现使用 JavaFX 动画 API 更优雅且更不易出错。

import javafx.animation.*;
import javafx.application.Application;
import javafx.event.*;
import javafx.scene.*;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;
import javafx.util.Duration;

import java.util.Random;

public class FiveAutoCircleExample extends Application {
  private static final Random r = new Random();
  public static final int SCENE_SIZE = 800;

  public static void main(String[] args) throws Exception { launch(args); }
  public void start(final Stage stage) throws Exception {
    final Group circles = new Group();
    final Timeline animation = new Timeline(
      new KeyFrame(Duration.seconds(.5), 
      new EventHandler<ActionEvent>() {
        @Override public void handle(ActionEvent actionEvent) {
          while (circles.getChildren().size() >= 5) circles.getChildren().remove(0);
          int radius = 10 * r.nextInt(20);
          circles.getChildren().add(
            new Circle(
              r.nextInt(SCENE_SIZE - radius * 2) + radius, r.nextInt(SCENE_SIZE - radius * 2) + radius,
              radius,
              new Color(r.nextDouble(), r.nextDouble(), r.nextDouble(), r.nextDouble())
            )
          );
        }
      })
    );
    animation.setCycleCount(Animation.INDEFINITE);
    animation.play();

    // display the scene.
    stage.setScene(new Scene(circles, SCENE_SIZE, SCENE_SIZE, Color.CORNSILK));
    stage.show();
  }
}