React Native 实现Lottie动画

Lottie是Airbnb开源的一个面向iOS、Android、React Native的动画库，能加载Adobe After Effects导出的动画，并且能让原生App像使用静态素材一样使用这些动画，完美实现炫酷的动画效果。
使用流程上，Lottie动画需要先使用Adobe After Effects做出原动画，然后再使用官方提供的Bodymovin插件把动画导出成Json文件，而这个Json文件就是Lottie需要解析的动画源文件。
在React Native项目中使用Lottie动画，需要先安装lottie-react-native和lottie-ios插件，如下所示。

yarn add lottie-react-native
yarn add lottie-ios@3.2.3

安装完成之后，可以使用react-native link命令来链接原生库的依赖。当然，除此之外，我们还可以使用手动的方式来添加依赖。对于使用CocoaPods的iOS项目来说，需要添加如下的脚本文件。

pod 'lottie-ios', :path => '../node_modules/lottie-ios'
pod 'lottie-react-native', :path => '../node_modules/lottie-react-native'

然后，再执行pod install命令安装插件即可。对于原生Android来说，首先需要在android/settings.gradle文件中添加如下内容。

include ':lottie-react-native'
project(':lottie-react-native').projectDir =

标签：动画,lottie,react,ios,React,Native,Lottie,native
来源： https://blog.csdn.net/xiangzhihong8/article/details/120645886