如何在javafx中改变按键上的旋转方向

Question

我有两个圆圈，如果按下右键，我想绕顺时针转动它们，如果按下左键，我想逆时针转动，但我的代码不起作用。

 {!! Form::model($socket,['route' =>['socketupdate',rep_id],'method'=>'POST']) !!}

它工作得很好但是当我按下一个键并释放它时，圆圈不会停止。他们只是开始向后转，直到最后一个旋转变化点并继续重复，所以当我再次按下它时它有时会跳跃。（因为向后转弯到达终点并从头开始）（很难解释！你必须亲自看看！） 有谁知道如何解决或实现这个目标？

Answer 1

在动画进行过程中，我不会尝试操纵关键帧。相反，您可以暂停/播放动画并更改速率。这里唯一的“问题”是，如果动画暂停，动画会忽略速率的变化，因此您需要在 play()之前调用setRate(...) 。

以下是修改后的SSCCE：

import static java.lang.Math.cos;
import static java.lang.Math.sin;

import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.input.KeyCode;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.transform.Rotate;
import javafx.stage.Stage;
import javafx.util.Duration;

public class RotatingCircles extends Application {
    public static final double CIRCLES_CENTER_X = 600;
    public static final double CIRCLES_CENTER_Y = 450;
    public static final double CIRCLES_RADIUS = 15;
    public static final double CIRCLES_DISTANCE = 300;
    public static final double GAME_HEIGHT = 700;
    public static final double GAME_WIDTH = 1200; 

    private Stage primaryStage;

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

    @Override
    public void start(Stage primaryStage) {
        this.primaryStage = primaryStage;
        primaryStage.setMinWidth(GAME_WIDTH);
        primaryStage.setMinHeight(GAME_HEIGHT);
                    final Scene scene;
        BorderPane root = new BorderPane();
        scene = new Scene(root, GAME_WIDTH, GAME_HEIGHT); 

        Circle orangeCircle = new Circle(CIRCLES_CENTER_X + CIRCLES_DISTANCE / 2 * cos(0),
                CIRCLES_CENTER_Y + CIRCLES_DISTANCE / 2 * sin(0),
                CIRCLES_RADIUS, Color.ORANGE);
        Circle yellowCircle = new Circle(CIRCLES_CENTER_X - CIRCLES_DISTANCE / 2 * cos(0),
                CIRCLES_CENTER_Y - CIRCLES_DISTANCE / 2 * sin(0),
                CIRCLES_RADIUS, Color.YELLOW);

        Pane game = new Pane(orangeCircle, yellowCircle); 
        root.setCenter(game);

        Rotate orangeCircleRotation = new Rotate(0, CIRCLES_CENTER_X, CIRCLES_CENTER_Y);
        orangeCircle.getTransforms().add(orangeCircleRotation);
        Rotate yellowCircleRotation = new Rotate(0, CIRCLES_CENTER_X, CIRCLES_CENTER_Y);
        yellowCircle.getTransforms().add(yellowCircleRotation);
        Timeline rotationAnimation = new Timeline();
        rotationAnimation.setCycleCount(Timeline.INDEFINITE);
        rotationAnimation.getKeyFrames().add(new KeyFrame(Duration.seconds(2), new KeyValue(orangeCircleRotation.angleProperty(), 360)));
        rotationAnimation.getKeyFrames().add(new KeyFrame(Duration.seconds(2), new KeyValue(yellowCircleRotation.angleProperty(), 360)));

        root.setOnKeyPressed(ke -> {
           if (ke.getCode() == KeyCode.RIGHT) {
               rotationAnimation.play();
               rotationAnimation.setRate(1);
           } else if (ke.getCode() == KeyCode.LEFT) {
               rotationAnimation.play();
               rotationAnimation.setRate(-1);
           }
        });
        root.setOnKeyReleased(ke -> {
            rotationAnimation.pause();
        });


        primaryStage.setScene(scene);
        primaryStage.show();

        root.requestFocus();
    }


    public Stage getPrimaryStage() {
        return primaryStage;
    }
}

BTW在这段代码中你真的不需要两个单独的旋转，因为它们是相同的。只需创建一个旋转并将其添加到两个圆的变换列表中。当然，你的真实代码可能会有所不同......