Add callback function when animation completes.

If the animation finished running normally, the completion callback will be invoked with {finished: true}. If the animation is done because stop() was called on it before it could finish (e.g. because it was interrupted by a gesture or another animation), then it will receive {finished: false}.

README.md

@@ -84,8 +84,8 @@ You can configure the passing by following props:
 - **friction** - the friction value for the spring animation (see [here](https://facebook.github.io/react-native/docs/animations.html#core-api))
 - **linecap** - the shape to be used at the ends of the circle. Possible values: butt (default), round or square. (see [here](https://developer.mozilla.org/en/docs/Web/SVG/Attribute/stroke-linecap))
 - **children(fill)** - you can pass function as a child to receive current fill
-
-
+- **onAnimationComplete** - you can pass a callback function that will be invoked when animation is complete. (see [here](https://facebook.github.io/react-native/docs/animated.html#working-with-animations))
+- **onLinearAnimationComplete** - you can pass a callback function that will be invoked when linear animation is complete. (see [here](https://facebook.github.io/react-native/docs/animated.html#working-with-animations))
 ## Working example app
 
 You can find working example in the `example` directory of this repository. You can run it by:

src/AnimatedCircularProgress.js

@@ -24,7 +24,7 @@ export default class AnimatedCircularProgress extends React.Component {
   }
 
   animateFill() {
-    const { tension, friction } = this.props;
+    const { tension, friction, onAnimationComplete } = this.props;
 
     Animated.spring(
       this.state.chartFillAnimation,
@@ -33,14 +33,16 @@ export default class AnimatedCircularProgress extends React.Component {
         tension,
         friction
       }
-    ).start();
+    ).start(onAnimationComplete);
   }
 
   performLinearAnimation(toValue, duration) {
+    const { onLinearAnimationComplete } = this.props;
+
     Animated.timing(this.state.chartFillAnimation, {
       toValue: toValue,
       duration: duration
-    }).start();
+    }).start(onLinearAnimationComplete);
   }
 
   render() {
@@ -64,7 +66,9 @@ AnimatedCircularProgress.propTypes = {
   tintColor: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   backgroundColor: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   tension: PropTypes.number,
-  friction: PropTypes.number
+  friction: PropTypes.number,
+  onAnimationComplete: PropTypes.func,
+  onLinearAnimationComplete: PropTypes.func,
 }
 
 AnimatedCircularProgress.defaultProps = {