JavaFX摆锤动画问题：场景中无法显示底部圆形

你的代码里底部圆形不显示的核心原因是初始化bottomCircle时半径设置为0，导致圆形不可见。

具体问题点 #

在Pendulum构造方法中，初始化bottomCircle的代码是：

bottomCircle = new Circle(arc.getCenterX(),arc.getCenterY()-h/2,bottomCircle.getRadius()/2);

此时bottomCircle刚声明，默认半径为0，bottomCircle.getRadius()/2的结果还是0，半径为0的圆形自然无法显示。

修复方案 #

1. 给bottomCircle设置一个固定的初始半径，比如10，替换掉原来的bottomCircle.getRadius()/2；
2. 调整bottomCircle的初始位置，确保它在摆锤线条的末端，和路径动画的起点匹配。

修改后的完整代码 #

import javafx.animation.PathTransition;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Arc;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Line;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Ch15PA2 extends Application {
    
    public void start(Stage primaryStage) {
        
        BorderPane pane = new BorderPane();
        VBox vbox = new VBox();
        pane.getChildren().add(vbox);
        
        Pendulum pendulum = new Pendulum(500, 300);
        pane.setCenter(pendulum);   
        
        Scene scene = new Scene(pane,500,500);
        primaryStage.setTitle("Chapter 15 Programming Assignemnt 2");
        primaryStage.setScene(scene);
        pendulum.resume();
        primaryStage.show();
        
        scene.setOnKeyPressed(e -> {
            switch (e.getCode()) {
            case UP: pendulum.increase(); break;
            case DOWN: pendulum.decrease(); break;
            case R: pendulum.resume(); break;
            case S: pendulum.stop(); break;
            }
        });
    }

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

}

class Pendulum extends Pane {
    private double w=300;
    private double h;
    
    PathTransition pt;
    Circle topCircle = new Circle();
    Circle bottomCircle = new Circle();
    Line line;
    Arc arc;
    
    public Pendulum(double width,double height) {
        w = width;
        h = height;
        
        arc = new Arc(w/2,h*.8,w*.15,w*.15,180,180);
        topCircle = new Circle(arc.getCenterX()-arc.getRadiusX(),arc.getCenterY(),10);
        // 修改此处：设置固定半径10，并调整初始位置为摆线末端
        bottomCircle = new Circle(topCircle.getCenterX(), topCircle.getCenterY() + h/2, 10);
        arc = new Arc(topCircle.getCenterX(),topCircle.getCenterY(),w/2,h/2,240,60);
        arc.setFill(Color.TRANSPARENT);
        line = new Line(topCircle.getCenterX(),topCircle.getCenterY(),bottomCircle.getCenterX(),bottomCircle.getCenterY());
        pt = new PathTransition();
        pt.setDuration(Duration.seconds(2.0));
        pt.setPath(arc);
        pt.setNode(bottomCircle);
        pt.setOrientation(PathTransition.OrientationType.NONE);
        pt.setCycleCount(PathTransition.INDEFINITE);
        pt.setAutoReverse(true);
        topCircle.setStroke(Color.BLACK);
        topCircle.setFill(Color.BLACK);
        bottomCircle.setStroke(Color.BLACK);
        bottomCircle.setFill(Color.BLACK);
        line.setStroke(Color.BLACK);
        line.endXProperty().bind(bottomCircle.translateXProperty().add(bottomCircle.getCenterX()));
        line.endYProperty().bind(bottomCircle.translateYProperty().add(bottomCircle.getCenterY()));

        getChildren().add(line);
        getChildren().add(bottomCircle);
        getChildren().add(topCircle);
        getChildren().add(arc);
        
    }
    
    public void increase() {
        pt.setRate(pt.getRate()+1);
    }
    
    public void decrease() {
        pt.setRate(pt.getRate()-1);
    }
    
    public void resume() {
        pt.play();
    }
    
    public void stop() {
        pt.stop();
    }
}

额外说明 #

原代码中bottomCircle的初始位置基于第一个arc的坐标，而后续arc被重新赋值为摆锤的运动路径，调整初始位置为topCircle.getCenterX(), topCircle.getCenterY() + h/2后，能让摆锤初始位置更合理，和运动路径的起点对齐。

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