Lottie是 airbnb 开源的可应用于Android,iOS,Web,React NativeWindows动画库, 本质上是一套跨平台的动画解决方案。它提供了一套完整的从 AE 到各个终端的工具流,通过 AE 的 Bodymovin 插件将设计师做的动画导出成一套定义好的 json 文件,之后再通过 Lottie 各端的库就可以实现动画效果,动画还原度 100%。

    1. <!-- lottie动画测试 2019/10/7 16:38 -->
    2. <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
    3. <lottie-player src="https://assets8.lottiefiles.com/packages/lf20_ZWEJL5.json" mode="bounce" background="#FFFFFF" speed="1" style="width: 300px; height: 300px;" loop autoplay>
    4. </lottie-player>
    5. <lottie-player src="https://assets9.lottiefiles.com/datafiles/gUENLc1262ccKIO/data.json" background="transparent" speed="1" style="width: 300px; height: 300px;" hover loop autoplay>
    6. </lottie-player>