JavaFX Code Recipes - JavaFX: Developing Rich Internet Applications - page 313

type == FadeType.BOTH ) {
fade();
} else {
visible = false;

}
}
}

You may be wondering why we did not just use the visible variable and add a
trigger to it to commence the animations. Normally, a node becomes visible
when the visible instance variable is set to true and invisible when it is set to
false. We could have done an override on the visible variable and added an on
replace trigger to start the fade animation, similar to Listing 12.7.

Listing 12.7 Fader.fx - visible

public override var visible on replace {
if(visible) {
fade();
} else if ( type == FadeType.OUT or
type == FadeType.BOTH ) {
fade(); // WILL NOT SHOW BECAUSE
// NODE IS ALREADY MADE INVISIBLE

}
}

This does work when the visible variable is set to true. However, when the
visible variable is set to false, the JavaFX framework immediately sets the
node to invisible, so any subsequent animations do not have any visual effect.
Because of this, we introduced the show instance variable. When show is set to
true, visible is set to true and the fade animation starts. When show is set to false,
the fade animation starts and the end result of the animation is to set the node's
visible variable to false.

The strategy is to use one Timeline . For fade in, the Timeline progresses for-
ward and the opacity transitions from transparent (0.0) to fully opaque (1.0),
while the scale transitions to endScale . For fade out, the Timeline plays in
reverse from the end to the beginning, so that opacity transitions to transparent
(0.0), and the scale transitions back to startScale . In this reverse direction,
when the timeline reaches the beginning or 0 instant, then the visible variable
is set to false. The timeline is shown in Listing 12.8.