mehcode / rn-splash-screen

A JavaScript-controlled splash-screen for React Native designed to be run directly after the native splash-screen.
MIT License
350 stars 95 forks source link

Pink face showing on startup : android #34

Closed basith374 closed 7 years ago

basith374 commented 7 years ago

android_splash_screen_problem2

The pink face is showing before the actual splash screen shows on android marshmallow. The screenshot was taken just after clicking on the app icon. As you can see the pink face is visible while its enlarging but shows my splashscreen after the pink face has enlarged to full screen. Of course this happens in less than a second and is not spotted quite easily. But it doesn't look good. There is something that i might've missed. Please help me fix it.

location of splash.png is in app/src/main/res/drawable folder. i've tried 9 patch png too, naming it as both splash.png and splash.9.png and it still doesn't work.

cbrevik commented 7 years ago

It seems like the styles.xml provided with the rn-splash-screen module is being included in the project as well. The image is included in this module as well.

The Java splash code is referencing this specific style (RNSplashScreen_SplashTheme) in the code.

What I did to fix this was to include this specific style in my own project styles.xml. Basically this is how it looks for me:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowBackground">@drawable/splash</item>
    </style>
    <style name="RNSplashScreen_SplashAnimation">
        <item name="android:windowExitAnimation">@android:anim/fade_out</item>
    </style>
    <style name="RNSplashScreen_SplashTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:windowBackground">@drawable/splash</item>
        <item name="android:windowAnimationStyle">@style/RNSplashScreen_SplashAnimation</item>
    </style>
</resources>
mehcode commented 7 years ago

Fixed in v4.0.0; let me know if you still have problems. Usage changed a touch; check the example.

sibelius commented 7 years ago

@mehcode I still needed to do @cbrevik hack on v4.0.0

mehcode commented 7 years ago

@sibelius Can you reproduce this on the example? I was able to reproduce the original problem (or at least a problem with an identical symptom) and that was fixed after 3cdbb18.

sibelius commented 7 years ago

@mehcode I had to follow this workaround to avoid the pink splash screen

https://github.com/mehcode/rn-splash-screen/issues/34#issue-197357254

mehcode commented 7 years ago

I understand what you said @sibelius. I'm asking if you can take the example here and show me the same issue. It's hard to fix what I can't reproduce.

sibelius commented 7 years ago

it is working fine on example

I'll try to clean my gradle cache here.

the example should be updated to use RN42 and rn-splash-screen 4