Use new android 12 splashscreen api

[wilau2]

https://developer.android.com/about/versions/12/features/splash-screen

[Erdenezayaa]

I found a workaround on android 12. I followed official documentation on migrating to new splash screen here

I changed the backgroundColor of splash screen but couldn't change the icon shape. My splash screen logo shape is rectangle so It looked zoomed in inside the circle. So I just left splash icon as default app icon.

Then I created duplicate launch_screen.xml only works on android 12. I removed the logo in this new launch_screen.xml. So it doesn't duplicate with the first splash screen.

[brunomartinezciompi]

@Erdenezayaa can you share your code? What layout file did you added on setContentView call? How do you handle navigation after that?

[Erdenezayaa]

@brunomartinezciompi MainActivity.java

@Override
protected void onCreate(Bundle savedInstanceState) {
    SplashScreen.show(MainActivity.this);
    super.onCreate(null);
}

android/app/src/main/res/

With this configuration on Android 12 Native splash screen -> layout-v31/launch_screen.xml -> Javascript bundle loads -> React Navigation Screens For older android versions, it is same as before layout/launch_screen.xml -> Javascript bundle loads -> React Navigation Screens

[zoontek]

Just for information and as this package doesn't seem maintened, react-native-bootsplash@4 supports Android 12 and the new SplashScreen API.

[antliann]

It was quite easy indeed to configure my old implementation for Android 12 and leave it with the same behavior: First, change you app/build.gradle file with the following:

android {
   compileSdkVersion 31
   ...
}
dependencies {
   ...
   implementation 'androidx.core:core-splashscreen:1.0.0-beta01'
}

Then, add this style to your styles:

<style name="Theme.App.Starting" parent="Theme.SplashScreen">
    <item name="android:windowIsTranslucent">true</item>
    <item name="postSplashScreenTheme">@style/AppTheme</item> // or other theme you want to use
</style>

In the AndroidManifest.xml change the theme of your main activity:

android:theme="@style/Theme.App.Starting"

The last step: in the MainActivity.java change:

@Override
  protected void onCreate(Bundle savedInstanceState) {
    androidx.core.splashscreen.SplashScreen.installSplashScreen(this); // native splash screen which will be skipped
    org.devio.rn.splashscreen.SplashScreen.show(this, true); // custom splash screen from this lib
    super.onCreate(null);
  }

This will keep your custom splash screen implementation and, which is more important, the custom design ability. I made so in my app and everything works perfect, my app is opening immediately and right away with the custom image splash.

P.S. I have an opinion that Instagram uses the same hack, as the Instagram app (which is in React Native and probably uses this library) opens with its custom splash on Android 12, not the native one.

[tomasz89nowak]

I made it by changing

SplashScreen.show(this);

to

SplashScreen.show(this.getPlainActivity());

[visheshtgupta]

In the styles.xml file. Add this line for to resolve this issue

<item name="android:windowIsTranslucent">true</item>

[Lelouch65428]

It was quite easy indeed to configure my old implementation for Android 12 and leave it with the same behavior: First, change you app/build.gradle file with the following:

android {
   compileSdkVersion 31
   ...
}
dependencies {
   ...
   implementation 'androidx.core:core-splashscreen:1.0.0-beta01'
}

Then, add this style to your styles:

<style name="Theme.App.Starting" parent="Theme.SplashScreen">
    <item name="android:windowIsTranslucent">true</item>
    <item name="postSplashScreenTheme">@style/AppTheme</item> // or other theme you want to use
</style>

In the AndroidManifest.xml change the theme of your main activity:

android:theme="@style/Theme.App.Starting"

The last step: in the MainActivity.java change:

@Override
  protected void onCreate(Bundle savedInstanceState) {
    androidx.core.splashscreen.SplashScreen.installSplashScreen(this); // native splash screen which will be skipped
    org.devio.rn.splashscreen.SplashScreen.show(this, true); // custom splash screen from this lib
    super.onCreate(null);
  }

This will keep your custom splash screen implementation and, which is more important, the custom design ability. I made so in my app and everything works perfect, my app is opening immediately and right away with the custom image splash.

P.S. I have an opinion that Instagram uses the same hack, as the Instagram app (which is in React Native and probably uses this library) opens with its custom splash on Android 12, not the native one.

this is working, but there is a slight delay when we open the app. Basically, when you tap the app icon, there is a slight delay before the app opens. Any solution for this?

[priami93]

It was quite easy indeed to configure my old implementation for Android 12 and leave it with the same behavior: First, change you app/build.gradle file with the following:

android {
   compileSdkVersion 31
   ...
}
dependencies {
   ...
   implementation 'androidx.core:core-splashscreen:1.0.0-beta01'
}

Then, add this style to your styles:

<style name="Theme.App.Starting" parent="Theme.SplashScreen">
    <item name="android:windowIsTranslucent">true</item>
    <item name="postSplashScreenTheme">@style/AppTheme</item> // or other theme you want to use
</style>

In the AndroidManifest.xml change the theme of your main activity:

android:theme="@style/Theme.App.Starting"

The last step: in the MainActivity.java change:

@Override
  protected void onCreate(Bundle savedInstanceState) {
    androidx.core.splashscreen.SplashScreen.installSplashScreen(this); // native splash screen which will be skipped
    org.devio.rn.splashscreen.SplashScreen.show(this, true); // custom splash screen from this lib
    super.onCreate(null);
  }

This will keep your custom splash screen implementation and, which is more important, the custom design ability. I made so in my app and everything works perfect, my app is opening immediately and right away with the custom image splash.

P.S. I have an opinion that Instagram uses the same hack, as the Instagram app (which is in React Native and probably uses this library) opens with its custom splash on Android 12, not the native one.

i have this error: error: incompatible types: boolean cannot be converted to int org.devio.rn.splashscreen.SplashScreen.show(this, true); // custom splash screen from this lib _____________________________________________________^