search

OEDx / oedx.github.io

OEDx 技术博客
https://oedx.github.io
7 stars 5 forks source link

基于 FFmpeg 的 Cocos Creator 视频播放器 #21

Open wzpan opened 3 years ago

wzpan commented 3 years ago

https://oedx.github.io/2020/12/29/FFmpeg-Cocos-Creator/

只为解决一个核心问题，追求更好体验。 背景腾讯开心鼠项目使用的游戏引擎是 Cocos Creator，由于引擎提供的视频组件实现方式问题导致视频组件和游戏界面分了层，从而导致了以下若干问题: 不可以在视频组件上添加其他渲染组件； 不可以使用遮罩组件来限定视频形状； 退出场景时存在视频组件残影； 等等… 核心问题就是分层问题，对于开心鼠项目带来的最大弊端就是：一套设计，Android，iOS

LittleZzUni commented 3 years ago 
// 在 Web 端，则是在 CCVideo 渲染组件的每一帧去传递 video 元素，代码如下：
let gl = cc.renderer.device._gl;
this.update = dt => {
    if(this._currentState == VideoState.PLAYING){
        gl.bindTexture(gl.TEXTURE_2D, this.texture._glID);
        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this.video);
    }
};

这里可以用下requestVideoFrameCallback这个api，再不支持的浏览器上在用上面的方案。