标签: lottie

我正在尝试使用 lottie 为 After Effects 中创建的 SVG 动画制作动画。我使用 bodymovin 扩展来导出 JSON 数据文件。但是，我也注意到导出包含一些 PNG 图像。我还收到控制台错误，说找不到 PNG。

当我在 AE 中使用 SVG（AI 文件）时，为什么要导出 PNG。下面是我的代码和错误。

索引.ts

import * as lottie from 'lottie-web';
import * as header from './assets/header.json';

import './css/base.sss';

var animation = lottie.loadAnimation({
    container: document.getElementById('header'),
    animationData: header,
    renderer: 'svg/canvas/html',
    autoplay: true
});

但是我收到以下错误，无法找到图像。为什么 bodymovin 导出/寻找 png？我需要SVG。

Chrome 控制台错误（对不起，直到 10 次才能嵌入）

我想在运行时以本机反应检测低性能设备以禁用复杂的lottie动画。我考虑使用来自 的设备型号react-native-device-info，但我应该有一个高性能手机列表

我想在Flutter应用中启动任何内容之前为启动屏幕添加Lottie动画。我签出的插件尚不完全支持动画的所有功能，或者无法按需工作。

有什么方法可以在实际的flutter活动启动之前添加它。我希望动画完全完成，然后再转到主要内容。

任何帮助表示赞赏，谢谢！

适用于Lottie IOS的​​AirBNB的README.md已更新。setAnimation不在自述文件中，也没有在更新版本3.0.0的选择器的快速下拉列表中注册。有人遇到此问题吗？Lottie cocoapod已成功安装。

README.md试用和错误重新启动

@IBOutlet private var animationView: AnimationView!

override func viewDidLoad() {
    super.viewDidLoad()

    startAnimation()

}

func startAnimation() {

    animationView.setAnimation(named: "spineffectloader")
    animationView.play()

}

使用 FFMPEG 视频处理库和 MediaCodec 处理 Lottie 动画有一些独特的概念。在这方面，我想从 Lottie 动画制作视频并将该视频叠加在其他原始视频上。

但问题是我无法从 Lottie 动画制作具有透明背景的视频。因此，我使用 MediaCodec 和 MediaMuxer 从 Lottie 动画制作了简单的视频，它从 Lottie Drawable 中一帧一帧地将其附加到视频（Lottie Video）。这是有关此概念的链接 - https://engineering.21buttons.com/how-to-generate-videos-using-lottie-in-android-2db6ecceb2a

然后我使用 FFmpeg 库将此视频叠加到原始视频上。这里 FFmpeg 执行两个任务，首先它在 Lottie Video 中制作透明背景，其次它将这个 Lottie Video 覆盖在原始视频之上。

这里实际的问题就出来了，FFmpeg 在处理 25 秒的视频时需要超过 8 到 9 分钟，所以我想找到这个问题的解决方案，因为我的时间限制只有 1 到 2 分钟。任何人都有解决方案或实现此概念的新IDE，那么请告诉我，我将不胜感激。

我已经被这个问题困扰了大约三天，几乎尝试了一切。通过这个过程我没有了解到的是lottie-react-native中的AndroidX支持是在版本3之后出现的。Expo cli不允许使用最新版本的lottie运行应用程序。它限制我使用 2.6.1 版本，这就是为什么我的应用程序在 expo android 客户端上崩溃，而它适用于 ios。

无论如何，我是否可以在不迁移到react-native-cli的情况下解决这个问题？

我知道如何导出Rive (Flare) 文件以在 Flutter 应用程序中使用，但如何将Adobe After Effects文件导入Rive？

我知道可以使用Lottie，但我无法弄清楚如何准确地做到这一点。

macOS Mojave After Effects 17.0.2 (CC 2020) Chrome/FF/Safari 和 Lottie/Bodymovin 最新版本

在 Safari 中缩放 svg 动画时（变换：scale(>1)），它将呈现极度像素化/模糊。在 Chrome 和 Firefox 中，它渲染没有问题。这是一个已知问题吗？如果是，是否有已知的解决方法？

您可以在这里找到动画： http: //kb.zeitweisen.com/Index.html

我似乎无法让 colorFilter 属性与我的 .json 文件一起使用。没有错误，但颜色显然没有改变。

<LottieView
     style={{
         width: 90,
         height: 90,
     }}
     colorFilters={
       [
         {
         keypath: "asdf",
         color: "#abcdef",
         }
       ]
     }
     source={badge.icon}
     loop={false}
/>

我正在使用 BodyMovin 从 After Effects 导入 .json，但我是否正确更改了图层名称？如果不是的话，这到底为什么不起作用？

我正在使用 GoogleMaps api 创建自定义地图屏幕，并希望使用自定义 Lottie 动画而不是静态位图创建地图标记。这可能吗？