Fix bug on Android where the drawing is not displayed after the app is backgrounded / screen is turned off. Restart the animation when the app comes back to the foreground.

Bump version to 0.1.2.

Adapted from gamingumar's PR.
This commit is contained in:
Markus Lindqvist 2017-12-27 21:40:05 +02:00
parent ec3361562b
commit dfdb4c01d5
2 changed files with 22 additions and 2 deletions

View File

@ -1,6 +1,6 @@
{
"name": "react-native-circular-progress",
"version": "0.1.1",
"version": "0.1.2",
"description": "React Native component for creating animated, circular progress with ReactART",
"main": "index.js",
"repository": {

View File

@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Animated, Easing, View, ViewPropTypes } from 'react-native';
import { Animated, AppState, Easing, View, ViewPropTypes } from 'react-native';
import CircularProgress from './CircularProgress';
const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
@ -9,12 +9,32 @@ export default class AnimatedCircularProgress extends React.Component {
constructor(props) {
super(props);
this.state = {
appState: AppState.currentState,
chartFillAnimation: new Animated.Value(props.prefill || 0)
}
}
componentDidMount() {
this.animateFill();
AppState.addEventListener('change', this.handleAppStateChange);
}
componentWillUnmount() {
AppState.removeEventListener('change', this.handleAppStateChange);
}
handleAppStateChange = nextAppState => {
if (this.state.appState.match(/inactive|background/) &&
nextAppState === 'active') {
// Fix bug on Android where the drawing is not displayed after the app is
// backgrounded / screen is turned off. Restart the animation when the app
// comes back to the foreground.
this.setState({
chartFillAnimation: new Animated.Value(this.props.prefill || 0)
});
this.animateFill();
}
this.setState({ appState: nextAppState });
}
componentDidUpdate(prevProps) {