[英]JavaFX pathtransition binding
I am studying JavaFX nowadays. 我现在正在学习JavaFX。 I have a trouble using PathTransition with property binding.
我在将PathTransition与属性绑定一起使用时遇到麻烦。 The purpose of the following code is to make a rectangle moving on a circle orbit.
以下代码的目的是使矩形在圆轨道上移动。 Also, I made the center of the circle bind with the height and the width of a pane divided by 2, which means the center of the pane.
另外,我使圆心与窗格的高度和宽度除以2,即窗格的中心。
import javafx.animation.PathTransition;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;
/**
* Created by Younghee on 2017-03-12.
*/
public class PathTransitionDemo extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
Pane pane = new Pane();
Circle circle = new Circle(50);
Rectangle rec = new Rectangle(20,10);
circle.setFill(Color.WHITE);
circle.setStroke(Color.BLACK);
circle.centerXProperty().bind(pane.widthProperty().divide(2));
circle.centerYProperty().bind(pane.heightProperty().divide(2));
rec.setStroke(Color.WHITE);
rec.setFill(Color.ORANGE);
pane.getChildren().addAll(circle, rec);
pane.setPadding(new Insets(11,11,11,11));
PathTransition pt = new PathTransition();
pt.setNode(rec);
pt.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
pt.setDuration(Duration.millis(4000));
pt.setPath(circle);
pt.setCycleCount(Timeline.INDEFINITE);
pt.setAutoReverse(true);
pt.play();
primaryStage.setScene(new Scene(pane));
primaryStage.setTitle("Path Transition Demo");
primaryStage.show();
}
}
However, the rectangle moves not on the specified circle, but on a other circle orbit whose center is (0,0). 但是,矩形不在指定的圆上移动,而是在以(0,0)为中心的另一个圆轨道上移动。 How can I fix it?
我该如何解决?
I can give you a not completed answer. 我可以给你一个未完成的答案。 You can create the PathTransition after the center your cirle(this should be the root cause) like the following.
您可以在圆心之后创建PathTransition(这应该是根本原因),如下所示。
public class PathTransitionDemo extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
Pane pane = new Pane();
Circle circle = new Circle(50);
Rectangle rec = new Rectangle(20,10);
circle.setFill(Color.WHITE);
circle.setStroke(Color.BLACK);
circle.centerXProperty().bind(pane.widthProperty().divide(2));
circle.centerYProperty().bind(pane.heightProperty().divide(2));
rec.setStroke(Color.WHITE);
rec.setFill(Color.ORANGE);
pane.getChildren().addAll(circle, rec);
pane.setPadding(new Insets(11,11,11,11));
circle.centerXProperty().addListener(new ChangeListener<Number>() {
@Override
public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
PathTransition pt = new PathTransition();
pt.setNode(rec);
pt.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
pt.setDuration(Duration.millis(4000));
pt.setPath(circle);
pt.setCycleCount(Timeline.INDEFINITE);
pt.setAutoReverse(true);
pt.play();
}
});
primaryStage.setScene(new Scene(pane));
primaryStage.setTitle("Path Transition Demo");
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.