画布上的Nativescript视频不起作用

时间:2018-12-04 15:01:07

标签: canvas video webview nativescript

我必须在Nativescript中开发一个android应用程序。在其中我必须提供在画布上播放的视频文件。 该应用程序包含可加载html文件的WebView组件,其中包含用于画布实现的fabric.js插件。已在Webview上加载内嵌视频自动播放。这是缩短的代码版本,可以在网页上正常使用,但不能在WebView组件中使用。

html

<video id="video-bg" src="bg.mp4" muted loop playsinline autoplay></video>    
<div id="canvas-container">
    <div id="canvas-touch-prevent"></div>
    <canvas id="canvas"></canvas>
</div>

js

var videoBg = document.getElementById("video-bg");
var canvas = new fabric.Canvas('canvas');
var cW = canvas.getWidth();
var cH = canvas.getHeight();
videoBg.onloadedmetadata = function() {
    var video = new fabric.Image(videoBg, {
        name: 'video',
        left: 0,
        top: 0,
        selectable: false,
        cursor: 'none',
        objectCaching: false,
    });
    video.scaleToHeight(cH);
    video.scaleToWidth(cW);
    canvas.add(video);
}

任何人都可以在Nativescript WebView中帮助在画布上播放视频吗?

0 个答案:

没有答案