Modal.js

part_of_Modal.js

  render() {
    if (!this.state.rendered) return null;

    const { children, dismissable } = this.props;
    return (
      <Animated.View
        accessibilityViewIsModal
        accessibilityLiveRegion="polite"
        style={[{ opacity: this.state.opacity }, styles.wrapper]}
      >
        <View
          style={[
            StyleSheet.absoluteFill,
            { backgroundColor: "rgba(0, 0, 0, .5)" }
          ]}
        />
        {dismissable && (
          <TouchableWithoutFeedback onPress={this._hideModal}>
            <View style={StyleSheet.absoluteFill} />
          </TouchableWithoutFeedback>
        )}
        {/* <Animated.View style={[{ opacity: this.state.opacity }]}> */}
        <Animated.View style={[{ opacity: this.state.opacity, flex: 1 }]}>
          {children}
        </Animated.View>
      </Animated.View>
    );
  }