Java Reference
In-Depth Information
Creating simple animation with the
Transition API
As you read this chapter, you will find out that JavaFX provides a powerful animation engine
that lets you create complex sequences (see the
Introduction
). However, if your need is to
create simple straightforward animated sequences, JavaFX has got you covered. In this recipe,
we will explore how to create simple animations quickly using the JavaFX Transition-API.
Getting ready
Before you can create transition-based animations, you must be familiar with the steps
required to create simple shapes using the Shape API. See
Chapter 2
,
Drawing simple
shapes
for background information on creating simple shapes.
All of the classes provided by the Transition API are located in the package
javafx.
animation.transition
. There you will find several classes representing the type
of animations they support, including
TranslateTransition
,
ScaleTransition
,
PathTransition
,
FadeTransition
, and
RotateTransition
.
The next code snippet shown will use an instance of
PathTransition
to demonstrate the
simplicity and flexibility of the API. The
PathTransition
class makes use of the Path API,
which was discussed in
Chapter 2
, under the recipe
Creating complex shapes using Path
, to
animate an object along a specified path.
How to do it...
The next code snippet shows you how to use the PathTransition API to animate an object
along a specified path. The full code listing can be accessed from
ch03/source-code/src/
animation/trans/PathTransitionDemo.fx
.
def w = 400;
def h = 200;
def r = 30;
def mv = 60;
def circle = Circle {
centerX: 0; centerY: 0 radius: r
fill: Color.BLUE stroke: Color.WHITE strokeWidth: 3
}
var path = Path {
elements:[
MoveTo{x:0 y:0}
HLineTo { x: mv}
