短视频编辑:可实时交互的播放器
发布网友
发布时间：2022-09-10 10:37
共1个回答
热心网友
时间：2024-02-17 23:54
其开发任务如上图，一个短视频生产app的首要任务在于实现一个高度可实时交互的播放器，在播放预览时支持多种编辑能力。
最初我们调研了多种方案，乍一看Android原生播放器肯定不够用，估计要在众多c++的开源播放器中寻找参考方案，最好自己实现一个播放器，高度灵活高度可控。然而我们发现exo这个男团播放器的厉害之处，虽然这个播放器如此常用，但是我们不知道其潜力值爆表，可以拓展得如此强大。
事实上直到现在，我们仍然在自研视频剪辑工具中使用exoplayer做编辑预览。为什么选择exoplayer,基于以下几点原因（一句话，性价比高）：
使用基于exoplayer播放器进行二次开发，快速高效实现视频剪辑功能。视频剪辑播放器用于视频编辑过程中的实时预览播放，支持有功能有：
针对上述视频剪辑所需要支持的功能，逐一对照explayer的api文档，寻找拓展实现的方法。
其中，视频旋转、文字贴纸、美颜滤镜、素材转场需要调用setVideoSurface控制视频呈现层，自定义GLSurfaceView，使用opengl实现对视频的旋转、美颜滤镜、添加贴纸。exoplayer播放输出的surface与自定义GLSurfaceView的渲染纹理相绑定。
视频裁剪播放使用ClippingMediaSource设置裁剪素材，按api文档传入起始时间和结束时间。
多个视频拼接播放，使用ConcatenatingMediaSource可以用来无缝地合并播放多个素材，为了能对单个素材进行编辑，isAtomic设为true。
变速使用setPlaybackParameters设置速度参数
这三个功能使用exoplayer已提供的api就可以实现，相对容易。在执行编辑操作后即时更新播放器素材和参数即可。在我们的产品中，有一个撤销操作的交互，所以需要保留一份数据拷贝，如果用户撤销操作则更新为原来的数据。
exoplayer本身不支持图片格式的素材播放。注入一个自定义渲染器来实现图片（格式为jpg、png、gif等）
其中ImageRender继承BaseRenderer，实现了图片的自定义渲染。render主要工作是将每帧数据解码流渲染为屏幕图像。对于图片来说，我们定义ImageMediaSourceImage、SampleStreamImpl和ImageMediaPeriod，分别继承于BaseMediaSource、SampleStream和MediaPeriod，从原素材解析并传送每帧图片数据。图片不需要真正的解码，实现SampleStream的readData方法读取图片uri为解码buffer。
实现图片播放的核心在于实现render接口：
在这个方法内，我们创建opengl环境，将bitmap绘制到屏幕上
添加的文字或贴纸支持移动、旋转、缩放和设置时间轴。对于多个文字贴纸，我们最终包装为一个与渲染屏幕同尺寸的bitmap，在这个bitmap的画布上绘制一系列带坐标大小、起止时间的小bitmap(即stickerItem.getBitmap)。
将这张贴纸画布bitmap与原视频帧像素混合就实现了所有文字贴纸的绘制。用opengl绘制贴纸，就是对屏幕上像素做一个水印滤镜的运算。采用GLSL内建的mix函数做两个纹理的混合，以下是水印滤镜所用的片元着色器。
和文字贴纸一样，要实现实时的美颜滤镜效果，必须使用帧缓冲fbo。帧缓冲的每一存储单元对应着屏幕每一个像素。而美颜滤镜涉及较复杂算法，由部门内的人工智能组提供sdk接入，在绘制过程中调用sdk方法如下，就是使用fbo进行一次图像纹理转换。传入参数为屏幕方向、摄像头方向和渲染尺寸。
目前产品实现了左右移、上下移、拉近拉远、顺时针逆时针旋转等几种转场效果。转场的实现方法是：对于两个在其中添加了转场的素材，在上一个素材的最后1000ms绘制转场滤镜，转场滤镜即将两张图片的像素以一定的规律进行渲染，转场算法由opengl使用glsl着色器实现。转场基类的片元着色器如下，移动转场（左右向移动和上下移动）、缩放转场（拉近拉远）、旋转转场对getFromColor与getToColor执行的行为不同。
以移动转场的转场glsl着色器为例
转场的具体实现参考了GPUImageFilter库，和美颜滤镜以及文字贴纸不同的是，转场滤镜需要在渲染前预先设置将下个素材的首帧图。
在预览编辑过程中，由于音乐并不需要真正合成于视频中，因此可以使用另一个播放器单独播放音频，我们采用android更原始的MediaPlayer单独播放音乐，单独支持音乐的裁剪播放和seek。
抽帧预览即每隔固定时间取视频的一帧图片构成时间轴，我们使用ffmpegMediaMetadataRetriever库进行抽帧 ，使用方法为
该库内部使用ffmpeg进行解码取帧，接口易用但是其软件解码方式效率过低，相对较慢。因为exoplayer播放器是默认使用硬件解码的，可以采用另一个exoplayer播放器快速播放一次素材，然后每隔一段时间获取屏幕图像，但此种方法开销过大，两个exoplayer播放器不利于管理。
最后，我们发现常用的图片加载库glide也能进行视频抽帧，使用更为简单方便，其内部采用mediaMetadataRetriever进行抽帧。
1.调整素材，拼接、裁剪、变速
https://vod.cc.163.com/file/5f896ef25655da63cc2d3237.mp4
2.转场、文字贴纸、美颜滤镜
https://vod.cc.163.com/file/5f896edad70f81a0e3c77dbe.mp4
