LayaAir使用原生Video視頻播放以及Video監聽事件

1.原生Video的基本屬性

src ：視頻的屬性，url地址
poster：視頻封面，沒有播放時顯示的圖片
preload：預加載|none|metadata（部分預加載）|auto。默認爲auto
autoplay：自動播放
loop：循環播放
controls：瀏覽器自帶的控制條
width：視頻寬度
height：視頻高度

2.原生video標籤隱藏dom元素  ，可隱藏不能夠修改

 

 3.Laya使用原生Video視頻播放的類代碼以下

var WebGL = laya.webgl.WebGL;
Laya.init(600, 400, WebGL);

class Video extends Laya.Sprite{
    constructor(){
        super();
        this.creatVideo();
    }

    creatVideo(){
        let divElement = Laya.Browser.createElement("div");
        divElement.className = "div";
        Laya.Browser.document.body.appendChild(divElement);         
        Laya.Utils.fitDOMElementInArea(divElement,this , 0, 0, Laya.stage.width, Laya.stage.height); 
        this.divElement = divElement;
        // this.divElement.style.display = "none";

        // 建立Video元素
        let videoElement = Laya.Browser.createElement("video");
        videoElement.setAttribute("id", "myvideo");
        this.videoElement = videoElement;      
        videoElement.controls = true;
        videoElement.autoPlay = false;
        // 阻止IOS視頻全屏
        videoElement.setAttribute("webkit-playsinline", true);
        videoElement.setAttribute("playsinline", true);
        videoElement.setAttribute("x5-video-player-type",'h5');
        videoElement.setAttribute("x-webkit-airplay",true);
        videoElement.setAttribute("x5-video-orientation","portrait");
        
        videoElement.setAttribute('preload', 'auto');
        videoElement.setAttribute('width', '100%');
        videoElement.setAttribute('height', '100%');
         
        videoElement.style.zInddex = Laya.Render.canvas.style.zIndex + 1;      
        videoElement.type = "vedio/mp4";     
        videoElement.src = "視頻連接"
        videoElement.play();
        divElement.appendChild(videoElement);  
    }

    videoEvent(){ 
        this.videoElement.addEventListener("loadstart",()=>{
            //加載事件
        });   
         this.videoElement.addEventListener("progress",()=>{
            //下載監聽事件
        });
         this.videoElement.addEventListener("play",()=>{
            //播放事件
        });
         this.videoElement.addEventListener("pause",()=>{
            //暫停事件
        });
         this.videoElement.addEventListener("seeking",()=>{
            //移動進度條事件
        });
         this.vidjingeoElement.addEventListener("seeked",()=>{
            //進度條移動完成事件
        });
         this.videoElement.addEventListener("waiting",()=>{
            //視頻加載等待事件
        });
         this.videoElement.addEventListener("timeupdate",()=>{
            //視頻實時更新進度事件
        });
        this.videoElement.addEventListener("ended",()=>{
            //播放完成事件
        });
        this.videoElement.addEventListener("error",()=>{
            //播放出錯
        });
        
    }


    
}

var videoele = new Video();
Laya.stage.addChild(videoele);