JavaFX示例--TimeLine和Animation的使用

这两天工作很忙，由于要进行Android平板上的一个项目的final release，前天晚上加班到11点多，昨天晚上加班到凌晨4点多。所以之前说的Sourceforge的首页也才做了一部分。不过，由于项目final release，今天比较轻松，写了几个JavaFX的示例。

上面就是一个简单的示例。

示例的演示地址:http://wjfxgame.sourceforge.net/examples/exp1/AniTest.html

点击Start开始动画。

主要是应用了JavaFX中的Timeline和Animation。

Timeline在之前的博文中，很多地方用到了。也就是一个时间轴，然后通过添加关键帧来形成动画。

而Animation，主要是对Node进行动画处理。JavaFX中的动画在javafx.animation包中。而Animation有两个子类，Timeline和Transition。也就是说，按照API中的层级关系来看，Timeline是Animation的一种。

当然，我们也就不必纠结标题中的Timeline和Animation了。

Transition共有10个子类，分别是：FadeTransition, FillTransition, ParallelTransition, PathTransition, PauseTransition, RotateTransition, ScaleTransition, SequentialTransition, StrokeTransition, TranslateTransition。

其实子类虽多，但动画的基本效果都可以根据命名前缀来判断。基本都是Node属性的改变，像边框色，填充色，透明度，缩放，旋转，平移，按路径移动和暂停。

只有ParallelTransition是并行动画(一系列动画同时进行)，SequentialTransition是顺序动画(一系列动画按顺序执行)。

下面看一下源代码:

import javafx.animation.*;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToggleGroup;
import javafx.scene.effect.Bloom;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.*;
import javafx.util.Duration;/**** @author wing*/
public class TestPane extends Pane{private ParallelTransition mAnimList;private Timeline timeline;private HBox hBox;private ToggleButton start, pause, stop;private ToggleGroup btnGroup;private double duration = 200;public TestPane(){btnGroup = new ToggleGroup();start = new ToggleButton("Start");start.setToggleGroup(btnGroup);start.setOnAction(new EventHandler<ActionEvent>() {@Overridepublic void handle(ActionEvent arg0) {timeline.play();checkUIState();}});pause = new ToggleButton("Pause");pause.setToggleGroup(btnGroup);pause.setOnAction(new EventHandler<ActionEvent>() {@Overridepublic void handle(ActionEvent arg0) {timeline.pause();checkUIState();}});       stop = new ToggleButton("Stop");stop.setToggleGroup(btnGroup);stop.setOnAction(new EventHandler<ActionEvent>() {@Overridepublic void handle(ActionEvent arg0) {timeline.stop();checkUIState();}});   hBox = new HBox(10);hBox.getChildren().addAll(start, pause, stop);hBox.setTranslateX((Anitest.WIDTH - 200) / 2);hBox.setTranslateY(20);getChildren().add(hBox);timeline = new Timeline();timeline.setCycleCount(Timeline.INDEFINITE);KeyFrame keyFrame = new KeyFrame(Duration.millis(duration), new EventHandler<ActionEvent>() {@Overridepublic void handle(ActionEvent event) {createObject();}});timeline.getKeyFrames().add(keyFrame);}/*** 检测start pause stop三个按钮的状态*/public void checkUIState(){start.setDisable(false);pause.setDisable(false);stop.setDisable(false);switch(timeline.getStatus()){case RUNNING:start.setDisable(true);break;case PAUSED:pause.setDisable(true);break;case STOPPED:stop.setDisable(true);break;}}/*** 创建一个Object 并执行动画,在这里创建了一个ParallelTransition，并在其中添加了随机左右上下平移的TranslateTransition，透明度逐渐变为0的FadeTransition和逐渐放大0.2倍的ScaleTransition。将刚创建的Object与组合这个三个动画的ParallelTransition绑定，然后执行ParallelTransition。*/public void createObject() {double width = Math.max(50, Math.random() * 200);double height = Math.max(50, Math.random() * 200);        double x = Math.min(Math.random() * Anitest.WIDTH, Anitest.WIDTH - width);double y = Math.max(Math.random() * (Anitest.HEIGHT - 100), 100);double dx = Math.random() * 50;double dy = Math.random() * 50;final Shape shape = new Circle(x, y, width / 2);shape.setEffect(new Bloom(50));shape.setFill(Color.rgb((int) (Math.random() * 255), (int) (Math.random() * 255), (int) (Math.random() * 255)));getChildren().add(shape);mAnimList = new ParallelTransition(shape,TranslateTransitionBuilder.create().byX(Math.random() > 0.5 ? dx : -dx).byY(Math.random() > 0.5 ? dy : -dy).duration(Duration.millis(1000)).build(),FadeTransitionBuilder.create().toValue(0).duration(Duration.millis(1000)).build(),ScaleTransitionBuilder.create().byX(0.2).byY(0.2).duration(Duration.millis(800)).build());mAnimList.play();mAnimList.setOnFinished(new EventHandler<ActionEvent>() {@Overridepublic void handle(ActionEvent arg0) {getChildren().remove(shape);}});}
}

并在动画结束的时候，将刚创建的Object进行移除操作。

这里的Transition都是用各自的Builder来创建。

至于为何这里会继承Pane，主要是这些示例我之后都会加进Sourceforge首页的站点中，在那个App里会使用到。

下面是Main类:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;/*** @author wing* 2012/8/30*/
public class Anitest extends Application {public static final int WIDTH = 800;public static final int HEIGHT = 600;public static void main(String[] args) {launch(args);}@Overridepublic void start(Stage primaryStage) {TestPane mPane = new TestPane();StackPane root = new StackPane();root.getChildren().add(mPane);Scene scene = new Scene(root, WIDTH, HEIGHT);scene.setFill(Color.BLACK);primaryStage.setScene(scene);primaryStage.setTitle("JavaFX示例--TimeLine和Animation的使用");primaryStage.show();}
}

Main类就不做解释了，都是很基本的内容。

转载请注明出处:http://blog.csdn.net/ml3947/

---------------------------------------------------------

本来是尝试在博文中嵌入Applet，尝试了半天没成功，但是又看到以前一直关注的一位牛人博客里嵌入过。顿感奇怪中。准备以后再看看。

所以就直接给了演示的地址。如果系统没安装JavaFX的时候，应该会提示你安装新版Java去。因为JRE7中已经包含了JavaFX了。

JavaFX示例--TimeLine和Animation的使用相关推荐

JavaFX官方教程（三）之JavaFX示例应用程序入门
翻译自 JavaFX示例应用程序入门此示例应用程序集旨在帮助您开始使用常见的JavaFX任务,包括使用布局,控件,样式表,FXML和视觉效果. Hello World,JavaFX Style ...
javafx 示例_JavaFX列表示例
javafx 示例这是使用JavaFX构建的示例列表应用程序. 该应用程序是待办事项列表. 该应用程序具有添加,更新和删除列表中项目的功能. 列表数据存储在HSQLDB关系数据库中. 该应用程序使用 ...
javafx 示例_示例介绍：JavaFX 8打印
javafx 示例我有一段时间没有写博客了,我想与其他人分享有关JavaFX的所有信息(我的日常工作和家庭可能是借口). 对于那些对此博客不熟悉的人 ,我是JavaFX 2 Introduction ...
Timeline的Animation Track详解
你好,我是跟着大智学Unity的萌新,我叫小新,这是我本周的学习总结报告哦. 在Timeline中,Animation Track可能是我们用的最多的一个轨道了,而且功能也相对比较多,今天小新就来总结 ...
Unity TimeLine丨A1.创建TimeLine、Animation Track，Extrapolation属性讲解
TimeLine与Animator区别: Animator动画应用于人形.非人形模型,对单个物体进行动画控制 TimeLine可结合多个游戏物体做过场动画,呈现出电影效果一.创建TimeLine T ...
TimeLine及Animation动画的坑
TimeLine只支持新版的animation控件制作的动画(animation在2018.3版本更新了) 如果是旧版的animation,右键Inspector调出Debug界面,不勾选Legacy ...
JavaFX官方教程（八）之JavaFX中的动画和视觉效果
翻译自 JavaFX中的动画和视觉效果您可以使用JavaFX快速开发具有丰富用户体验的应用程序.在本入门教程中,您将学习如何使用非常少的编码创建动画对象并获得复杂的效果. 图7-1显示了要创建的应 ...
JavaFX 2 GameTutorial第2部分
介绍 Ť他的是一系列与一个JavaFX 2游戏教程博客条目的第二批. 如果您尚未阅读第1部分,请参阅JavaFX 2游戏教程的简介部分. 在第1部分中,我提到了游戏的某些方面以及原型飞船的简单演示(原 ...

JavaFX示例--TimeLine和Animation的使用

JavaFX示例--TimeLine和Animation的使用相关推荐

最新文章

热门文章