Skip to content

Instantly share code, notes, and snippets.

@ranveerching
Created August 8, 2020 13:09
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ranveerching/558e9ee57f3075126fff9ea6377e9496 to your computer and use it in GitHub Desktop.
Save ranveerching/558e9ee57f3075126fff9ea6377e9496 to your computer and use it in GitHub Desktop.
import React from 'react';
import {
View,
StyleSheet,
StatusBar
} from 'react-native';
import Animated, {
useCode,
Easing,
interpolate
} from 'react-native-reanimated';
import {
useValue,
loop
} from 'react-native-redash';
const {
set,
concat
} = Animated;
const Loop = () => {
const animatedValue = useValue(0);
useCode(() => {
return set(animatedValue, loop({
duration: 2500,
easing: Easing.linear
}));
}, [animatedValue]);
const rotation = interpolate(animatedValue, {
inputRange: [0, 1],
outputRange: [0, 360]
});
return (
<View style={styles.container}>
<StatusBar barStyle="light-content" backgroundColor="#3f51b5" />
<Animated.View style={[
styles.animatedView, {
transform: [{
rotate: concat(rotation, 'deg')
}]
}
]} />
</View>
)
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center'
},
animatedView: {
height: 200,
width: 200,
backgroundColor: '#3f51b5'
}
});
export default Loop;
@danieloi
Copy link

This was just what I needed. Thank you!

@ranveerching
Copy link
Author

This was just what I needed. Thank you!

Glad to hear @danieloi. Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment