Skip to content

Commit dd7b7e0

Browse files
committed
feat: update readme
1 parent 1974f53 commit dd7b7e0

4 files changed

Lines changed: 60 additions & 5 deletions

File tree

README.md

Lines changed: 59 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# react-native-simple-gradient-progressbar-view
22

3-
Simple view that shows gedient progessbar view
3+
Simple gradient progressbar view for React Native
44

55
## Installation
66

@@ -13,13 +13,68 @@ npm install react-native-simple-gradient-progressbar-view
1313
```js
1414
import SimpleGradientProgressbarView from "react-native-simple-gradient-progressbar-view";
1515

16-
// ...
16+
<View style={styles.container}>
17+
<SimpleGradientProgressbarView
18+
style={styles.box}
19+
fromColor="#FF0000"
20+
toColor="#0000FF"
21+
progress={0.50}
22+
maskedCorners={[0, 0, 1, 1]}
23+
cornerRadius={7.0}
24+
/>
25+
<SimpleGradientProgressbarView
26+
style={styles.box}
27+
fromColor="#FF0000"
28+
toColor="#0000FF"
29+
progress={0.75}
30+
maskedCorners={[1, 1, 1, 1]}
31+
cornerRadius={7.0}
32+
/>
33+
<SimpleGradientProgressbarView
34+
style={styles.box}
35+
fromColor="#FF0000"
36+
toColor="#0000FF"
37+
progress={1.0}
38+
/>
39+
</View>
40+
);
1741

42+
const styles = StyleSheet.create({
43+
container: {
44+
flex: 1,
45+
alignItems: 'center',
46+
justifyContent: 'center',
47+
},
48+
box: {
49+
width: 300,
50+
height: 30,
51+
marginVertical: 20,
52+
borderColor: '#000000',
53+
borderWidth: 1,
54+
borderRadius: 7.0,
55+
},
56+
});
57+
58+
```
59+
60+
## Availabale properites
61+
62+
```js
63+
// Available properties
64+
type SimpleGradientProgressbarViewProps = {
65+
style: ViewStyle;
66+
fromColor: string; // color
67+
toColor: string; // color
68+
progress: number; // 0.0 - 1.0
69+
maskedCorners?: Array<number>;
70+
cornerRadius?: number;
71+
};
1872
```
1973

20-
## Contributing
74+
## Screenshots
2175

22-
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
76+
![iPhone](/screenshots/iphone.png)
77+
![Android](/screenshots/android.png)
2378

2479
## License
2580

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "react-native-simple-gradient-progressbar-view",
33
"version": "0.1.0",
4-
"description": "Simple view that shows gedient progessbar view",
4+
"description": "Simple gradient progressbar view for React Native",
55
"main": "lib/commonjs/index",
66
"module": "lib/module/index",
77
"types": "lib/typescript/index.d.ts",

screenshots/android.png

8.08 KB
Loading

screenshots/iphone.png

97.8 KB
Loading

0 commit comments

Comments
 (0)