Skip to content

Commit ea07ede

Browse files
committed
update readme
1 parent d603b35 commit ea07ede

File tree

1 file changed

+4
-97
lines changed

1 file changed

+4
-97
lines changed

README.md

Lines changed: 4 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -18,100 +18,7 @@ Easy to use and fully customized modal picker for both iOS and Android. Have sam
1818

1919
## Usage
2020

21-
For simple modal picker example
22-
23-
```js
24-
import React, {Component} from 'react';
25-
import {StyleSheet, Text, View, Button, TouchableOpacity} from 'react-native';
26-
import Picker from 'react-native-simple-modal-picker';
27-
28-
export default class Example extends Component {
29-
constructor(props){
30-
super(props)
31-
this.state={
32-
selectedIndex: 0
33-
}
34-
this.data=[
35-
{
36-
name:'Option 1',
37-
value: '1'
38-
},
39-
{
40-
name:'Option 2',
41-
value: '2'
42-
},
43-
{
44-
name:'Option 3',
45-
value: '3'
46-
},
47-
{
48-
name:'Option 4',
49-
value: '4'
50-
},
51-
{
52-
name:'Option 5',
53-
value: '5'
54-
}
55-
]
56-
}
57-
58-
render() {
59-
return (
60-
<View style={styles.container}>
61-
{this.simplePickerView()}
62-
{this.customRowPickerView()}
63-
{this.dropDownView()}
64-
</View>
65-
);
66-
}
67-
68-
simplePickerView(){
69-
return(
70-
<View>
71-
<Picker
72-
ref={instance => this.simplePicker = instance}
73-
data={this.data}
74-
label={'name'}
75-
value={'value'}
76-
onValueChange={(value) => alert(value + ' selected')} />
77-
78-
<View style={styles.subContainer}>
79-
<Button
80-
title={'Open Simple Picker'}
81-
onPress={() => this.simplePicker.setModalVisible(true)} />
82-
</View>
83-
</View>
84-
)
85-
}
86-
87-
}
88-
89-
const styles = StyleSheet.create({
90-
container: {
91-
flex: 1,
92-
justifyContent: 'center',
93-
backgroundColor: '#F5FCFF',
94-
},
95-
subContainer:{
96-
margin: 8
97-
},
98-
rowStyle:{
99-
backgroundColor: '#FFF',
100-
color: '#333',
101-
padding: 8,
102-
fontSize: 20
103-
},
104-
dropDownContainer:{
105-
borderBottomWidth: 1,
106-
padding: 8
107-
},
108-
dropDownText:{
109-
fontSize: 20,
110-
margin: 8
111-
}
112-
});
113-
114-
```
21+
Here full [example](https://github.com/binbytes/react-native-simple-modal-picker/tree/master/example) of package usage
11522

11623
#### Simple Modal Picker
11724

@@ -126,7 +33,7 @@ const styles = StyleSheet.create({
12633

12734
```
12835

129-
![Simple](https://github.com/binbytes/react-native-simple-modal-picker/blob/master/screenshot/simple.gif?raw=true)
36+
![Simple](https://i.imgur.com/xcriwIC.gif)
13037

13138
#### Modal Picker with Custom Row
13239

@@ -142,7 +49,7 @@ const styles = StyleSheet.create({
14249

14350
```
14451

145-
![Custom](https://github.com/binbytes/react-native-simple-modal-picker/blob/master/screenshot/custom.gif?raw=true)
52+
![Custom](https://i.imgur.com/NSZ0NfW.gif)
14653

14754
#### DropDown View
14855

@@ -164,4 +71,4 @@ const styles = StyleSheet.create({
16471

16572
```
16673

167-
![DropDown](https://github.com/binbytes/react-native-simple-modal-picker/blob/master/screenshot/dropdown.gif?raw=true)
74+
![DropDown](https://i.imgur.com/rPTVTh6.gif)

0 commit comments

Comments
 (0)