问题描述
我在JavaFX中使用TimeLine动画遇到了一些麻烦。 这是我的部分代码:
Image img1 = new Image(getClass().getResource("images/img3.jpg").toString(), AppCommon.IMG_WIDTH, AppCommon.IMG_HEIGHT, false, false);
Image img2 = new Image(getClass().getResource("images/img2.png").toString(), AppCommon.IMG_WIDTH, AppCommon.IMG_HEIGHT, false, false);
KeyFrame keyImgLoad1 = new KeyFrame(Duration.seconds(0.1), new KeyValue(mImgLeft.imageProperty(), img1));
KeyFrame keyImgLoad2 = new KeyFrame(Duration.seconds(0.2), new KeyValue(mImgRight.imageProperty(), img1));
KeyFrame keyStartFade = new KeyFrame(Duration.seconds(6.0), new KeyValue(mImgLeft.opacityProperty(), 0.0));
KeyFrame keyendFade = new KeyFrame(Duration.seconds(8.0), new KeyValue(mImgLeft.opacityProperty(), 1.0));
KeyValue LeftX = new KeyValue(mImgLeft.xProperty(), 0);
KeyValue RightX = new KeyValue(mImgRight.xProperty(), AppCommon.IMG_WIDTH);
KeyFrame keyMoving = new KeyFrame(Duration.seconds(10), LeftX, RightX);
timelineOn.getKeyFrames().addAll(keyImgLoad1, keyImgLoad2, keyStartFade, keyendFade, keyMoving);
timelineOn.playFromStart();
没有任何错误,但是所有帧一次都开始播放,并且之间没有任何延迟。 我想看这样的东西:
- 将图像加载到ImageView
- 等待5秒。
- 执行不透明度动画关键帧
- 等待10秒。
- 执行运动动画关键帧
因此,总的来说,我的问题是如何在一个时间轴中实现关键帧之间的延迟? 有人可以帮忙吗?
1楼
您将需要在关键帧上添加onFinished()
并休眠一会儿。
查看
2楼
好的,我在github上也有它。 但是,这是我和我的朋友在动画动物项目中创建的一种方法。 所以,bratan,这就是我们的工作方式。
private void drawMouth()
{
mouth.setCenterX(SCENE_WIDTH / 2);
mouth.setCenterY(95);
mouth.setLength(30);
mouth.setRadiusX(30);
mouth.setRadiusY(53);
mouth.setStartAngle(255);
mouth.setFill(Color.BLACK);
timeLine = new Timeline();
timeLine.setCycleCount(Timeline.INDEFINITE);
timeLine.setAutoReverse(true);
KeyValue mouthXValue = new KeyValue(mouth.scaleXProperty(), 1.3);
KeyValue mouthYValue = new KeyValue(mouth.scaleYProperty(), 2);
KeyFrame keyFrameX = new KeyFrame(Duration.millis(1000), mouthXValue);
KeyFrame keyFrameY = new KeyFrame(Duration.millis(1000), mouthYValue);
timeLine.getKeyFrames().addAll(keyFrameX, keyFrameY);
timeLine.play();
}
但是,我相信您的情况可能需要使用SequentialTransition。 同样来自同一源的这段代码还涉及淡入淡出过渡(ft,ft1),两者均设置为毫秒级持续时间1000
SequentialTransition sequentialTransition = new SequentialTransition();
sequentialTransition.setCycleCount(Timeline.INDEFINITE);
sequentialTransition.setAutoReverse(false);
sequentialTransition.getChildren().addAll(ft, sunTransition, ft1, moonTransition);
sequentialTransition.play();
尝试这些尝试,并让我知道它们是否有效。
编辑:完整的源按要求。
private void drawPlanetaryBodies()
{
night.setX(0);
night.setY(0);
night.setWidth(SCENE_WIDTH);
night.setHeight(SCENE_HEIGHT-10);
night.setFill(Color.BLACK);
FadeTransition ft = new FadeTransition(Duration.millis(1000), night);
ft.setFromValue(1.0);
ft.setToValue(0.0);
ft.setCycleCount(1);
ft.setAutoReverse(false);
ft.play();
FadeTransition ft1 = new FadeTransition(Duration.millis(1000), night);
ft1.setFromValue(0.0);
ft1.setToValue(1.0);
ft1.setCycleCount(1);
ft1.setAutoReverse(false);
ft1.play();
sun.setCenterX(SCENE_WIDTH);
sun.setCenterY(0);
sun.setRadius(55);
sun.setFill(Color.YELLOW);
sun.setEffect(new Bloom());
Path path = new Path();
path.getElements().add(new MoveTo(-100, 200));
path.getElements().add(new CubicCurveTo(-100, 200, SCENE_WIDTH / 2, -100, SCENE_WIDTH + 100, 200));
path.setFill(Color.BLACK);
PathTransition sunTransition = new PathTransition();
sunTransition.setDuration(Duration.millis(10000));
sunTransition.setPath(path);
sunTransition.setNode(sun);
sunTransition.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
sunTransition.setAutoReverse(false);
moon.setRadiusX(45);
moon.setRadiusY(45);
moon.setType(ArcType.OPEN);
moon.setCenterX(SCENE_WIDTH);
moon.setCenterY(0);
moon.setStartAngle(135);
moon.setLength(180);
moon.setStrokeType(StrokeType.INSIDE);
moon.setFill(Color.WHEAT);
moon.setEffect(new Lighting());
Path moonPath = new Path();
moonPath.getElements().add(new MoveTo(-100, 200));
moonPath.getElements().add(new CubicCurveTo(-100, 200, SCENE_WIDTH / 2, -100, SCENE_WIDTH + 100, 200));
moonPath.setFill(Color.BLACK);
PathTransition moonTransition = new PathTransition();
moonTransition.setDuration(Duration.millis(10000));
moonTransition.setPath(path);
moonTransition.setNode(moon);
moonTransition.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
moonTransition.setAutoReverse(false);
SequentialTransition sequentialTransition = new SequentialTransition();
sequentialTransition.setCycleCount(Timeline.INDEFINITE);
sequentialTransition.setAutoReverse(false);
sequentialTransition.getChildren().addAll(ft, sunTransition, ft1, moonTransition);
sequentialTransition.play();
}