Object

MoveInAnimation

The animation whereby a component moves in from the side of the screen.

Properties

type
string
(Required)

This animation always has the type move_in.

preferredStartingPosition
string

Indicates which side of the screen should be the starting point of the animation. Valid values:

  • left: Move the component in from the left side of the screen.

  • right: Move the component in from the right side of the screen.

By default, the animation will start on the side that is closest to the component.

userControllable
boolean

Indicates whether the animation is controlled by (is in response to) user action (true) or happens automatically (false).

Discussion

With this animation type the component moves into view from the left or right side of the screen. Initially, the component is out of view as shown in this video.

You can configure a preferred starting position, but the position is not guaranteed. For example, if another component is blocking the preferred position, the MoveInAnimation will attempt to start from the opposite side. If both sides are covered by other components, the MoveInAnimation will not be applied.

Example

{ "components": [ { "role": "heading1", "text": "2. Unbeatable Heat" }, { "role": "figure", "URL": "bundle://figure.jpg", "animation": { "type": "move_in", "preferredStartingPosition": "left" } } ]}

Relationships

Inherits From

See Also

Animations

About Component Animations

Learn how to affect the way in which components come into view.

object ComponentAnimation

Properties shared by all the animations.

object AppearAnimation

The animation whereby a component appears on the screen.

object FadeInAnimation

The animation whereby a component fades into view.

object ScaleFadeAnimation

The animation in which a component scales up and fades into view.