子沐design每人每天仅限5票，快给你心仪的作品鼓励的一票。
投票
0.0°
VAP（Video Animation Player）是企鹅电竞开发，用于播放酷炫动画的实现方案。
原理说明：
mp4视频方案无论从效果、大小与解码性能上都是最优的，但H264的里存的是YUV数据，并没有带透明通道。VAP方案基于mp4，解决视频里透明度的问题，这样就能兼具更好的压缩效率，与更好的解码性能。
优势：
1、相比Webp,Apng动图方案，具有高压缩率(素材更小)、硬件解码(解码更快)的优点
2、相比Lottie，能实现更复杂的动画效果(比如粒子特效)
3、视频透明度实现
4、动画配置信息与融合动画
工具的安装：
vapxTool是专门为vap组件打造的素材生成工具，目前只支持mac版本
下载地址：https://github.com/Tencent/vap
或者到腾讯开源社区：https://git.code.tencent.com/Tencent_Open_Source/vap/tree/master/tool/vapxTool
下载之后文件夹里面包含给开发工程师的ios、安卓和web的接入说明文档和tool工具，设计师只需要安装tool工具即可
安装完成之后，到启动台看到一个灯泡图标的工具，就是我们需要的vapxTool
下面将用实操教大家如何使用
1、AE文件中导出序列帧，如果带有透明像素，注意勾选透明背景
输出模块设置中，一定要选择RGB+Alpha
2、导出之后，这里需要注意！！！视频帧 - ！！！！重要！！！！特效的帧素材，命名必须以固定长度的数字递增例如（000.png, 001.png, ...），否则无法导入视频帧！mac具有批量修改文件名的功能，非常方便，如下所示：
直接将前面的中文和下划线替换成空，如下：
替换完成，如图：
3、打开专门为vap组件打造的素材生成工具--vapxTool，界面基本参数保持默认，fps可修改为24，点击上传文件，修改输出目录
4、点击生成，等待一段时间就会生成一个vap.mp4和一个json文件，mp4文件即为vap文件，使用这个文件即可；vapc.json文件是给前端用的，实际上就是已经编码在mp4的vap配置信息
将文件打包交给开发，设计师的工作到这里已经完成！
Powered by Froala Editor
全部评论：7条
-
-
bigxuan
2024-02-06 17:01请问，vapxtool生成时候出现错误 尺寸过大，请尝试减小scala error -1 图片尺寸是 2560 x 720 请问最大能支持到多大的尺寸
-
-
-
-
-
更多作品
发表评论