diff --git a/Libraries/Animated/src/AnimatedImplementation.js b/Libraries/Animated/src/AnimatedImplementation.js index fd65b6b238c0d4..d9f50f9b350376 100644 --- a/Libraries/Animated/src/AnimatedImplementation.js +++ b/Libraries/Animated/src/AnimatedImplementation.js @@ -34,7 +34,10 @@ var NativeAnimatedAPI = NativeAnimatedHelper.API; var warnedMissingNativeAnimated = false; -function shouldUseNativeDriver(config: AnimationConfig | EventConfig): boolean { +function shouldUseNativeDriver(config?: AnimationConfig | EventConfig | AnimatedValueConfig): boolean { + if (!config) { + return false; + } if (config.useNativeDriver && !NativeAnimatedHelper.isNativeAnimatedAvailable()) { if (!warnedMissingNativeAnimated) { @@ -48,7 +51,6 @@ function shouldUseNativeDriver(config: AnimationConfig | EventConfig): boolean { } return false; } - return config.useNativeDriver || false; } @@ -682,6 +684,10 @@ class SpringAnimation extends Animation { } } +type AnimatedValueConfig = { + useNativeDriver?: bool; +}; + type ValueListenerCallback = (state: {value: number}) => void; var _uniqueId = 1; @@ -700,12 +706,15 @@ class AnimatedValue extends AnimatedWithChildren { _listeners: {[key: string]: ValueListenerCallback}; __nativeAnimatedValueListener: ?any; - constructor(value: number) { + constructor(value: number, config?: AnimatedValueConfig) { super(); this._value = value; this._offset = 0; this._animation = null; this._listeners = {}; + if (shouldUseNativeDriver(config)) { + this.__makeNative(); + } } __detach() { @@ -964,7 +973,7 @@ class AnimatedValueXY extends AnimatedWithChildren { y: AnimatedValue; _listeners: {[key: string]: {x: string, y: string}}; - constructor(valueIn?: ?{x: number | AnimatedValue, y: number | AnimatedValue}) { + constructor(valueIn?: ?{x: number | AnimatedValue, y: number | AnimatedValue}, config?: AnimatedValueConfig) { super(); var value: any = valueIn || {x: 0, y: 0}; // @flowfixme: shouldn't need `: any` if (typeof value.x === 'number' && typeof value.y === 'number') { @@ -981,6 +990,9 @@ class AnimatedValueXY extends AnimatedWithChildren { this.y = value.y; } this._listeners = {}; + if (shouldUseNativeDriver(config)) { + this.__makeNative(); + } } setValue(value: {x: number, y: number}) { @@ -1955,6 +1967,9 @@ var spring = function( value: AnimatedValue | AnimatedValueXY, config: SpringAnimationConfig, ): CompositeAnimation { + if (value.__isNative) { + config.useNativeDriver = true; + } return maybeVectorAnim(value, config, spring) || { start: function(callback?: ?EndCallback): void { callback = _combineCallbacks(callback, config); @@ -1984,6 +1999,9 @@ var timing = function( value: AnimatedValue | AnimatedValueXY, config: TimingAnimationConfig, ): CompositeAnimation { + if (value.__isNative) { + config.useNativeDriver = true; + } return maybeVectorAnim(value, config, timing) || { start: function(callback?: ?EndCallback): void { callback = _combineCallbacks(callback, config); @@ -2013,6 +2031,9 @@ var decay = function( value: AnimatedValue | AnimatedValueXY, config: DecayAnimationConfig, ): CompositeAnimation { + if (value.__isNative) { + config.useNativeDriver = true; + } return maybeVectorAnim(value, config, decay) || { start: function(callback?: ?EndCallback): void { callback = _combineCallbacks(callback, config);