示例代码
//node
Rectangle rect = new Rectangle (0, 0, 20, 20);
//path
Text text = TextBuilder.create()
.text("J a v a F X R o c k s")
.font(new Font(50))
.x(65)
.y(100)
.build();
// path transition
pathTransition = PathTransitionBuilder.create()
.duration(Duration.seconds(15))
.path(text)
.node(rect)
.orientation(OrientationType.ORTHOGONAL_TO_TANGENT)
.cycleCount(Timeline.INDEFINITE)
.autoReverse(true)
.build();
我想显示 rect 节点经过的部分文本(路径)。上图中的意思是 rect 节点移动到 java,我只想在那个时间点显示那个部分..
最佳答案
您可以尝试为文本分配一个剪辑区域并在动画期间更新它:
public void start(Stage primaryStage) {
final Rectangle pen = new Rectangle(0, 0, 20, 20);
// this pane this contain clipping
final Pane clip = new Pane();
// listener to update clipping area
ChangeListener changeListener = new ChangeListener() {
@Override
public void changed(ObservableValue ov, Object t, Object t1) {
Rectangle newrect = new Rectangle(pen.getTranslateX(), pen.getTranslateY(), pen.getWidth(), pen.getHeight());
newrect.setRotate(pen.getRotate());
clip.getChildren().add(newrect);
}
};
// rect coordinates will be changed during animation, so we will listen to them
pen.translateXProperty().addListener(changeListener);
pen.translateYProperty().addListener(changeListener);
pen.rotateProperty().addListener(changeListener);
final Text text = TextBuilder.create()
.text("J a v a F X R o c k s")
.font(new Font(50))
.clip(clip)
.x(65)
.y(100)
.build();
PathTransition pathTransition = PathTransitionBuilder.create()
.duration(Duration.seconds(15))
.path(text)
.node(pen)
.orientation(OrientationType.ORTHOGONAL_TO_TANGENT)
.build();
// once we done we don't want to store thousands of rectangles used to clip
pathTransition.setOnFinished(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent t) {
text.setClip(null);
clip.getChildren().clear();
}
});
Pane root = new Pane();
root.getChildren().addAll(text, pen);
primaryStage.setScene(new Scene(root, 600, 200));
primaryStage.show();
pathTransition.play();
}
Canvas
对象可以更有效地存储剪辑区域,但是在 Canvas 上绘制带旋转的矩形需要一些数学知识,所以由您决定。
关于animation - JavaFX:使用 PathTransition 作为绘图笔的动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14347778/