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


  
}
相关推荐
大猫会长1 天前
tailwindcss中,自定义多个背景渐变色
前端·html
xj7573065331 天前
《python web开发 测试驱动方法》
开发语言·前端·python
IT=>小脑虎1 天前
2026年 Vue3 零基础小白入门知识点【基础完整版 · 通俗易懂 条理清晰】
前端·vue.js·状态模式
IT_陈寒1 天前
Python 3.12性能优化实战:5个让你的代码提速30%的新特性
前端·人工智能·后端
赛博切图仔1 天前
「从零到一」我用 Node BFF 手撸一个 Vue3 SSR 项目(附源码)
前端·javascript·vue.js
爱写程序的小高1 天前
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree
前端·npm·node.js
loonggg1 天前
竖屏,其实是程序员的一个集体误解
前端·后端·程序员
程序员爱钓鱼1 天前
Node.js 编程实战:测试与调试 - 单元测试与集成测试
前端·后端·node.js
码界奇点1 天前
基于Vue.js与Element UI的后台管理系统设计与实现
前端·vue.js·ui·毕业设计·源代码管理
时光少年1 天前
Android KeyEvent传递与焦点拦截
前端