每个区域的作用分别是:
项目: 管理当前项目以及一些项目参数的预览
资源: 导入到 AE 中的所有外部资源如图像等在这里进行统一管理
图层: 在这里为每一个图层添加/编辑关键帧和属性
时间轴: 在这里可以编辑动画的关键帧和曲线...预览: 动画和编辑实时预览/编辑窗口
工具: 各种工具的集合, 如文字工具、图形工具等
属性: 在这里编辑元素的属性
首先, 选择我们新建的合成, 点击工具栏的圆角矩形按钮, 同时按住shift, 在预览区域绘制一个矩形...这么做的意思是: 让图层的Y轴坐标属性, 在0帧到20帧的过程中, 从150动画到380, 是不是很容易理解? 现在按下空格键, 预览效果!...OK, 现在我们已经添加完了所有的位移关键帧, 按空格再次预览, 如图:
?
这时, 因为我们的动画都是匀速运动, 看起来会很生硬, 因为真实世界中物理运动是有加速度的。.../index.html, 打开浏览器, 将会看到我们的动画, 是不是非常酷~
除了能够播放和暂停, Lottie 还为我们提供了更加精细的动画控制方法和事件钩子, 有兴趣的小伙伴参考: GitHub