The Scene Graph API includes several nodes to animate screen elements. You can move screen elements around, make them disappear and reappear, and change color. Animating screen elements requires the use of one of the node classes derived from AnimationBase, which must include a child interpolator node to actually achieve a specific animation effect. The animation and interpolator node classes are:
All animations require that you target a specific field of a specific renderable node or group of renderable nodes. You must also start (and stop, if wanted) the animation in BrightScript code by setting the value of the animation
The child interpolator nodes each operate on different types of target node field values. The FloatFieldInterpolator node class operates on target node field values of type
float, which includes the
rotation fields. Use a FloatFieldInterpolator node to fade the target node in or out of visibility, or to rotate the target node. The Vector2DFieldInterpolator operates on target node field values of type
vector2d, which includes the
scale fields. Use a Vector2DFieldInterpolator node to move the target node around the screen display, or to enlarge or shrink it. The ColorFieldInterpolator node class operates on target node fields of type
color, so can be used to change the color of a target node that includes a color field.
The child interpolator nodes each include two field arrays:
keyValue. These two arrays must contain the same number of elements in order for the animation to work. The key field array contains the fractional values of the animation duration at which the target node field value in the corresponding
keyValue array position will be set.
The following summarizes how to achieve certain animation effects.
|Move||Vector2DFieldInterpolator||You can move the element off the screen entirely, or over/under other elements at different z-order positions in the Scene Graph|
|Enlarge/Shrink||Vector2DFieldInterpolator||Set the target |
|Rotate||FloatFieldInterpolator||Set the target |
|Change Color||ColorFieldInterpolator||color||The interpolator for the |
You can try out these concepts by downloading and installing this sample: SimpleAnimation.zip. It shows a number of animation types, including opacity, translation, and color animations.