从 AppLoading 看不到启动画面答案

【问题标题】：Splash Screen not visible from AppLoading从 AppLoading 看不到启动画面
【发布时间】：2021-08-19 19:50:13
【问题描述】：

import React from "react";
import AppLoading from "expo-app-loading";

export default function App() {
    return <AppLoading />;
}

上面的代码不是应该向我显示启动画面吗？我得到的只是一个白屏。真的很感激知道我在这里做错了什么。我的资产文件夹中有 splash.png。

我的 app.json 文件：

{
  "expo": {
     ...
     "splash": {
       "image": "./assets/splash.png",
       "resizeMode": "contain",
       "backgroundColor": "#e2fcff"
     },
     ...
  }
}

【问题讨论】：

标签： react-native expo react-native-web expo-web

【解决方案1】：

App loading documentation在文档中说需要提供额外的参数

export default function App() {

  const [isLoading, setLoading] = useState(true);

  if (isLoading) {
   return(
    <AppLoading 
      startAsync={() => console.log('starting')}
      onFinish={() => { setTimeout(() => {setLoading(false)}, 1000) }}
      onError={(err) => {console.log(err)}}
    />
   )
  }

  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
    </View>
  );
}

【讨论】：

今天该文档声明参数是可选的。它无需参数即可工作。

【解决方案2】：

您显示的代码看起来不错。然而，还有更多。

对我来说，实际上什么应该起作用而不是不起作用，我很不清楚。对于运行custom-managed workflow 的我来说，AppLoading 在我预构建 android/ios 并运行独立应用程序时起作用。当我在 Expo Go 应用程序中运行时，我只看到一个空白屏幕而不是启动屏幕。

人们有discussed if AppLoading works in bare workflow 并且根据Expo's sdk 它应该。它也适用于我的预构建，因此支持裸工作流（在 Expo SDK 42 中）。

不过，我没有看到任何关于在 Expo Go 应用程序中显示启动画面的内容，因此无法确定是否支持。

然后是网络...再次，不确定它是否应该工作 - 它不适合我。它在加载时显示一个空白页面。在fonts guide 中，有一个使用 AppLoading 的 Expo 小吃，它在 Android 上显示一个启动屏幕，但在 Web 上只是一个空白页面。 The AppLoading docs 声称它支持网络。如果这意味着它不会崩溃，或者实际显示的初始屏幕图像是未知的。 AppLoading 文档进一步声称它使用SplashScreen 来显示启动屏幕，它没有网络支持。所以，我想网络上没有这样的启动画面（这不会让我感到惊讶，因为启动画面在网络上并不常见）。

就我个人而言，我对 Android/iOS 对独立应用程序的支持很好。我只使用 Expo Go 进行测试。此外，我将用于移动设备的启动画面无论如何在网络上都无法正常工作。我将展示的骨架看起来与 Web 版本不同，因此我宁愿在 Web 的自定义初始屏幕中实现。

AppLoading 支持总结：

同时支持托管和裸工作流。
它适用于独立应用程序。
不确定它是否会在 Expo Go 应用中显示启动画面。
Web 似乎回退到显示空白页面。

如果我在某处说错了，或者如果有人知道 AppLoading 在 Expo Go App 中是否有效，请填写！

【讨论】：