Skip to content

Commit 5a96595

Browse files
Readme Updated
1 parent efd7a87 commit 5a96595

File tree

1 file changed

+34
-2
lines changed

1 file changed

+34
-2
lines changed

readme.md

+34-2
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,10 @@ npm install react-native-animated-loader --save
3434
```
3535

3636
## Usage
37-
37+
### Class Component
3838
```jsx
3939
import React from 'react';
40-
import { StyleSheet } from 'react-native';
40+
import { StyleSheet,Text } from 'react-native';
4141
import AnimatedLoader from "react-native-animated-loader";
4242

4343
export default class Loader extends React.Component {
@@ -76,6 +76,38 @@ const styles = StyleSheet.create({
7676
height: 100
7777
}
7878
});
79+
```
80+
### Functional Component
81+
82+
```jsx
83+
import React, {useState, useEffect} from 'react';
84+
import {StyleSheet, Text} from 'react-native';
85+
import AnimatedLoader from 'react-native-animated-loader';
86+
export default function App() {
87+
const [visible, setVisible] = useState(false);
88+
useEffect(() => {
89+
setInterval(() => {
90+
setVisible(!visible);
91+
}, 2000);
92+
}, []);
93+
94+
return (
95+
<AnimatedLoader
96+
visible={visible}
97+
overlayColor="rgba(255,255,255,0.75)"
98+
animationStyle={styles.lottie}
99+
speed={1}>
100+
<Text>Doing something...</Text>
101+
</AnimatedLoader>
102+
);
103+
}
104+
const styles = StyleSheet.create({
105+
lottie: {
106+
width: 100,
107+
height: 100,
108+
},
109+
});
110+
79111
```
80112

81113
### Loader files

0 commit comments

Comments
 (0)