Lottie 跨平台支持矩阵——每个平台怎么接入

官方支持的平台

平台	仓库	安装方式	当前主要维护者
Android	airbnb/lottie-android	Gradle `implementation "com.airbnb.android:lottie:X.Y.Z"`	Airbnb 团队
iOS / macOS / tvOS / visionOS	airbnb/lottie-ios	Swift Package Manager / CocoaPods / Carthage	Airbnb 团队
Web	airbnb/lottie-web	npm / CDN / Bodymovin 插件内置下载	Airbnb 团队
React Native	airbnb/lottie-react-native	`npm install lottie-react-native`	Airbnb 团队 + 社区
Windows	lottie/lottie-windows	通过 UWP / WinUI 3	社区维护

社区封装

这些不是官方仓库，但维护活跃、生产可用：

Flutter：lottie-flutter（pub.dev，官方推荐）
Xamarin / MAUI：Lottie.Forms（NuGet）
Unity：unity-lottie-plugin
Vue：vue3-lottie、lottie-vuejs
Angular：ngx-lottie
Svelte：svelte-lottie-player

不同平台的 API 风格差异

Lottie 在各平台的 API 设计遵循平台原生习惯，所以同一个动画在不同平台上的代码写法会有差异：

Android —— 继承 ImageView 的 LottieAnimationView：

val animationView = findViewById<LottieAnimationView>(R.id.animation_view)
animationView.setAnimation("loading.json")
animationView.playAnimation()

iOS —— UIView 子类 LottieAnimationView：

let animationView = LottieAnimationView(name: "loading")
animationView.play()

Web —— 函数调用，返回一个 player 对象：

const animation = lottie.loadAnimation({
  container: document.getElementById('lottie'),
  path: 'loading.json',
  renderer: 'svg',
  loop: true,
  autoplay: true,
});

React Native —— 组件化写法：

import LottieView from 'lottie-react-native';

<LottieView source={require('./loading.json')} autoPlay loop />

同一个 JSON，到处渲染

关键是：上面所有不同写法，底层加载的是同一个 Bodymovin JSON 文件。设计师导出一次，5 个平台直接消费，不用改任何内容。这就是 Lottie 最核心的价值——"设计一次，到处渲染"。