从 AppLoading 看不到启动画面

Posted

技术标签:

【中文标题】从 AppLoading 看不到启动画面【英文标题】:Splash Screen not visible from 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"
     ,
     ...
  

【问题讨论】:

【参考方案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 中是否有效,请填写!

【讨论】:

以上是关于从 AppLoading 看不到启动画面的主要内容,如果未能解决你的问题,请参考以下文章

在 Flutter 的启动画面期间加载数据

iOS 从远程通知打开时使用不同的启动画面?

如何在 React Native 中的启动画面后禁用后退按钮

从 Ionic 浏览器更改启动画面

为啥?我电脑启动QtScrcpy.exe这个程序,电脑桌面显示手机画面不到3秒钟,就消失没了?

加载前启动画面白色闪烁(React Native Expo)