在 Flutter 应用程序中使用 Lottie Animation 的原生 android 启动画面

Question

我从来没有开发过原生的 android 应用程序，所以进入 android 文件夹真的让我很困惑。 但是，设置一个 png 图像以显示在初始屏幕中非常简单，我已经设法做到了。 我已经在 After Effects 中对徽标进行了动画处理，希望我只将 LottieAnimationView 添加到本机启动画面的背景层列表中，但这显然不起作用哈哈。 我不想要一个带有计时器的假闪屏。 我真的只想在应用程序初始化时显示这个 animation，所以我没有为此创建 flutter 小部件。 lottie animation 如何在层列表中显示？ 可能吗？ 不需要 android 视图就可以完成吗？ （因为我真的从来没有搞砸过）。 这是我尝试过的：

   <item>
    <com.airbnb.lottie.LottieAnimationView
                android:id="@+id/animation_view"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:lottie_fileName="logo.json"
                app:lottie_loop="true"
                app:lottie_autoPlay="true" />
    </item> 

Answer 1

以下是如何实现此目的的说明： https://medium.com/swlh/native-splash-screen-in-flutter-using-lottie-121ce2b9b0a4

1. 首先将 Lottie 依赖项添加到项目的 build.gradle 文件中，该文件位于 /android/app/（我也添加了约束布局依赖项）。

2. In AndroidManifest.xml remove meta data tag with the name io.flutter.embedding.android.SplashScreenDrawable and replace LaunchTheme under activity tag with NormalTheme.

您可以从 /android/app/res/values/styles.xml 中删除 LaunchTheme，因为您不再需要它了。

3. 在 /android/app/res/values 下创建一个原始目录并复制 .json 文件，无论您是创建自己的文件还是从上面的链接下载免费示例。

4. 为了使用 .json 文件并显示 animation 视图，我们需要创建一个带有其布局的启动视图 class。 在 /android/app/res 下，创建一个名为 layout 的新目录（如果它不存在），然后创建一个名为 splash_view.xml 的新资源文件。

对于这个演示，我将 animation 设置为自动播放，速度为 1.0。 而且我不希望它循环。 您可以根据需要使用不同的值。 最重要的部分是 app:lottie_rawRes 表示我们要使用我们在 raw 目录中添加的 json 文件。 现在，我们需要创建启动视图 class。 您可以通过转到 /android/app/src/main/kotlin/YOUR-PACKAGE-NAME/ 并创建一个新的 kotlin class 来做到这一点。 称之为 SplashView。

如您所见，此视图正在夸大 splash_view 布局。 最后一步是让 MainActivity 知道我们的自定义启动视图。

5. Go 到 /android/app/src/main/kotlin/YOUR-PACKAGE-NAME/ 并单击 MainActivity.kt。 FlutterActivity 提供了一个名为 provideSplashScreen 的方法，我们只需要实现它。