react-native-splash-screen icon indicating copy to clipboard operation
react-native-splash-screen copied to clipboard

White screen before splash screen

Open erennyuksell opened this issue 5 years ago • 8 comments

I'm facing the same issue https://github.com/crazycodeboy/react-native-splash-screen/issues/338#issue-389809278 @sergiulucaci's solution makes the app to start after some delay. https://www.youtube.com/watch?v=rnLR65OGtic i try this solution i can't apply my splash design because he is using layer-list instead of layout. Any other solution?

erennyuksell avatar Feb 24 '19 07:02 erennyuksell

I had the same issue. I just added android:windowIsTranslucent and android:colorBackground on styles.xml. Hope this works for you.

<style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:colorBackground">@color/primary_dark</item> <!--Change for the color you want -->
</style>

forgot to post where I found the solution:

https://stackoverflow.com/a/30343050

HeribertoAlves avatar Feb 26 '19 17:02 HeribertoAlves

In file res/layout/lauch_screen.xml add android:background="#ffffff" in tag RelativeLayout

Example: <RelativeLayout              ...              android:layout_height="match_parent"              android:background="#ffffff"> </RelativeLayout>

chiennv97 avatar Mar 08 '19 17:03 chiennv97

I have created a SplashActivity

import android.content.Intent; import android.os.Bundle; import androidx.appcompat.app.AppCompatActivity; public class SplashActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); Intent intent = new Intent(this, MainActivity.class); startActivity(intent); finish(); } }

and in AndroidManifest.xml

<activity android:name=".SplashActivity" android:label="@string/app_name" android:theme="@style/SplashTheme" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity>

SplashTheme is basic <style name="SplashTheme" parent="AppTheme"> <!-- Customize your theme here. --> <item name="android:windowIsTranslucent">true</item> </style>

martianatwork avatar Dec 16 '19 02:12 martianatwork

@martianatwork if you use android:windowIsTranslucent and react-native-orientation-locker together it breaks react-native-orientation-locker and Android 8.0 and above.

jqn avatar Feb 11 '20 23:02 jqn

For me what worked was this tutorial https://codingambitions.com/reactnative/how-to-add-splash-screen-in-react-native-app-for-android/

Adding true at AppTheme

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowDisablePreview">true</item>
    </style>

jonasmedeiros avatar Sep 29 '20 20:09 jonasmedeiros

I've read somewhere that most likely the problem is in the router. I moved SplashScreen.hide() in my router's useEffect and everything works fine (there is no white screen anymore)

VashaMasha avatar Mar 31 '21 08:03 VashaMasha

@jonasmedeiros thank you for the solution...did you notice that when we click app icon, it takes some time to start app and show up on screen? In debug APK it is quite noticeable, in release APK, its a short delay.

devWaleed avatar Aug 24 '21 11:08 devWaleed

Yeap, I see delay 1 sec (only colorBackgound) before run custom splash screen https://developer.android.com/topic/performance/vitals/launch-time & <item name="android:windowDisablePreview">true</item> help, thx.

anatooly avatar Feb 05 '24 09:02 anatooly