skip to Main Content

I am facing problem while using the package of Splash Screen, Is there any other way I can set up a splash screen without the help of a package (in android)
reference: https://github.com/crazycodeboy/react-native-splash-screen

I tried all the possible methods listed in the repo, but still failed to do so either the package is too old now (version upgrade) or maybe some human error at my end.

2

Answers


  1. you’ll need to modify the Android project files directly. Here are the steps.

    • Open your React Native project in your preferred code editor.

    • Navigate to the android/app/src/main directory of your project.

    • Create a new directory called drawable if it doesn’t already exist.
      This is where you’ll store your splash screen image.

    • Place your splash screen image (usually a PNG file) inside the
      drawable directory. Make sure to use an image with the correct
      resolution for different screen densities (mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi).

    • Now, you need to modify the launch_screen.xml file. If it doesn’t
      exist, create it in the android/app/src/main/res/layout directory.
      This file will define the layout for your splash screen.

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

    Replace splash_screen_image with the actual name of your splash screen image file.

    Open the styles.xml file located in the android/app/src/main/res/values directory. Add the following style to define the theme for your splash screen:

    <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowBackground">@layout/launch_screen</item>
    </style>
    

    Now, open the AndroidManifest.xml file located in the android/app/src/main directory.

    Locate the <activity> tag with the android:name=".MainActivity" attribute.

    Add the android:theme attribute to the <activity> tag, specifying the SplashTheme style you defined earlier:

    <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:theme="@style/SplashTheme">
    

    Save all the modified files and rebuild your Android project by running react-native run-android or ./gradlew clean && react-native run-android in the project root directory.

    Login or Signup to reply.
  2. good day. I highly recommend this npm package. I used it for a splash screen and it’s really amazing, you just need to follow the steps and you are good to go.
    https://www.npmjs.com/package/react-native-bootsplash

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search