当ImagePicker在模态中调用时,相机停留在模态后面

时间:2018-11-30 03:06:22

标签: react-native react-native-android react-native-ios react-native-image-picker

当我从模态内的react-native-image-picker库调用ImagePicker时,相机或相机胶卷停留在模态后面。有人对此有解决方法吗?

我正在添加示例代码以显示如何使用组件(不是确切的代码)。

import React, { Component } from 'react';
import {Text, View, StyleSheet, TouchableOpacity,
  TouchableWithoutFeedback, Modal
} from 'react-native';
import ImagePicker from 'react-native-image-picker';


class CardImageUploader extends Component {
  constructor(props) {
    super(props)
  }

  useLibraryHandler = async () => {
    const options = {
      title: 'Select An Image',
      storageOptions: {
        skipBackup: true,
        path: 'images'
      }
    };

    ImagePicker.showImagePicker(options, (response) => {

      if (response.didCancel) {
        console.log('User cancelled image picker');
      } else if (response.error) {
        console.log('ImagePicker Error: ', response.error);
      } else if (response.customButton) {
        console.log('User tapped custom button: ', response.customButton);
      } else {

        this.props.addImage(response.uri).then(() => {
        });

      }
    });
  };

  render() {
    const { textStyle, cardSectionStyle, closeIconStyle } = styles;
    const { visible, title, onDecline } = this.props;

    return (
      <Modal
        animationType='fade'
        onRequestClose={() => { }}
        transparent
        visible={visible}
      >

        <TouchableWithoutFeedback onPress={onDecline} >

          <View style={[styles.containerStyle]}>
            <Ionicons name="md-close" size={24} style={closeIconStyle} />
            <TouchableWithoutFeedback onPress={() => { }} >
              <View style={[styles.popupStyle]} >
                <View style={[styles.textContainer]}>
                  <Text style={[textStyle]}>
                    {title}
                  </Text>
                </View>
                <View style={{ height: 200, paddingLeft: 8, paddingRight: 8 }}>

                  <View style={[cardSectionStyle]}>
                    <TouchableOpacity onPress={this.useLibraryHandler}>
                      <MaterialIcons name="camera-roll" size={35} />
                    </TouchableOpacity>

                  </View>
                </View>

              </View>
            </TouchableWithoutFeedback>

          </View>
        </TouchableWithoutFeedback>
      </Modal>

    );
  }
}

这就是我看到的结果

enter image description here

我在某处读到这是一个响应本机模式的错误,但是我找不到针对该问题的任何解决方法

0 个答案:

没有答案