Opening image picker from within modal

[3rror404]

When the image picker is triggered from within a page that was opened using showModal(), the picker is loaded behind the page. Is there any way to work around this?

[hiddencaliber]

Is there any update on this ?

[moritzvieli]

That's an iOS-only problem. I am also looking forward to a fix. I just implemented a very ugly workaround for iOS:

1. Before showing the select image dialog, close the modal with an own result code
2. Show the image dialog
3. After selection, save the image on the parent page
4. Display the modal again with the selected image

To show the modal the second time, a timeout is needed, because we cannot display the modal inside the close modal function (the modal is still open):

if(values.result == 'pickImage') {
  this.imagePickerProvider.selectPicture()
  .then((response) => {
    this.newWallPostImage = response.toBase64String('jpeg');
    this.newWallPost = values.text;

    // Use a timeout, because opening the modal from here does not work
    // --> Still open. Timeout of 1 ms did not work on a real device. Maybe
    // On slower devices, we need to further increase this timeout...
    setTimeout(() => {
      // Show the modal again this time containing the image
      this.editWallPost();
      }, 500);
   });

[moritzvieli]

Welp, just saw the same problem here: NativeScript/NativeScript#3195

And surprisingly, the workaround is exactly the same as mine. Although in my opinion, the timeout is a little wobbly...

Anyway, if Issue 3195 cannot be resolved, it maybe makes sense to handle this case like shown. But NativeScript could make it easier for us and handle this case automatically on iOS.

[abhayastudios]

+1

[tbozhikov]

Hi guys, a new version of the plugin is out 6.0.0, and it now supports opening the image picker in ios from a modal page without complicated workarounds. All you need is to pass the modal page from which you open the picker to the create method:
imagepicker.create({ mode: "single" }, theModalPage)
I've demonstrated this in this app.