在关键帧 JavaFx 之间绑定和取消绑定

bind and unbind between keyframes JavaFx

我正在创建一个应用程序,作为其中的一部分,我正在这样做。我有三个节点说 40、45、50

我必须设置动画才能到达位置

为此我有一个中间位置

我已经将此作为两个动画的一部分实现。为了保持连接节点的线完好无损,我使用 DoubleProperty.bind() 。但我想把它作为一个动画的一部分来做。在这里,我必须能够在动画中间使用 DoubleProperty.bind()。有没有人知道这样做?

这是我为实现它而编写的代码。

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package Visual;

import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Line;
import javafx.stage.Stage;
import javafx.util.Duration;

/**
 *
 * @author apple
 */
public class BindIt extends Application {

    @Override
    public void start(Stage primaryStage) {
        Line line1 = new Line(200, 50, 100, 100);
        Line line2 = new Line(100, 100, 200, 200);

        Circle c1 = new Circle(25);
        c1.setCenterX(200);
        c1.setCenterY(50);
        line1.startXProperty().bind(c1.centerXProperty());
        line1.startYProperty().bind(c1.centerYProperty());

        Circle c2 = new Circle(25);
        c2.setCenterX(100);
        c2.setCenterY(100);
    //    line1.endXProperty().bind(c2.centerXProperty());
     //   line1.endYProperty().bind(c2.centerYProperty());

        line2.startXProperty().bind(c2.centerXProperty());
        line2.startYProperty().bind(c2.centerYProperty());

        Circle c3 = new Circle(25);
        c3.setCenterX(200);
        c3.setCenterY(200);
        line2.endXProperty().bind(c3.centerXProperty());
        line2.endYProperty().bind(c3.centerYProperty());

        Group root = new Group();
        root.getChildren().add(line1);
        root.getChildren().add(line2);

        root.getChildren().add(c1);
        root.getChildren().add(c2);
        root.getChildren().add(c3);

        Scene scene = new Scene(root, 500, 500);

        primaryStage.setTitle("Bind the line!");
        primaryStage.setScene(scene);
        final Timeline timeline1 = new Timeline();
        timeline1.getKeyFrames().addAll(new KeyFrame(Duration.millis(0)), 
            new KeyFrame(Duration.millis(3000), 
                new KeyValue(c2.centerYProperty(), 200), 
                new KeyValue(c2.centerXProperty(), 50), 
                new KeyValue(c3.centerYProperty(), 100), 
                new KeyValue(c3.centerXProperty(), 100)));

        timeline1.play();
        final Timeline timeline2 = new Timeline();
        timeline2.getKeyFrames().addAll(new KeyFrame(Duration.millis(0)), 
            new KeyFrame(Duration.millis(3000), 
                new KeyValue(c3.centerXProperty(), 200), 
                new KeyValue(c3.centerYProperty(), 50), 
                new KeyValue(c1.centerXProperty(), 250), 
                new KeyValue(c1.centerYProperty(), 100), 
                new KeyValue(c2.centerXProperty(), 100), 
                new KeyValue(c2.centerYProperty(), 100)));

        timeline1.setOnFinished(new EventHandler<ActionEvent>() {

            @Override
            public void handle(ActionEvent event) {
                line1.endXProperty().bind(c3.centerXProperty());
                line1.endYProperty().bind(c3.centerYProperty());
                timeline2.play();

            }
        });

        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

这里不想用两条时间线,只用一条时间线。

您可以使用 KeyFrame constructor that takes an event handler 在该关键帧执行操作(在本例中,建立附加绑定):

    final Timeline timeline = new Timeline();
    timeline.getKeyFrames().addAll(
        new KeyFrame(Duration.millis(0)),
        new KeyFrame(Duration.millis(3000),
            event -> {
                line1.endXProperty().bind(c3.centerXProperty());
                line1.endYProperty().bind(c3.centerYProperty());
            },
            new KeyValue(c2.centerYProperty(), 200), 
            new KeyValue(c2.centerXProperty(), 50), 
            new KeyValue(c3.centerYProperty(), 100), 
            new KeyValue(c3.centerXProperty(), 100)),
        new KeyFrame(Duration.millis(6000),
            new KeyValue(c3.centerXProperty(), 200), 
            new KeyValue(c3.centerYProperty(), 50), 
            new KeyValue(c1.centerXProperty(), 250), 
            new KeyValue(c1.centerYProperty(), 100), 
            new KeyValue(c2.centerXProperty(), 100), 
            new KeyValue(c2.centerYProperty(), 100)));