NativeAnimatedModule

Module that exposes interface for creating and managing animated nodes on the "native" side.

Animated.js library is based on a concept of a graph where nodes are values or transform operations (such as interpolation, addition, etc) and connection are used to describe how change of the value in one node can affect other nodes.

Few examples of the nodes that can be created on the JS side:

• Animated.Value is a simplest type of node with a numeric value which can be driven by an animation engine (spring, decay, etc) or by calling setValue on it directly from JS
• Animated.add is a type of node that may have two or more input nodes. It outputs the sum of all the input node values
• interpolate - is actually a method you can call on any node and it creates a new node that takes the parent node as an input and outputs its interpolated value (e.g. if you have value that can animate from 0 to 1 you can create interpolated node and set output range to be 0 to 100 and when the input node changes the output of interpolated node will multiply the values by 100)

You can mix and chain nodes however you like and this way create nodes graph with connections between them.

To map animated node values to view properties there is a special type of a node: AnimatedProps. It is created by AnimatedImplementation whenever you render Animated.View and stores a mapping from the view properties to the corresponding animated values (so it's actually also a node with connections to the value nodes).

Last "special" elements of the graph are "animation drivers". Those are objects (represented as a graph nodes too) that based on some criteria updates attached values every frame (we have few types of those, e.g., spring, timing, decay). Animation objects can be "started" and "stopped". Those are like "pulse generators" for the rest of the nodes graph. Those pulses then propagate along the graph to the children nodes up to the special node type: AnimatedProps which then can be used to calculate property update map for a view.

This class acts as a proxy between the "native" API that can be called from JS and the main class that coordinates all the action: NativeAnimatedNodesManager. Since all the methods from NativeAnimatedNodesManager need to be called from the UI thread, we we create a queue of animated graph operations that is then enqueued to be executed in the UI Thread at the end of the batch of JS->native calls (similarly to how it's handled in UIManagerModule). This isolates us from the problems that may be caused by concurrent updates of animated graph while UI thread is "executing" the animation loop.