当前位置：首页 > news >正文

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

news 2025/9/11 9:01:09

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是场景中Scene3DLaya.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();}
}

使用方法

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