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(() => {});
    }
   


  
}
相关推荐
东风西巷8 分钟前
K-Lite Mega/FULL Codec Pack(视频解码器)
前端·电脑·音视频·软件需求
超级大只老咪1 小时前
何为“类”?(Java基础语法)
java·开发语言·前端
你的人类朋友3 小时前
快速搭建redis环境并使用redis客户端进行连接测试
前端·redis·后端
深蓝电商API4 小时前
实战破解前端渲染:当 Requests 无法获取数据时(Selenium/Playwright 入门)
前端·python·selenium·playwright
bestcxx5 小时前
(二十七)、k8s 部署前端项目
前端·容器·kubernetes
鲸落落丶5 小时前
webpack学习
前端·学习·webpack
excel5 小时前
深入理解 3D 火焰着色器:从 Shadertoy 到 Three.js 的完整实现解析
前端
光影少年6 小时前
vue打包优化方案都有哪些?
前端·javascript·vue.js
硅谷工具人6 小时前
vue3边学边做系列(3)-路由缓存接口封装
前端·缓存·前端框架·vue