CODEWITHSUNDEEP
typescriptionic-frameworkangularionic2
Kalyan Dechiraju
Kalyan Dechiraju

Reputation: 1287

How to record video in Ionic 2 application in TypeScript?

I am trying to capture video in Ionic 2 app using TypeScript. Taking a picture is straight forward and seems easy. 

    Camera.getPicture({
        destinationType: Camera.DestinationType.DATA_URL,
        mediaType: Camera.MediaType.PICTURE,
        targetHeight: 1000,
        targetWidth: 1000
    }).then((imageData) => {
        this.base64Image = "data:image/jpeg;base64," + imageData; 
    }, (err) => {
        console.log(err);
    });
  }

What changes do I need to make in order to capture video?

Upvotes: 1

Views: 2716

Answers (2)

Jamil
Jamil

Reputation: 939

You have to install the Media capture plugin ionic plugin add cordova-plugin-media-capture then install the angular typescript wrapper npm install --save @ionic-native/media-capture

import { MediaCapture, MediaFile } from '@ionic-native/media-capture'; // import the angular typescript classes from the installed wrapper

@Component(...)

export class Test{
   constructor(private mediaCapture: MediaCapture) { } // inject the services in the constructor

   this.mediaCapture.captureVideo().then((data: MediaFile[]) =>{
     console.log(data) // data is the captured video file object 
 });
}

Check the Ionic Doc for this plugin https://ionicframework.com/docs/native/media-capture/

Upvotes: 0

sebaferreras
sebaferreras

Reputation: 44659

I didn't take a look at the code of this app yet, but you can take a look at the plugins used there and how they work (working on nexus 7 2013).

https://github.com/rossmartin/video-editor-ionic2

These are the required plugins:

cordova-plugin-camera 
cordova-plugin-device 
cordova-plugin-media-capture 
https://github.com/driftyco/ionic-plugin-keyboard.git 
cordova-plugin-statusbar 
cordova-plugin-spinner-dialog 
cordova-plugin-instagram-assets-picker 
cordova-plugin-video-editor

Upvotes: 1

Related Questions