Image picker plugin conflict with google maps plugin

Ionic Native
1

Hello all
I have a problem with installing Google Maps plugin
image picker was working well before installing Google Maps plugin
The problem is that the app stop and alert message (‘unfortunately , myApp has stopped’) after click on image picker function to open my gallery
After removing Google Maps the image picker came back to work well

My ionic info

Ionic:

ionic (Ionic CLI) : 4.10.3 (C:\Users\HELSI\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.0.1
@angular-devkit/build-angular : 0.13.8
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.2.4
@ionic/angular-toolkit : 1.3.0

Cordova:

cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : android 7.0.0, browser 5.0.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 21 other plugins)

System:

Android SDK Tools : 25.2.3 (C:\Users\HELSI\AppData\Local\Android\sdk)
NodeJS : v8.12.0 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10

Any helps ?
Thanks

2

Same problem.

How to solve this problem?

3

I found a solution.
That is the use of other plugins, which is very effective. With UI beautiful

4

can you please share your source code , how to import this plugin ?

5

Install plugin

ionic cordova plugin add https://github.com/DmcSDK/cordova-plugin-mediaPicker.git --variable IOS_PHOTO_LIBRARY_USAGE_DESCRIPTION="your usage message"

Use

        let args = {
          'selectMode': 100, //101=picker image and video , 100=image , 102=video
          'maxSelectCount': 5,
          'maxSelectSize': 20000000
        };

        (window as any).MediaPicker.getMedias(args, async (medias: any[]) => {

          if (medias && medias.length > 0) {

            try {
              // Your code here
              console.log(medias);
            } catch (error) {
              alert(error);
            }
          }

        }, (err: any) => { console.log(err) });
6

can you please share how to call import MediaPicker
because it is saying
ERROR TypeError: “window.MediaPicker is undefined”

7

Can you share your code to me?

8

import { Component } from ‘@angular/core’;

// import { MediaPicker } from ‘cordova-plugin-mediapicker-dmcsdk’;

// declare module ‘cordova-plugin-mediapicker-dmcsdk/www/MediaPicker’;

// import { MediaPicker } from ‘cordova-plugin-mediapicker-dmcsdk/www/MediaPicker’;

// import * as MediaPicker from ‘cordova-plugin-mediapicker-dmcsdk’;

import { FileUploader, FileLikeObject } from ‘ng2-file-upload’;

// import * as MultiImagePicker from ‘ng-multi-image-picker’;

// import { MultiImagePicker } from ‘MultiImagePicker’;

// import { MultiImagePicker } from ‘/com.lihau.multiimagepicker’;

// declare var angular: any;

@Component({

selector: ‘app-home’,

templateUrl: ‘home.page.html’,

styleUrls: [‘home.page.scss’],

})

export class HomePage {

// MultiImagePicker : any;

public fileUploader: FileUploader = new FileUploader({});

public hasBaseDropZoneOver: boolean = false;

uploader;

constructor() {

}

// fileOverBase(event): void {

// this.hasBaseDropZoneOver = event;

// }

// getFiles(): FileLikeObject {

// return this.fileUploader.queue.map((fileItem) => {

// return fileItem.file;

// });

// }

// readLocalFile(id, ff) {

// var reader = new FileReader();

// reader.onload = readSuccess;

// function readSuccess(evt) {

// document.getElementById(id)[“src”] = evt.target.result;

// };

// reader.readAsDataURL(ff._file);

// }

uploadFiles() {

// var reader = new FileReader();

//   reader.onload = (fileEvent) => {

//     (this.testImage.nativeElement as HTMLImageElement).src = reader.result;

//   }

//   var url = reader.readAsDataURL(file);

// let files = this.getFiles();

// let requests = [];

// files.forEach((file) => {

//   console.log(file);

//   let formData = new FormData();

//   formData.append('file' , file.rawFile, file.name);

//   // requests.push(this.uploadingService.uploadFormData(formData));

// });

// concat(...requests).subscribe(

//   (res) => {

//     console.log(res);

//   },

//   (err) => {  

//     console.log(err);

//   }

// );

}

Upload(){

let args = {

  'selectMode': 100, //101=picker image and video , 100=image , 102=video

  'maxSelectCount': 5,

  'maxSelectSize': 20000000

};

(window as any).MediaPicker.getMedias(args, async (medias: any[]) => {

  if (medias && medias.length > 0) {

    try {

      // Your code here

      console.log(medias);

    } catch (error) {

      alert(error);

    }

  }

}, (err: any) => { console.log(err) });

// var resultMedias=[];

// var imgs = document.getElementsByName('imgView');

// var args = {

//     'selectMode': 101, //101=picker image and video , 100=image , 102=video

//     'maxSelectCount': 40, //default 40 (Optional)

//     'maxSelectSize': 188743680, //188743680=180M (Optional) only android

// };

// MediaPicker.getMedias(args, function(medias) {

//   //medias [{mediaType: "image", path:'/storage/emulated/0/DCIM/Camera/2017.jpg', uri:"android retrun uri,ios retrun URL" size: 21993}]

//   resultMedias = medias;

//   this.getThumbnail(medias);

// }, function(e) { console.log(e) })

}

// getThumbnail(medias) {

// for (var i = 0; i < medias.length; i++) {

// //medias[i].thumbnailQuality=50; (Optional)

// //loadingUI(); //show loading ui

// MediaPicker.extractThumbnail(medias[i], function(data) {

// alert(data.thumbnailBase64);

// // imgs[data.index].src = ‘data:image/jpeg;base64,’ + data.thumbnailBase64;

// // imgs[data.index].setAttribute(‘style’, ‘transform:rotate(’ + data.exifRotate + ‘deg)’);

// }, function(e) { console.log(e) });

// }

// }

}

9

This plug-in supports Android and iOS devices.

You can run with emulator.

10

i have tested in mobile. its not working there