动画学习笔记1

        学习动画的第一篇笔记，主要是使用Lottie并且结合Adobe After Effects制作一个简单的动画。Lottie可以从json中读取动画并且播放，Adobe After Effects用来制作动画，并且使用bodymovin插件将制作的动画转为json格式。

        准备工作，安装Adobe After Effects（AE）和bodymovin插件，AE安装就不说了，bodymovin安装需要使用zxpinstaller，Bodymovin AE Extension下载地址：https://github.com/airbnb/lottie-web/tree/master/build/extension   ，zxpinstaller下载地址：https://aescripts.com/learn/zxp-installer/ ，由于之前没有接触过ps等图形或者动画处理工具，所以这里主要记录下怎么用AE做一个简单的动画。

        打开AE，界面如下：

右键点击红色空包区域，选择新建合成。之后会弹出对话框，对话框里面的东西可以不用改，主要注意下红框里面的时间信息，时间分为四段，小时：分钟：秒：帧数，以截图为例，图中帧速率是25，持续时间是5秒，也就是说总共为125帧，持续时间当然也可以写成00：00：05：20这个样子，这样总共就是145帧了。

点击确定后会多出一个合成，这个时候可以添加一个形状进去，点击下图中的矩形图标（也可以点击Q键），然后再黑色背景下拉出一个图形，这里我选的是圆角矩形，

注意到左下角多了一个形状图层，就是这个矩形，将属性点开，如下图：

主要利用变换中的选项来完成动画，这个地方提一个概念，叫做关键帧，此处以位置为例，点击位置左侧的图标，就开始记录关键帧了，如下图，点击后，右侧时间条多了一个点，就是位置这一项在0秒处的关键帧。

此时我们先将时间轴往后拖，鼠标点住0秒处的游标拉倒3秒处

然后我们改变位置，可以直接输入数值，也可以左键点住位置选项右边的数字左右拖动，矩形就会随之移动了，当位置数值发生变化后，就会发现，时间轴中，3秒处又多了一个关键帧的点。

此时点击空格就能看到播放效果了。这个动画就是由两个关键帧来确定的，也可以用类似的方法对其他属性设置关键帧。此时我们就有了一个简单的动画了。接下来就是转成json了。点击窗口-扩展，选中我们已安装的bodymovin插件

bodymovin界面如下：

点击箭头1处的白点，选中当前的合成1，然后点击2选择输出json文件的目录，之后点击3进行转换。这样就生成对应动画的json文件了，接下来就可以在android项目中使用了。

Lottie的使用参考下面的文章：

https://cloud.tencent.com/developer/article/1005896