Laya使用VideoNode动态加载视频,可以自定义播放视频此处以及位置

csharp 复制代码
export class VideoCommand {
    video: Laya.VideoNode;

    public duration: number = 0;

    /**
       
        * @param videoPos 视频位置
        * @param videoSize 视频大小
    */
    public constructor(videoPos: Laya.Vector2, videoSize: Laya.Vector2) {


        this.video = new Laya.VideoNode;
        //添加到舞台  1是场景中的Sene2D,0是场景中Scene3D
        Laya.stage.getChildAt(1).addChild(this.video);
        this.video.size(videoSize.x, videoSize.y);
        this.video.pos(videoPos.x, videoPos.y); //设置到右上角
        this.video.visible = false;

    }


    /**
        * @param ready 视频准备就绪事件
    */
    public ReadyEvent(ready: () => void) {
        this.video.videoTexture.off("ready", this);
        this.video.videoTexture.on("ready", this, () => {
            console.log("视频准备就绪");
            ready?.();
        });
    }
    /**
     * 视频开始播放事件
        * @param playing 视频开始播放事件
    */
    public PlayingEvent(playing: () => void) {
        this.video.videoTexture.off("playing", this);
        this.video.videoTexture.on("playing", this, () => {
            console.log("视频开始播放");
            playing?.();
        });
    }
    /**
     * 视频播放完成事件
        * @param ended 视频播放完成事件
    */
    public EndedEvent(ended: () => void) {
        this.video.videoTexture.off("ended", this);
        this.video.videoTexture.on("ended", this, () => {
            console.log("视频播放完成");
            this.video.source = "";
            ended?.();
        });
    }


    /**
     * 设置视频位置
        * @param videoPos 视频位置
    */
    public SetVideoPos(videoPos: Laya.Vector2) {
        this.video.pos(videoPos.x, videoPos.y);
    }
    /**
     * 设置视频大小
        * @param videoSize 视频大小
    */
    public SetVideoSize(videoSize: Laya.Vector2) {
        this.video.size(videoSize.x, videoSize.y);
    }
    /**
     * 设置视频可见性
        * @param visible 是否可见
    */
    public SetVideoVisible(visible: boolean) {
        this.video.visible = visible;
    }
    /**
     * 播放视频
        * @param videoPath 视频路径
        * @param loop 是否循环播放
    */
    public playVideo(videoPath: string, loop: boolean) {
        this.video.visible = true;
        this.video.loop = loop;
        this.video.source = "resources/Media/" + videoPath;
        //设置视频帧率
        this.video.videoTexture.useFrame = true;
        this.video.videoTexture.updateFrame = 30;
        this.video.muted = false;
        this.video.reload();//重新加载视频
        this.video.play(); //开始播放

    }
    /**
     * 暂停视频
        * @param action 暂停视频回调
    */
    public PauseVideo(action: () => void) {
        this.video.pause();
        action?.();
    }
    /**
     * 获取视频时长
    */
    public Getduration() {
        return this.duration;
    }



    /**
     * 销毁视频
    */
    public DestroyVideo() {
        this.video.offAll();
        this.video.destroy();
    }
}

使用方法

javascript 复制代码
const { regClass, property } = Laya;

//这个是视频脚本的路径
import { VideoCommand } from "../Tool/VideoCommand";

@regClass()
export class Test extends Laya.Script{
   
    public Start() {
       
 let videoCommand = new VideoCommand(new Laya.Vector2(0, 0), new Laya.Vector2(1600, 900));
                videoCommand.playVideo("resource路径下的视频路径", false);
                videoCommand.EndedEvent(() => {});
    }
   


  
}
相关推荐
一只小风华~2 小时前
Vue: ref、reactive、shallowRef、shallowReactive
前端·javascript·vue.js
阿杆2 小时前
文心快码 3.5S 发布!实测插件开发,Architect 模式令人惊艳
前端·后端·文心快码
文心快码BaiduComate2 小时前
我用Comate搭建「公园找搭子」神器,再也不孤单啦~
前端·后端·微信小程序
全栈技术负责人3 小时前
前端全链路质量监控体系建设与实践分享
前端·系统架构·前端框架
sorryhc3 小时前
0~1构建一个mini blot.new(无AI版本)
前端·前端框架·openai
南方者3 小时前
文心文心,其利锻心!这个古风射覆,它帅到我了!文心快码 3.5S
前端·敏捷开发·文心快码
永日456703 小时前
学习日记-CSS-day53-9.11
前端·css·学习
云枫晖3 小时前
JS核心知识-this的指向
前端·javascript