Effect: Visual Transitions - JavaFX Special Effects - page 62

upper-left and upper-right y values. These variables are lx , ly , ulx , and uly . When the variable angle is
updated, lx , ly , uly , and ulx will be updated as well.
The value angle is updated by an animation with four KeyFrames , plus one KeyFrame for the callback
function. The first two KeyFrames rotate nodeToReplace from 90.0 degrees to 0.0 degrees, leaving the node
as if viewed from the edge; nodeToReplace is then replaced with replacementNode . Next, replacementNode
is rotated from 180.0 degrees back to the original 90.0 degrees, leaving replacementNode in the location
and orientation as nodeToReplace started.
Though the animation looks as though it performs a 180.0-degree rotation, it does not. As stated
previously, the rotation is broken into two steps, from 0.0 to 90.0 and then from 180.0 to 90.0. This is
done because applying a 180.0 degree to the final node would leave it displaying its content backwards.
Example 4: Wipe Replace
The wipe replace animates from one node to another by incrementally displaying more and more of the
replacement node until the original node is completely covered. This is similar to the star wipe as seen
on TV. The star wipe was a way of moving from scene to scene in older TV shows. In this case, however,
we are going to use a circle to perform the wipe, as it makes for simpler example code.
Figure 3-6. Wipe replace