Setup translucent status bar of splash screen on android (#3300)

Co-authored-by: Eric Bailey <git@esb.lol>

app.config.js

@@ -161,6 +161,7 @@ module.exports = function (config) {
         './plugins/withAndroidManifestPlugin.js',
         './plugins/withAndroidManifestFCMIconPlugin.js',
         './plugins/withAndroidStylesWindowBackgroundPlugin.js',
+        './plugins/withAndroidSplashScreenStatusBarTranslucentPlugin.js',
         './plugins/shareExtension/withShareExtensions.js',
       ].filter(Boolean),
       extra: {

plugins/withAndroidSplashScreenStatusBarTranslucentPlugin.js

@@ -0,0 +1,28 @@
+const {withStringsXml, AndroidConfig} = require('@expo/config-plugins')
+
+module.exports = function withAndroidSplashScreenStatusBarTranslucentPlugin(
+  appConfig,
+) {
+  return withStringsXml(appConfig, function (decoratedAppConfig) {
+    try {
+      decoratedAppConfig.modResults = AndroidConfig.Strings.setStringItem(
+        [
+          {
+            _: 'true',
+            $: {
+              name: 'expo_splash_screen_status_bar_translucent',
+              translatable: 'false',
+            },
+          },
+        ],
+        decoratedAppConfig.modResults,
+      )
+    } catch (e) {
+      console.error(
+        `withAndroidSplashScreenStatusBarTranslucentPlugin failed`,
+        e,
+      )
+    }
+    return decoratedAppConfig
+  })
+}

src/App.native.tsx

@@ -76,7 +76,6 @@ function InnerApp() {
 
   return (
     <SafeAreaProvider initialMetrics={initialWindowMetrics}>
-      {isAndroid && <StatusBar />}
       <Alf theme={theme}>
         <Splash isReady={!isInitialLoad}>
           <React.Fragment