React-native-image-crop-picker: iOS can't open camera/picker after first time.

[ngocnguyen09910060]

Hi all,
This is my source code:

export default class App extends Component<Props> {
  constructor(props) {
    super(props);
    this.state = {
        isVisible: false,
    };
  }

  openModal = () => {
    this.setState({isVisible: true});
  }

  openPicker = () => {
    this.setState({isVisible: false});
    ImagePicker.openPicker({
      mediaType: "video",
    }).then((video) => {
      console.log(video);
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <TouchableOpacity onPress={this.openModal}>
          <Text>Choose Image</Text>
        </TouchableOpacity>
        {
          this.state.isVisible &&
          <Modal style={styles.modal}>
            <View style={styles.conModal}>
              <TouchableOpacity style={styles.touch} onPress={this.openPicker}>
                <Text style={styles.text}>Open Gallery</Text>
              </TouchableOpacity>
            </View>
          </Modal>
        }
      </View>
    );
  }
}

When user tap "Choose Image" button, app will show "Choose Image" modal which allow user choose "Open Gallery" button or other buttons such as "Open Camera",...
After user choose "Open Gallery" button, app will close "Choose Image" modal by this.setState({isVisible: false}) before open Gallery.
It's working perfectly on Android. But it only work once time on iOS. Next time, app also show Gallery but it's closed immediately.
If i change logic to: open Gallery before close "Choose Image" modal by this.setState({isVisible: false}), it will work. But my customer don't accept it.
Please help me.
Thanks.

[xuewenjie123]

我出现了一样的问题！你现在解决这个问题了吗？

[xuewenjie123]

在android上，访问相册权限被拒绝后，第二次在请求会再次弹出提示框，允许或者拒绝，完美运行；
在ios上，在第一次请求访问相册权限被拒绝后，就不会在弹出是否允许访问权限的提示；

[anhtuank7c]

I am facing the same problem. Still cannot do it with modal, I have to use normal view. :(

[anhtuank7c]

I have to close current modal and set timeout 1s to trigger open image picker.
@xuewenjie123 @ngocnguyen09910060

[wkmcyz]

one late answer . this is a very common problem with react-native's Modal on iOS. if you have some code like below and wish it hides modal1 and shows modal2, you will face problem that Modal1 disappears yet modal2 not showing.

this.setState({
    modal1Visible: false,
    modal2Visible:true,
})

The gallery is likely to be implemented with Modal , and thus if you set modal1's visibility to false and openPicker or some Modal else, you will face the problem.
A common solution to this is setTimeout like @anhtuank7c post.

this.setState({modal1Visible : false});
if(Platform.OS.toLocaleLowerCase() === 'android'){
    this.setState({modal2Visible : true});
} else {
    setTImeOut(()=>{
        this.setState({modal2Visible : true});
    },500) // 500 or 1000 as you like, you may test how different delay influences.
}