set isInteraction: false to unlock runAfterInteractions()

mfrachet · Jun 11, 2019 · e18f152 · e18f152
1 parent 7bc174b
commit e18f152
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 3 deletions.
diff --git a/docs/ANIMATIONS.md b/docs/ANIMATIONS.md
@@ -50,7 +50,9 @@ export const ColorAnimation = ({ children, style = {} }) => {
   function start() {
     return Animated.timing(animation, {
       toValue: 100,
-      duration: 1500
+      duration: 1500,
+      // NOTE: if not set, this will block InteractionManager.runAfterInteractions()
+      isInteraction: false,
     }).start(e => {
       if (e.finished) {
         start();

diff --git a/lib/dev.js b/lib/dev.js
@@ -924,6 +924,7 @@ var START_VALUE = 0.5;
 var END_VALUE = 1;
 var DURATION = 500;
 var useNativeDriver = true;
+var isInteraction = false;
 /**
  * Create a repetitive fadein / fadeout animation
  */
@@ -940,10 +941,12 @@ var Fade = function Fade(_ref) {
     reactNative.Animated.sequence([reactNative.Animated.timing(animation, {
       toValue: END_VALUE,
       duration: DURATION,
+      isInteraction: isInteraction,
       useNativeDriver: useNativeDriver
     }), reactNative.Animated.timing(animation, {
       toValue: START_VALUE,
       duration: DURATION,
+      isInteraction: isInteraction,
       useNativeDriver: useNativeDriver
     })]).start(function (e) {
       if (e.finished) {
@@ -971,6 +974,7 @@ Fade.defaultProps = {
 var START_VALUE$1 = 0;
 var END_VALUE$1 = 100;
 var DURATION$1 = 750;
+var isInteraction$1 = false;
 var styles = reactNative.StyleSheet.create({
   shine: {
     width: 30,
@@ -994,7 +998,8 @@ var Shine = function Shine(_ref) {
     animation.setValue(START_VALUE$1);
     reactNative.Animated.sequence([reactNative.Animated.timing(animation, {
       toValue: END_VALUE$1,
-      duration: DURATION$1
+      duration: DURATION$1,
+      isInteraction: isInteraction$1
     })]).start(function (e) {
       return e.finished && start();
     });

diff --git a/lib/prod.js b/lib/prod.js
@@ -245,6 +245,7 @@ var START_VALUE = 0.5;
 var END_VALUE = 1;
 var DURATION = 500;
 var useNativeDriver = true;
+var isInteraction = false;
 /**
  * Create a repetitive fadein / fadeout animation
  */
@@ -261,10 +262,12 @@ var Fade = function Fade(_ref) {
     reactNative.Animated.sequence([reactNative.Animated.timing(animation, {
       toValue: END_VALUE,
       duration: DURATION,
+      isInteraction: isInteraction,
       useNativeDriver: useNativeDriver
     }), reactNative.Animated.timing(animation, {
       toValue: START_VALUE,
       duration: DURATION,
+      isInteraction: isInteraction,
       useNativeDriver: useNativeDriver
     })]).start(function (e) {
       if (e.finished) {
@@ -292,6 +295,7 @@ Fade.defaultProps = {
 var START_VALUE$1 = 0;
 var END_VALUE$1 = 100;
 var DURATION$1 = 750;
+var isInteraction$1 = false;
 var styles = reactNative.StyleSheet.create({
   shine: {
     width: 30,
@@ -315,7 +319,8 @@ var Shine = function Shine(_ref) {
     animation.setValue(START_VALUE$1);
     reactNative.Animated.sequence([reactNative.Animated.timing(animation, {
       toValue: END_VALUE$1,
-      duration: DURATION$1
+      duration: DURATION$1,
+      isInteraction: isInteraction$1
     })]).start(function (e) {
       return e.finished && start();
     });

diff --git a/src/animation/fade.js b/src/animation/fade.js
@@ -6,6 +6,7 @@ const START_VALUE = 0.5;
 const END_VALUE = 1;
 const DURATION = 500;
 const useNativeDriver = true;
+const isInteraction = false;
 
 /**
  * Create a repetitive fadein / fadeout animation
@@ -18,11 +19,13 @@ const Fade = ({ children, style = {}, ...props }) => {
       Animated.timing(animation, {
         toValue: END_VALUE,
         duration: DURATION,
+        isInteraction,
         useNativeDriver,
       }),
       Animated.timing(animation, {
         toValue: START_VALUE,
         duration: DURATION,
+        isInteraction,
         useNativeDriver,
       }),
     ]).start((e) => {

diff --git a/src/animation/shine.js b/src/animation/shine.js
@@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
 const START_VALUE = 0;
 const END_VALUE = 100;
 const DURATION = 750;
+const isInteraction = false;
 
 const styles = StyleSheet.create({
   shine: {
@@ -27,6 +28,7 @@ const Shine = ({ children, ...props }) => {
       Animated.timing(animation, {
         toValue: END_VALUE,
         duration: DURATION,
+        isInteraction,
       }),
     ]).start(e => e.finished && start());
   }