mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-03-26 07:04:05 +08:00
Enable transparent modal presentation with <Modal />
Summary: Enable transparent modal backgrounds using `UIModalPresentationCustom` modal presentation style.
This commit is contained in:
@@ -11,6 +11,7 @@
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
var PropTypes = require('ReactPropTypes');
|
||||
var React = require('React');
|
||||
var StyleSheet = require('StyleSheet');
|
||||
var View = require('View');
|
||||
@@ -24,9 +25,16 @@ class Modal extends React.Component {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (this.props.transparent) {
|
||||
var containerBackgroundColor = {backgroundColor: 'transparent'};
|
||||
}
|
||||
|
||||
return (
|
||||
<RCTModalHostView animated={this.props.animated} style={styles.modal}>
|
||||
<View style={styles.container}>
|
||||
<RCTModalHostView
|
||||
animated={this.props.animated}
|
||||
transparent={this.props.transparent}
|
||||
style={styles.modal}>
|
||||
<View style={[styles.container, containerBackgroundColor]}>
|
||||
{this.props.children}
|
||||
</View>
|
||||
</RCTModalHostView>
|
||||
@@ -34,6 +42,11 @@ class Modal extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
Modal.propTypes = {
|
||||
animated: PropTypes.bool,
|
||||
transparent: PropTypes.bool,
|
||||
};
|
||||
|
||||
var styles = StyleSheet.create({
|
||||
modal: {
|
||||
position: 'absolute',
|
||||
|
||||
Reference in New Issue
Block a user