[LayaAir 2.0]Laya 使用VideoTexture播放视频

/**

* example:videodom 使用Laya.HtmlVideo播放视频

* @ author:xs

* @ data: 2024-03-05 16:20

*/

export default class VideoDom {

    htmlvideo:Laya.HtmlVideo;

    constructor() {

        Laya.stage.on(Laya.Event.CLICK,this,this.onClick);

    }



    onClick(){

        this.initVideo();

    }

    initVideo() {

        this.htmlvideo = new Laya.HtmlVideo();

        this.htmlvideo.setSource("https://www.layaair.com/3.x/de ... ot%3B,1);

        this.htmlvideo.video.addEventListener("loadedmetadata",()=>{

            var videoTexture:Laya.VideoTexture = new Laya.VideoTexture();

            videoTexture.video = this.htmlvideo.video;

            videoTexture.video.play();

            videoTexture.video.loop = true;

            var bitmap = new Laya.Texture2D(videoTexture.video.videoWidth,videoTexture.video.videoHeight);

            var texture:Laya.Texture = new Laya.Texture(bitmap);



            var image:Laya.Image = new Laya.Image();

            image.texture = texture;

            image.width = videoTexture.video.videoWidth;

            image.height = videoTexture.video.videoHeight;

            image.pos(100,100);

            Laya.stage.addChild(image);

            //目前引擎暂时没有提供刷新机制，需要手动刷新。或者你可以试用LayaAir3.0引擎，那边实现videoTexture不用自己手动刷新

            Laya.timer.frameLoop(1, this, this.updateVideo, [bitmap]);



        },true);

    }



    updateVideo(tempTexture:Laya.Texture2D){

        if(this.htmlvideo.video.readyState === this.htmlvideo.video.HAVE_ENOUGH_DATA) {

            //更新视频纹理

            tempTexture.loadImageSource(this.htmlvideo.video);

        }

    }

}