如何在JavaFX中序列化事件？

Question

我正在嘗試創建JavaFX應用程序。 作為它的一部分，我必須繪制一個圓，如果按下一個按鈕，則會發生動畫，然后我必須繪制另一個圓。 但是在動畫結束之前繪制了第二個圓圈。 我嘗試了一段時間沒有運氣。 任何提示都表示贊賞。

這里draw（）將繪制初始圓，play（）將進行動畫處理，drawAfter（）必須在play（）之后發生，但發生在play（）完成之前。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.util.Duration;
import javafx.scene.shape.Path;
import javafx.scene.shape.*;
import javafx.animation.PathTransition;
import javafx.animation.PathTransition.OrientationType;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.event.ActionEvent;



public class CircularPlay extends Application {

    public static void main(String[] args) {
        launch(args);
    }
    TextField tf=new TextField("Write a number");
    Group root = new Group();
    Scene scene = new Scene(root, 800, 600, Color.WHITE);
    Button bt=new Button("Start");
    Label label=new Label("change this");
    Rectangle rect = new Rectangle (50, 50, 5, 5);
    Canvas canvas = new Canvas(600, 400);
    GraphicsContext gc = canvas.getGraphicsContext2D();



    @Override
    public void init()
    {
        bt.setLayoutX(650);
        bt.setLayoutY(50);
        label.setLayoutX(650);
        label.setLayoutY(100);
        rect.setArcHeight(50);
        rect.setArcWidth(50);
        rect.setFill(Color.VIOLET);

    }
    private void draw()
    {
        gc.strokeOval(50, 0, 100, 100);
        gc.rect(1, 1, 599, 399);
        gc.stroke();
    }
    private void drawAfter()
    {
        gc.strokeOval(100, 50, 100, 100);
    }
    private void play()
    {
        Path path = new Path();

        path.getElements().add (new MoveTo (50, 50));
        path.getElements().add (new ArcTo(50,50,90,100,100,true,true));

        PathTransition pathTransition = new PathTransition();

        pathTransition.setDuration(Duration.millis(2000));
        pathTransition.setNode(rect);
        pathTransition.setPath(path);
        pathTransition.setOrientation(OrientationType.ORTHOGONAL_TO_TANGENT);
        pathTransition.setCycleCount(1);
        pathTransition.play();
    }

    @Override
    public void start(Stage primaryStage)
    {

        primaryStage.setScene(scene);

        root.getChildren().add(canvas);
        root.getChildren().add(rect);
        root.getChildren().add(bt);
        root.getChildren().add(label); 

        draw();

        bt.setOnAction((ActionEvent e) -> {
            label.setText("Accepted");
            play();
            drawAfter();
        });  

        primaryStage.show();
    }

}

Answer 1

您需要等到動畫結束繪制第二個圓。

為此，每個動畫都有一個方法： setOnFinished() 。

在您的情況下，從按鈕偵聽器中刪除drawAfter(() ：

bt.setOnAction(e -> {
        label.setText("Accepted");
        play();
    });

並將其添加到動畫中：

private void play(){
    ...
    PathTransition pathTransition = new PathTransition();
    ...
    pathTransition.setOnFinished(e->drawAfter());
    pathTransition.play();
}