https://github.com/louaysleman/react-native-spinning-loader

https://github.com/louaysleman/react-native-spinning-loader

Last synced: 6 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/louaysleman/react-native-spinning-loader
• Owner: louaySleman
• Created: 2022-04-09T15:52:35.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2022-04-09T16:15:06.000Z (over 3 years ago)
• Last Synced: 2025-02-12T12:52:07.968Z (8 months ago)
• Language: Java
• Size: 958 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md

Awesome Lists containing this project

README

          
#react native spinner animation

this project an example of how to make a spinner using `react-native` without using any 3rd party library in the project.

##Live demo:

![Test Image 3](demo/demo.gif)

##Code:

```javascript

const App: () => Node = () => {

  const spinValue = new Animated.Value(0);

  const spin = () => {

    spinValue.setValue(0);

    Animated.timing(spinValue, {

      toValue: 1,

      duration: 1500,

      easing: Easing.linear,

      useNativeDriver: true,

    }).start(() => spin());

  };

  useEffect(() => {

    spin();

  }, []);

  const rotate = spinValue.interpolate({

    inputRange: [0, 1],

    outputRange: ['0deg', '360deg'],

  });

  return (

    

      

        

          

        

      

    

  );

};

```

Hope you like it.