You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

React Native Navigation v6与react-native-splash-screen(Android)兼容咨询

兼容React Native Navigation v6与react-native-splash-screen(Android端)

Absolutely! You can absolutely use react-native-splash-screen alongside React Native Navigation (RNN) v6 on Android—this combo still works perfectly, we just need to adjust the MainActivity.java setup since RNN v6 changed how the initial activity is structured. Let's break this down step by step:

1. Update MainActivity.java

Gone are the days of inheriting from SplashActivity for RNN. Instead, we'll extend RNN v6's base NavigationActivity and integrate the splash screen logic directly:

package com.yourappname;

import android.os.Bundle;
import com.reactnativenavigation.NavigationActivity;
import org.devio.rn.splashscreen.SplashScreen;

public class MainActivity extends NavigationActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // Show the splash screen FIRST, before initializing RNN
        SplashScreen.show(this);
        super.onCreate(savedInstanceState);
    }
}

This way, we let react-native-splash-screen handle the splash display, while still leveraging RNN v6's core activity management.

2. Verify react-native-splash-screen core configuration

Make sure you have the standard splash screen resources and manifest setup in place:

  • Create your splash screen layout (e.g., launch_screen.xml) in res/drawable or res/layout with your branding/design
  • Update AndroidManifest.xml to apply the splash theme to your MainActivity:
<activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
    android:launchMode="singleTask"
    android:windowSoftInputMode="adjustResize"
    android:theme="@style/SplashScreenTheme"> <!-- Add this line -->
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>
  • Define the SplashScreenTheme in res/values/styles.xml:
<style name="SplashScreenTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowBackground">@drawable/launch_screen</item>
</style>

3. Hide the splash screen once your app is ready

Once your initial RNN screen has fully loaded, trigger the splash screen hide from your React Native code (usually in your root component's initialization):

import SplashScreen from 'react-native-splash-screen';
import { useEffect } from 'react';

function RootComponent() {
  useEffect(() => {
    // Hide splash screen after app initialization completes
    SplashScreen.hide();
  }, []);

  // Your RNN navigation setup (e.g., Navigation.registerComponent) here
}

Quick Troubleshooting Tips

  • Always sync your Gradle files after modifying MainActivity.java to avoid build errors
  • If the splash screen doesn't show, double-check that SplashScreen.show(this) is called before super.onCreate(savedInstanceState)
  • If the splash screen hangs, ensure you're calling SplashScreen.hide() only after your app's initial content is ready (not too early in the lifecycle)

内容的提问来源于stack exchange,提问作者ofer2980

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.08 18:47:30