Search code examples
javascriptreactjsreact-native

React Native: reset animated value?


In my react native app I made a very simple animated progressbar, problem is I don't know how to reset the animation.

I tried doing the bellow but it didn't work

progressValue = 0;

How can I reset animation? also why if I do something like const animation = null it says variable its read only (see commented line on my example).

This is whatI have (works except no way to reset animation):

const width = Math.round(Dimensions.get('window').width)-30;

    const progressValue = new Animated.Value(0);
    //const animation = null;

    const onStart = (duration ) => 
    {
        const animation = Animated.timing(progressValue, {
            duration: duration,
            toValue: width,
            easing: Easing.linear,
            useNativeDriver: true,
        }).start();

        
    };

    const onReset = () => 
    {
        //WHAT DO?
    };

Thanks in advance


Solution

  • If by reseting to you mean to reset the progress bar, then you can just call

    progressValue.setValue(0);
    

    If you want to restart it, then just call onStart after the upper line.