记录调研 Lottie 的使用

Lottie 使用流程

使用 Adobe After Effects 设计出动画之后，使用 Lottie 提供的 Bodymovin 插件将设计好的动画导出成 JSON 格式

Lottie 动画社区

LottieFiles - Free animation files built for Lottie

Lottie 动画创建

上传 json

在线查看（下载导出动画）

web端使用的组件

LottieFiles/lottie-player 导出 Lottie-player 组件

<script src="<https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js>"></script>
<lottie-player src="<https://assets1.lottiefiles.com/packages/lf20_l2unwjkj.json>" background="transparent" speed="1" style="width: 300px; height: 300px;" loop controls autoplay></lottie-player>

在线编辑 Lottie 动画资源获取 获取导出动画