Android酷礼物动画在Live App中的实现方案（上）

在当前的移动直播时代，如果你曾经使用过移动直播App，你会被令人惊叹的礼物动画效果所吸引，例如以下内容。

从开发者的角度来看，这种效果很漂亮，但要实现它是一个很大的挑战。除了编码实现的效率和性能，我们还应该考虑直播服务本身的特性。

实现想法

首先，从实施思路来看，考虑了以下方案：

方案一：帧动画；

方案二：属性动画；

方案3：Gif或WebP；

解决方案4：实现播放动画的框架。客户端只需要继承它，UI设计者就可以按照约定的动画语法向开发者绘制图片；（原理与SVG相似）

从实现性能、效率和重用的角度来看，我们最终采用了最后一种解决方案。

方案1需要将图片带到安装包中，这增加了安装包的大小。此外，直播应用中的礼物种类繁多，每个礼物都会带来一套帧动画，这是相当不科学的。

方案二的开发成本相对较高。每套礼物动画基本上是不同的。开发人员需要仔细调整他们的参数。用于业务编码的时间将变得非常有限，代码重用率将极低。

除了方案1和方案2中提到的缺陷之外，还有一个直播业务场景问题尚未解决。也就是说，在客户端发布后，如果用户想要推出一些新设计的礼物，就必须升级客户端。否则，他们将无法体验新推出的礼物。

方案3没有上述业务问题，但就性能而言，它不是最佳选择。Gif图本质上是将帧的静态图片打包成压缩包。然而，由于Gif的压缩算法，这个压缩包一点都不小。任何炫酷的礼物效果都可以产生数万亿到十万亿的文件。对于移动终端，下载和播放的性能不令人满意。Gif图片可以用于动画。WebP图片也可以用于动画，并且WebP图片比Gif图片小得多。下图是Gif和WebP之间的比较，以获得相同的效果。

复杂WebP动态图在编码和解码方面的性能不令人满意。尽管Android在4.0开始支持WebP，但在Android 4.2.1之后，它应该支持透明像素的有损WebP。Gif和WebP图片的另一个场景缺陷是，如果我想在播放某帧动画时动态插入一些帧，很难实现。就像我们最近推出的产品Orangy中匹配动画的效果一样，我在Love Peach的框架中间插入了两对动画的化身。

有了这么多的伏笔，我们终于要拿出我们的主角，方案四。方案四是YY UED团队开发的一套动画实现方案。作者将其命名为SVGA，它在许多YY产品线上运行良好。下面简要介绍其优点：

对切图兄弟和Bug Writer兄弟友好。嗯，是的，我们不需要再互相伤害了。

有效率的终端只需要继承这个方案框架，并将动画实现交给动画设计者。

高性能。在酷动画的基础上，播放性能优于Gif和WebP。

动画文件很小。对于相同的动画效果，SVGA文件比Gif和WebP文件小得多。

跨平台，支持Android、iOS、React Native、Web和最近刚推出的微信小程序，但小程序上的绘图功能较弱，效果有点感人。

开源，可以直接访问YY UED的Github来获取框架源代码

有关具体的使用姿势，请参阅开源库中关于自述的说明，或访问SVGA的官方网站。

实施原则

如果您熟悉SVG，就不难理解SVGA的实现原理。今天为时已晚，下一篇文章将继续讨论。感兴趣的学生可以阅读源代码一窥究竟。在查看代码之前，您如何看待内部实现？。哦，顺便说一句，这段代码的作者Pony（我经常叫他崔申）是整个堆栈中的一个大家伙。当我写Java时，我觉得语法太繁琐了。后来，我简单地用Kotlin重写了整个框架。这太反复无常了。我经常问崔深，他是否需要一个带茶的小弟弟