private _updateTransition()

in src/web/Animated.tsx [651:712]


        private _updateTransition() {
            // We should never get here if the component isn't mounted,
            // but we'll add this additional protection.
            if (!this._mountedComponent) {
                return;
            }

            const activeTransitions: TransitionSpec[] = [];
            _.each(this._animatedAttributes, attrib => {
                if (attrib.activeTransition) {
                    activeTransitions.push(attrib.activeTransition);
                }
            });

            // If there are any transform transitions, we need to combine
            // these into a single transition. That means we can't specify
            // different durations, delays or easing functions for each. That's
            // an unfortunate limitation of CSS.
            const keys = _.keys(this._animatedTransforms);
            const index = _.findIndex(keys, key => !!this._animatedTransforms[key].activeTransition);
            if (index >= 0) {
                const transformTransition = this._animatedTransforms[keys[index]].activeTransition!;
                activeTransitions.push({
                    property: 'transform',
                    from: this._generateCssTransformList(false),
                    to: this._generateCssTransformList(true),
                    duration: transformTransition.duration,
                    timing: transformTransition.timing,
                    delay: transformTransition.delay,
                });
            }

            if (activeTransitions.length > 0) {
                const domNode = this._getDomNode();
                if (domNode) {
                    executeTransition(domNode, activeTransitions, () => {
                        // Clear all of the active transitions and invoke the onEnd callbacks.
                        const completeTransitions: ExtendedTransition[] = [];

                        _.each(this._animatedAttributes, attrib => {
                            if (attrib.activeTransition) {
                                completeTransitions.push(attrib.activeTransition);
                                delete attrib.activeTransition;
                            }
                        });

                        _.each(this._animatedTransforms, transform => {
                            if (transform.activeTransition) {
                                completeTransitions.push(transform.activeTransition);
                                delete transform.activeTransition;
                            }
                        });

                        _.each(completeTransitions, transition => {
                            if (transition.onEnd) {
                                transition.onEnd({ finished: true });
                            }
                        });
                    });
                }
            }
        }