Mediafilepicker视频文件选择(在应用程序上显示视频)

时间:2019-07-18 23:36:34

标签: nativescript-angular

我正在使用Mediafilepicker插件从设备中选择视频文件,但是当我选择视频时,它不会显示在应用程序中,但是当我第二次按下(选择视频)按钮时,该视频就会显示

我搜索了类似的问题,但没有找到任何

public pickvideo(){    
let options: VideoPickerOptions = {
    android: {
        isCaptureMood: false,
        isNeedCamera: true,
        maxNumberFiles: 1,
        isNeedFolderList: true,
        maxDuration: 20,
    },
};    
let mediafilepicker = new Mediafilepicker();    
mediafilepicker.openVideoPicker(options);
mediafilepicker.on("getFiles", res => {
    let results = res.object.get('results');
    this.videoSrc = results[0].file;        
    console.dir(results);   
    if (results) {
        for (let i = 0; i < results.length; i++) {
            let result = results[i];
            console.dir(result);
            let file = result.file;
            console.log(file);
        }
    }

它没有显示任何错误

1 个答案:

答案 0 :(得分:0)

使用此代码从图库中选择视频并在应用中显示。

media-picker.component.ts:-

import { Component, OnInit, ChangeDetectionStrategy, ChangeDetectorRef } from "@angular/core";
import { Page } from "tns-core-modules/ui/page";
import * as app from 'tns-core-modules/application';
import { Mediafilepicker, VideoPickerOptions } from 'nativescript-mediafilepicker';

declare const AVCaptureSessionPreset1920x1080, AVCaptureSessionPresetHigh;

@Component({
selector: "media-picker",
moduleId: module.id,
templateUrl: "./media-picker.component.html",
styleUrls: ["./media-picker.component.scss"],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class MideaPickerComponent implements OnInit {

public videoFileUrl: Array<string> = [];

constructor(public page: Page,
    private ref: ChangeDetectorRef) {
    // Use the constructor to inject services.
    // Get reference to object we want to animate with code
}

ngOnInit(): void {

}

//Open video gallery list
public openVideoGallery() {

    let allowedVideoQualities = [];

    if (app.ios) {
        allowedVideoQualities = [AVCaptureSessionPreset1920x1080, AVCaptureSessionPresetHigh];
    }

    let options: VideoPickerOptions = {
        android: {
            isCaptureMood: false,
            isNeedCamera: true,
            maxNumberFiles: 2,
            isNeedFolderList: true,
            maxDuration: 20,
        },
        ios: {
            isCaptureMood: false
        }
    };

    let mediafilepicker = new Mediafilepicker();
    mediafilepicker.openVideoPicker(options);

    mediafilepicker.on("getFiles", (res) => {

        let results = res.object.get('results');
        if (results) {
            this.videoFileUrl = [];
            for (let i = 0; i < results.length; i++) {

                let result = results[i];

                let file = result.file;

                this.videoFileUrl.push(file);

                if (result.file && app.ios && !options.ios.isCaptureMood) {

                    let fileName = file.replace(/^.*[\/]/, '');

                    setTimeout(() => {
                        mediafilepicker.copyPHVideoToAppDirectory(result.urlAsset, fileName).then(res => {
                            console.dir(res);
                        }).catch(e => {
                            console.dir(e);
                        });
                    }, 1000);

                } else if (result.file && app.ios) {
                    // or we will get our own recorded video :)
                    console.log(file);
                }

            }
        }

    });

    mediafilepicker.on("error", (res) => {
        let msg = res.object.get('msg');
        console.log(msg);
    });

    mediafilepicker.on("cancel", (res) => {
        let msg = res.object.get('msg');
        console.log(msg);
    });

    setInterval(() => {
        // require view to be updated
        this.ref.markForCheck();
    }, 500);
}
}

media-picker.component.html:-

<StackLayout row="0">
    <Button height="50" (tap)="openVideoGallery()" text="Open Video Gallery"> 
</Button>
</StackLayout>
<StackLayout row="1">
    <VideoPlayer *ngFor="let video of videoFileUrl" src="{{video}}" autoplay="true" height="300"></VideoPlayer>
</StackLayout>