Ionic如何从本地视频文件中获取缩略图?

时间:2017-09-14 01:47:55

标签: angular typescript ionic-framework

我使用Media capture和cordova传输插件捕获并下载了视频文件。 我不知道如何从这些视频文件中获取缩略图。 请帮我。 感谢。

2 个答案:

答案 0 :(得分:1)

   import { VideoEditor,CreateThumbnailOptions } from '@ionic-native/video-editor';
  CreateVideo()
  {
    var nItem = localStorage.getItem('videoNum');
    var numstr = 0;
    if(nItem == null){
      numstr = 1;
    }
    else{
      var numstr = parseInt(nItem,10);
      numstr = numstr + 1;
    }

    let videooption:CaptureVideoOptions = {limit:1};

    this.mediaCapture.captureVideo().then((videoData:Array<MediaFile>)=>{

    let filedir = this.file.dataDirectory ;

    var path = videoData[0].fullPath.replace('/private','file://');
    var ind = (path.lastIndexOf('/')+1);
    var orgFilename = path.substring(ind);
    var orgFilePath = path.substring(0,ind);

    console.log("videopath", path);
  //SAVE FILE
    this.file.copyFile(orgFilePath, orgFilename, filedir + 'recordvideo','sample'+numstr+'.mov').then(()=>{
    var option:CreateThumbnailOptions = {fileUri:filedir+'recordvideo/sample'+numstr+'.mov',width:160, height:206, atTime:1, outputFileName: 'sample' + numstr, quality:50 };
    this.videoEditor.createThumbnail(option).then(result=>{
        //result-path of thumbnail
       localStorage.setItem('videoNum',numstr.toString());          
    }).catch(e=>{
     // alert('fail video editor');
    });
  });

});}

这是我的答案。

答案 1 :(得分:0)

createThumbnail(videodata){
    let thumbnailoption : CreateThumbnailOptions = {
        fileUri:videodata,
        quality:100,
        atTime:1,
        outputFileName: 'thumbnailImage',
    }
    this.videoEditor.createThumbnail(thumbnailoption).then((thumbnailPath)=>{
        console.log("Thumbnail Responce =>",thumbnailPath)
        this.thumbnail = thumbnailPath;

    }).catch((err)=>{
      console.log("Thumbnail Responce Error=>",err)

    })
  }



  <video autoplay (click)="videovideoPlaypathPlay(videofullpath)" [poster]="thumbnail" preload="auto">   
                     <source src="videodata ? videodata : {{fileServiceUrl}}{{videoKey}}.mp4" type="video/mp4"  class="partyPhoto">
          </video>

那是行不通的.. !!

相关问题