JavaFX using Kawa - simple animation
Read JavaFX-using-Kawa-intro first. That introduces JavaFX and how you can use Kawa to write rich GUI applications.
This example demonstrates simple animation: A rectangle that moves
smoothly left to right and back again continuously.
This is example is converted from HelloAnimation.java written in Java by Kevin Rushforth. Here is the entire program HelloAnimation.scm:
(require 'javafx-defs) (javafx-application) (define rect (Rectangle x: 25 y: 40 width: 100 height: 50 fill: Color:RED)) (javafx-scene title: "Hello Animation" width: 600 height: 450 fill: Color:LIGHTGREEN rect) ((Timeline cycle-count: Timeline:INDEFINITE auto-reverse: #t (KeyFrame (Duration:millis 500) (KeyValue (rect:xProperty) 200))):play)
The first two lines are boilerplate, as in JavaFX-using-Kawa-intro.
The (define rect (Rectange ...)) defines a variable
rect, and initializes it to a new Rectangle,
using an object constructor as seen before.
The (javafx-scene ...) operations creates the scene with
the specified title, width, height
and fill (background color) properties.
It adds the rect to the scene, and then creates a window to make it visible.
Finally, we animate rect. This requires some background explanation.
Key values and key frames
To animate a scene you create a TimeLine data structure,
which describes what properties to modify and when to do so.
Once you have done so, call play on the TimeLine,
which instructs JavaFX's animation engine to start running the animation.
In this example, the animation continuous indefinitely:
When done, it reverses (because auto-reverse was set to true)
and starts over.
The timeline is divided into a fixed number of
key frames,
which are associated with a specific point in time.
In the current example there is the implicit starting key-frame
at time 0, and an explicit key-frame at time 500 (milliseconds).
(The KeyFrame specifies a duration or ending time,
where the start time is the ending time of the previous key-frame,
or 0 in the case of the first key-frame.)
The animator (or programmer) specifies various properties (such
as positions and sizes of objects) at each key-frame, and then the
computer smoothly interpolates between the key-frames.
By default the interpolation is linear, but you can specify other
kinds of interpolation.
Each KeyFrame consists of some KeyValue objects.
A KeyValue species which property to modify
and the ending value that the property will have at the end of the key-frame.
In the example, we have a single KeyValue to modify
rect:x, ending at 200. (The start value is 25, as set when
rect was constructed.)
In JavaFX, the properties to animate are specified using
Property objects. Typeically, a property is a reference
to a specific field in a specific object instance. You register the
property with the animation engine (as shown in the sample), and then
the animation engine uses the property to modify the field.
In the example the expression (rect:xProperty)
(equivalent to the Java method call rect.xProperty())
returns a property that references the x property
of the rect object.
The Property object also has ways to register dependencies
(rather like change listeners) so that things get updated
when the property is changed. (For example the rectangle is re-drawn
when its x property changes.)
Here is a static screenshot - obviously an animiated gif would be nicer here!
