Java Reference
In-Depth Information
With this knowledge of timelines you can animate any graph node in JavaFX. Al-
though you can create timelines in a low-level way, it can become very cumbersome.
You are probably wondering whether there are easier ways to express common anima-
tions. Good news! JavaFX has transitions ( Transition ), which are convenience
classes that perform common animated effects. Some of the common animation effects
you can create with transitions include:
javafx.animation.FadeTransition
javafx.animation.PathTransition
javafx.animation.ScaleTransition
javafx.animation.TranslateTransition
To see more transitions, see javafx.animation in the Javadoc. Because
Transition objects are also subclasses of the
javafx.animation.Animation class, you can set the cycle count and auto-re-
verse attributes. This recipe focuses on two transition effects: translate transition
( TranslateTransition ) and fade transition ( FadeTransition ).
The first requirement in the problem statement is to create a news ticker. In a news
ticker control, Text nodes scroll from right to left inside a rectangular region. When
the text scrolls to the left edge of the rectangular region you will want the text to be
clipped to create a view port that only shows pixels inside of the rectangle. To do this,
you first create a Group to hold all the components that comprise a ticker control.
Next you create a white rounded rectangle filled with 55 percent opacity. After creating
the visual region, you create a similar rectangle that represents the clipped region using
the setClip(someRectangle) method on the Group object. Figure 15-5 shows
a rounded rectangular area that serves as the clipped region.
Figure 15-5 . Setting the clipped region on the Group object
Once the ticker control is created, you bind the translate Y based on the scene's
height property minus the ticker control's height. You also bind the ticker control's
width property based on the width of scene minus the button control's width. By bind-
ing these properties, the ticker control can change its size and position whenever a user
resizes the application window. This makes the ticker control appear to float at the bot-
 
 
Search WWH ::




Custom Search