Animation JavaFX:将PathTransition用作绘图笔的动画

Animation JavaFX:将PathTransition用作绘图笔的动画,animation,javafx-2,javafx,Animation,Javafx 2,Javafx,示例代码 //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)

示例代码

//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();
}
公共作废开始(阶段primaryStage){
最终矩形笔=新矩形(0,0,20,20);
//此窗格包含此剪辑
最终窗格剪辑=新窗格();
//侦听器更新剪辑区域
ChangeListener ChangeListener=新的ChangeListener(){
@凌驾
公共无效已更改(ObservalEvalue ov、对象t、对象t1){
矩形newrect=新矩形(pen.getTranslateX(),pen.getTranslateY(),pen.getWidth(),pen.getHeight());
newrect.setRotate(pen.getRotate());
clip.getChildren().add(newrect);
}
};
//矩形坐标将在动画期间更改,因此我们将聆听它们
pen.translateProperty().addListener(changeListener);
pen.translateYProperty().addListener(changeListener);
pen.rotateProperty().addListener(changeListener);
final Text Text=TextBuilder.create()
.文本(“J a v a F X R o c k s”)
.font(新字体(50))
.夹子(夹子)
.x(65)
.y(100)
.build();
PathTransition PathTransition=PathTransitionBuilder.create()
.持续时间(持续时间.秒(15))
.路径(文本)
.节点(笔)
.方向(方向类型.正交到切线)
.build();
//一旦我们完成了,我们就不想存储用于剪辑的数千个矩形
setOnFinished(新的EventHandler(){
@凌驾
公共无效句柄(ActionEvent t){
text.setClip(null);
clip.getChildren().clear();
}
});
窗格根=新窗格();
root.getChildren().addAll(文本、笔);
初始阶段。设置场景(新场景(根,600200));
primaryStage.show();
pathTransition.play();
}
存储剪切区域的一种更有效的方法是
Canvas
object,但在画布上旋转绘制矩形需要一些数学知识,所以这是您的选择