By meyer9168

2018-12-05 21:28:13 8 Comments

I'm new to JavaFX, and I'm sure I'm missing something obvious here. I'm trying to make an animation of a car that travels from left to right across a window, wrapping around the right side when it gets there. The user should be able to hit up/down to adjust the speed of the animation. I had the animation going when I used a PathTransition object, but found out you can't adjust the Duration of a PathTransition, so I redid it in a Timeline.

With Timeline, though, I'm stuck. The car does not display on the screen when I launch the application. Here's what I'm hoping is a concise code snippet:

public class Project12 extends Application {

public static void main(String[] args) {

public void start(Stage primaryStage) {     
    //Create Pane to hold the car animation
    Pane pane = new Pane();

    //Create the RaceCarPane
    RaceCarPane raceCar = new RaceCarPane();
    pane.getChildren().add(raceCar); //Adds the race car to the main pane

    //Create the VBox to hold components
    VBox displayPane = new VBox();
    displayPane.getChildren().addAll(pane, userInstructions, btnPause);

    //Create scene for display and add the display pane
    Scene scene = new Scene(displayPane);

    //Add the scene to the stage and display
    primaryStage.setTitle("Project 12");
    primaryStage.setResizable(false); //disable resizing of the window


And the RaceCarPane:

public class RaceCarPane extends Pane {

    //Declare origin for determining polygon point locations
    private double originX = 10;
    private double originY = getHeight() - 10;
    private Timeline carAnimation;

    //Set the Timeline for the car in constructor method
    public RaceCarPane() {
        carAnimation = new Timeline(
                new KeyFrame(Duration.millis(100), e -> moveCar()));

    private void paint() {

        //Create a polygon for the body 
        Polygon body = new Polygon();

        //Add points to the body
        ObservableList<Double> bodyList = body.getPoints();

        /*(code omitted, just adding coordinates to the ObservableList for all parts. 
        I don't believe the bug is here since it displayed when I was using a PathTransition animation)*/

        //Add to pane
        getChildren().addAll(body, roof, frontWheel, rearWheel);

    public void setOrigin (double x, double y) {
        this.originX = x;
        this.originY = y;

    public void setWidth(double width) {

    public void setHeight(double height) {

    public void moveCar() {
        //Check that car is in bounds
        if(originX <= getWidth()) {
            originX += 10;
        else {
            originX = 0;

EDIT: Per @Jai's comment below, my solution was to revert to the PathTransition object and use its RateProperty bound to a SimpleDoubleProperty. While maybe not what the project was looking for as a solution, it does the trick, so I'm happy!


@Jai 2018-12-06 02:35:27

@swpalmer was right to say that you shouldn't add it repeatedly.

That aside, you could definitely use PathTransition by using Animation.rateProperty() (PathTransition extends Animation).

Also, from PathTransition:

This Transition creates a path animation that spans its duration. The translation along the path is done by updating the translateX and translateY variables of the node, and the rotate variable will get updated if orientation is set to OrientationType.ORTHOGONAL_TO_TANGENT, at regular interval.

Therefore, if you are using Timeline, you should also be setting the translateX and translateY of the whole node (i.e. RaceCarPane) to perform the animation; trying to add polygons repeatedly is definitely the wrong approach. If you were also adding a lot of polygons when you were using PathTransition, you were probably not doing it quite right as well. Even when the animation turns out to be visually correct, it doesn't always mean that it is done correctly.

@meyer9168 2018-12-06 03:09:25

Hmm. While I looked into the documentation for PathTransition I didn't think to check out what I could do from Animation. If I can use ObservableRate and just update the rate value instead of the immutable Duration, then I should be golden. I'll give this a shot tomorrow and update if it does the trick. Thanks!

@meyer9168 2018-12-06 15:24:05

it works! Still no idea why Timeline wouldn't work for me, but using PathTransition and then adjusting its rateProperty per a SimpleDoubleProperty does the trick. Now I can wrap this up and finally get to studying for next week's finals, haha...

@swpalmer 2018-12-05 21:46:38

It looks like you missed a closing brace in the paint method.

There are a few things "wrong". For one, you should not be creating new objects and adding them to the scene graph every time you want to move your car. You;ve also left out how you use originX, originY.

I suggest you use a Group to hold the parts of the car. Add it once to the RaceCarPane and use a transform on the group object to move it.

This would probably be easier if you based in on an AnimationTimer instead of a Timeline, particularly if you want to be able to dynamically adjust the speed of the car.

@meyer9168 2018-12-05 21:51:08

I missed that closing brace when I was editing out unnecessary code. Those edits were where I used originX/Y - they're just used as origin points for determining how my Polygon shapes to build the car come from. The car drew just fine when I was using PathTransition so I'm 90% sure that my problem isn't with drawing the car itself. I can look into an AnimationTimer, but that's not covered in our textbook so I can only assume that I'm supposed to figure out how to do this with Timeline.

@swpalmer 2018-12-07 01:57:20

@meyer9168 Modifying coordinates in your Polygon is not the right way to do this. You want to define a static object using fixed points for the polygon that is shaped like a car and then move where that is drawn as a group. You want one car node in the scene graph hierarchy that you translate as needed.

Related Questions

Sponsored Content

2 Answered Questions

[SOLVED] javaFX cannot access Scene elements

  • 2015-07-20 13:21:29
  • lynnj
  • 598 View
  • 0 Score
  • 2 Answer
  • Tags:   javafx

25 Answered Questions

[SOLVED] Sort ArrayList of custom Objects by property

3 Answered Questions

[SOLVED] JavaFX ListView very slow

5 Answered Questions

[SOLVED] Method override returns null

0 Answered Questions

How to move arrow at the edge of circle specially for quadcurve

  • 2018-02-19 18:20:52
  • ehnsnk
  • 128 View
  • 0 Score
  • 0 Answer
  • Tags:   javafx

3 Answered Questions

0 Answered Questions

JavaFx Change main class to another main class (seperate class)

  • 2017-04-26 11:34:26
  • Kar
  • 287 View
  • 0 Score
  • 0 Answer
  • Tags:   class javafx

1 Answered Questions

Timeline animation JavaFX

  • 2016-02-06 12:59:20
  • yerpy
  • 498 View
  • 1 Score
  • 1 Answer
  • Tags:   java javafx

1 Answered Questions

lineChart Using JavaFx

  • 2015-04-28 09:45:00
  • Shoaib Khan
  • 89 View
  • 0 Score
  • 1 Answer
  • Tags:   javafx linechart

2 Answered Questions

Sponsored Content