@remobile/react-native-action-sheet
Version:
A pure js ActionSheet like ios ActionSheet, support ios and android
77 lines (65 loc) • 1.97 kB
Markdown
and android
```sh
npm install @remobile/react-native-action-sheet --save
```
```js
'use strict';
var React = require('react');
var ReactNative = require('react-native');
var {
StyleSheet,
TouchableOpacity,
View,
} = ReactNative;
var ActionSheet = require('@remobile/react-native-action-sheet');
var Button = require('@remobile/react-native-simple-button');
module.exports = React.createClass({
getInitialState() {
return {
show: false
};
},
onCancel() {
this.setState({show:false});
},
onOpen() {
this.setState({show:true});
},
render() {
return (
<View style={styles.container}>
<Button onPress={this.onOpen}>Photo</Button>
<ActionSheet
visible={this.state.show}
onCancel={this.onCancel} >
<ActionSheet.Button>Capture</ActionSheet.Button>
<ActionSheet.Button>Photo</ActionSheet.Button>
<ActionSheet.Button>Camera</ActionSheet.Button>
</ActionSheet>
</View>
);
},
});
var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center'
},
});
```

- `visible : PropTypes.boolean.isRequired` - must use state to control ActionSheet visible
- `onCancel : PropTypes.func.isRequired` - use to hide ActionSheet
- `cancelText : PropTypes.string` - default is 'Cancel'
- `buttonStyle : TouchableOpacity.propTypes.style` - set button style
- `textStyle : Text.propTypes.style` - set button text style
- `onPress : PropTypes.func` - callback for button click
A pure js ActionSheet like ios ActionSheet, support ios