### Configuring Android MainActivity for SplashScreen

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Updates the `MainActivity.java` file to initialize and display the splash screen using `react-native-splash-screen`. It imports the necessary `SplashScreen` class and calls `SplashScreen.show(this)` within the `onCreate` method to ensure the splash screen is visible when the app starts.

```Java
import android.os.Bundle; // here
import com.facebook.react.ReactActivity;
// react-native-splash-screen >= 0.3.1
import org.devio.rn.splashscreen.SplashScreen; // here
// react-native-splash-screen < 0.3.1
import com.cboy.rn.splashscreen.SplashScreen; // here

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

--------------------------------

### Hiding SplashScreen on Component Mount in React Native

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.zh.md

This JavaScript snippet demonstrates how to hide the splash screen using `SplashScreen.hide()` within the `componentDidMount` lifecycle method of a React Native component. This is typically done after initial app setup or data loading is complete.

```JavaScript
import SplashScreen from 'react-native-splash-screen'

export default class WelcomePage extends Component {

    componentDidMount() {
    	 // do anything while splash screen keeps, use await to wait for an async task.
        SplashScreen.hide();//关闭启动屏幕
    }
}
```

--------------------------------

### Creating Android Launch Screen Layout XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Defines the layout for the Android splash screen using an XML file. This `RelativeLayout` contains an `ImageView` that displays the `launch_screen` drawable, scaled to cover the entire screen. This file should be placed in `app/src/main/res/layout`.

```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>
```

--------------------------------

### Enabling Android Window Translucency in App Theme XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.zh.md

This XML snippet modifies the `AppTheme` in `styles.xml` to include `android:windowIsTranslucent` set to `true`. This helps prevent a brief white screen flash during app startup by making the initial window transparent.

```XML
<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--设置透明背景-->
        <item name="android:windowIsTranslucent">true</item>
    </style>
</resources>
```

--------------------------------

### Configuring iOS AppDelegate for SplashScreen

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Modifies the `AppDelegate.m` file to integrate the splash screen on iOS. It imports `RNSplashScreen.h` and calls `[RNSplashScreen show]` or `[RNSplashScreen showSplash:inRootView:]` within the `application:didFinishLaunchingWithOptions:` method to display the splash screen upon app launch.

```Objective-C
#import "AppDelegate.h"

#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import "RNSplashScreen.h"  // here

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    // ...other code

    [RNSplashScreen show];  // here
    // or
    //[RNSplashScreen showSplash:@"LaunchScreen" inRootView:rootView];
    return YES;
}

@end
```

--------------------------------

### Configuring Android Settings.gradle for SplashScreen

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

This snippet adds the `react-native-splash-screen` module to the `settings.gradle` file, making it discoverable by the Android project. It specifies the project directory for the module, linking it to the `node_modules` folder.

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

--------------------------------

### Customizing Android Launch Screen Layout with XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.zh.md

This XML snippet defines a basic `LinearLayout` for the Android launch screen. It sets the layout to match parent dimensions and applies a background drawable named `launch_screen`, allowing for custom splash screen designs.

```XML
<?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>
```

--------------------------------

### Importing SplashScreen Module in JavaScript

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.zh.md

This snippet demonstrates how to import the `SplashScreen` module from the `react-native-splash-screen` library into a JavaScript file, making its functionalities available for use within the application.

```JavaScript
import SplashScreen from 'react-native-splash-screen'
```

--------------------------------

### Mocking react-native-splash-screen for Jest Testing (JavaScript)

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

This snippet provides a Jest mock for the `react-native-splash-screen` module. It defines mock implementations for the `show` and `hide` methods, allowing tests to run without actual native module interaction. This is essential for unit testing components that depend on the splash screen.

```JavaScript
// __mocks__/react-native-splash-screen.js
export default {
  show: jest.fn().mockImplementation( () => { console.log('show splash screen'); } ),
  hide: jest.fn().mockImplementation( () => { console.log('hide splash screen'); } ),
}
```

--------------------------------

### Integrating SplashScreen into Android MainApplication

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

This Java code modifies the `MainApplication.java` file to register `SplashScreenReactPackage` with the React Native application. It imports the necessary package and adds it to the list of `ReactPackage`s returned by `getPackages()`, enabling the splash screen functionality.

```Java
// react-native-splash-screen >= 0.3.1
import org.devio.rn.splashscreen.SplashScreenReactPackage;
// react-native-splash-screen < 0.3.1
import com.cboy.rn.splashscreen.SplashScreenReactPackage;

public class MainApplication extends Application implements ReactApplication {

    private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
        @Override
        public boolean getUseDeveloperSupport() {
            return BuildConfig.DEBUG;
        }

        @Override
        protected List<ReactPackage> getPackages() {
            return Arrays.<ReactPackage>asList(
                    new MainReactPackage(),
            new SplashScreenReactPackage()  //here
            );
        }
    };

    @Override
    public ReactNativeHost getReactNativeHost() {
        return mReactNativeHost;
    }
}
```

--------------------------------

### Importing SplashScreen in JavaScript

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Imports the `SplashScreen` module into a JavaScript file, making its functionalities available for use within the React Native application. This is the first step to interact with the splash screen from the JavaScript side.

```JavaScript
import SplashScreen from 'react-native-splash-screen'
```

--------------------------------

### Adding SplashScreen Dependency to Android Build.gradle

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

This code adds `react-native-splash-screen` as an implementation dependency in the `android/app/build.gradle` file. This ensures that the splash screen module is compiled and included in the Android application.

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

--------------------------------

### Enabling Translucent Splash Screen in Android Styles XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Modifies `android/app/src/main/res/values/styles.xml` to make the splash screen window translucent. Adding `<item name="android:windowIsTranslucent">true</item>` to the `AppTheme` style allows the underlying activity to be visible during the splash screen display, creating a smoother transition.

```XML
<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <!--设置透明背景-->
        <item name="android:windowIsTranslucent">true</item>
    </style>
</resources>
```

--------------------------------

### Defining SplashScreenTheme in Android Styles XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Defines a new style `SplashScreenTheme` in `android/app/src/main/res/values/styles.xml` that inherits from `SplashScreen_SplashTheme`. This style allows customization of the splash screen's appearance, specifically setting the `colorPrimaryDark` to the `status_bar_color`.

```XML
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="SplashScreenTheme" parent="SplashScreen_SplashTheme">
        <item name="colorPrimaryDark">@color/status_bar_color</item>
    </style>
</resources>
```

--------------------------------

### Fixing Stretched Splash Screen with ImageView scaleType (XML)

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

This XML snippet demonstrates how to configure the `launch_screen.xml` file to prevent splash screen stretching or distortion. By wrapping the splash screen image within an `ImageView` and setting `android:scaleType="centerCrop"`, the image will scale proportionally to fill the view, cropping if necessary. This ensures the splash screen appears correctly on various device sizes.

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

--------------------------------

### Displaying Splash Screen with Custom Theme in Android

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Modifies the `SplashScreen.show` method call in `MainActivity.java` to apply a custom theme, `R.style.SplashScreenTheme`, to the splash screen. This allows the status bar color to be customized during the splash screen display.

```Java
SplashScreen.show(this, R.style.SplashScreenTheme);
```

--------------------------------

### Defining Status Bar Color in Android XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Creates or updates `android/app/src/main/res/values/colors.xml` to define a custom `status_bar_color`. This color will be used to customize the status bar's appearance specifically when the splash screen is active.

```XML
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="status_bar_color"><!-- Colour of your status bar here --></color>
</resources>
```

--------------------------------

### Defining primary_dark Color in Android XML

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Adds a `primary_dark` color definition to `app/src/main/res/values/colors.xml`. This color is typically used for the status bar or other primary UI elements, here set to black (`#000000`).

```XML
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="primary_dark">#000000</color>
</resources>
```

--------------------------------

### Hiding SplashScreen in React Native Component

Source: https://github.com/crazycodeboy/react-native-splash-screen/blob/master/README.md

Demonstrates how to hide the splash screen within a React Native component. The `SplashScreen.hide()` method is called in the `componentDidMount` lifecycle method, ensuring the splash screen is dismissed after initial component rendering or asynchronous tasks are completed.

```JavaScript
import SplashScreen from 'react-native-splash-screen'

export default class WelcomePage extends Component {

    componentDidMount() {
    	// do stuff while splash screen is shown
        // After having done stuff (such as async tasks) hide the splash screen
        SplashScreen.hide();
    }
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.