How to run native camera using ionic devapp

422 views Asked by At

I am trying to run Ionic DevApp Ionic DevApp Doc using my Android mobile but it seems like the Cordova plugin isn't setup correctly. I can't understand why even if I did a $ ionic cordova plugin add cordova-plugin-camera and $ npm install --save @ionic-native/camera@beta any line is added into my config.xml file. I also try to add manually this line into my config.xml file

So when I click upon my button (from my mobile) who's suppose to trigger the camera to take a picture, it does nothing.

Here's my code (very basic one):

home.page.ts:

export class HomePage {
  public image = '';
  public options: CameraOptions;

  constructor(public navCtrl: NavController, public camera: Camera) {
    this.options = {
     quality: 100,
     destinationType: this.camera.DestinationType.FILE_URI,
     encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE
     };
  }

   getPicture() {
    this.camera.getPicture(this.options).then(
      imageData => {
    // imageData is either a base64 encoded string or a file URI
       // If it's base64 (DATA_URL):
          this.image = 'data:image/jpeg;base64,' + imageData;
        console.log('image loaded !');
      },
      err => {
    console.log('handled error !', err);

      // Handle error
     }
);
  }
}

home.page.html:

 <ion-header>
  <ion-toolbar>
    <ion-title>Home</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <ion-img [src]="image"></ion-img>
  <ion-button shape="round" color="primary" (click)="getPicture()">Take 
Picture</ion-button>
</ion-content>
1

There are 1 answers

0
Mohamed Genedy On BEST ANSWER

It will give you a run-time error since ionic devapp cannot access the native features. In fact, your OS platform is recognized as Windows still. You need to build its apk and install it on your mobile. Or you can use a virtual device on your PC. Maybe like Android Studio mobile emulator.