react-native-splash-screen

To enable the splash screen on Android, update MainActivity.java:

public class MainActivity extends ReactActivity {
   @Override
    protected void onCreate(Bundle savedInstanceState) {
        SplashScreen.show(this);  // Add this line
        super.onCreate(savedInstanceState);
    }
    // ...other code
}

Customizing the Layout: Create a file named launch_screen.xml in your Android resources to define the splash screen layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/launch_screen">
</LinearLayout>

Preventing White Flash (Translucent Theme): To avoid a brief white screen during app startup, add android:windowIsTranslucent to your theme in android/app/src/main/res/values/styles.xml:

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

Follow these steps to manually link and configure the plugin for Android:

1. Link the project

In android/settings.gradle:

include ':react-native-splash-screen'   
project(':react-native-splash-screen').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-splash-screen/android')

In android/app/build.gradle:

dependencies {
    implementation project(':react-native-splash-screen')
}

2. Register the package

Update MainApplication.java to include SplashScreenReactPackage in your getPackages() list:

// react-native-splash-screen >= 0.3.1
import org.devio.rn.splashscreen.SplashScreenReactPackage;

// Inside getPackages()
return Arrays.<ReactPackage>asList(
    new MainReactPackage(),
    new SplashScreenReactPackage()
);

3. Initialize the Splash Screen

Update MainActivity.java to show the splash screen when the activity is created:

import android.os.Bundle;
// react-native-splash-screen >= 0.3.1
import org.devio.rn.splashscreen.SplashScreen;

public class MainActivity extends ReactActivity {
   @Override
    protected void onCreate(Bundle savedInstanceState) {
        SplashScreen.show(this);
        super.onCreate(savedInstanceState);
    }
}

1. Create Layout File

Create app/src/main/res/layout/launch_screen.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/launch_screen" android:scaleType="centerCrop" />
</RelativeLayout>

2. Add Images

Place your splash image (e.g., launch_screen.png) in the appropriate drawable folders (e.g., drawable-hdpi, drawable-xhdpi, etc.).

3. Optional: Transparent Background

In android/app/src/main/res/values/styles.xml, add:

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

4. Optional: Status Bar Color

Add a color to app/src/main/res/values/colors.xml:

<resources>
    <color name="status_bar_color">#YOUR_COLOR_HERE</color>
</resources>

And define a style in styles.xml:

<style name="SplashScreenTheme" parent="SplashScreen_SplashTheme">
    <item name="colorPrimaryDark">@color/status_bar_color</item>
</style>

Then call SplashScreen.show(this, R.style.SplashScreenTheme); in MainActivity.java.