LaunchImage is not hiding in iOS

[aditya27dev]

Hello,

On the android platform splash screen is working fine. But on the iOS platform, splash screen is not hiding. Please guide.

export default class Main extends Component {
  componentDidMount() {
    SplashScreen.hide();
  }
  render() {
    return (
      <View>
      </View>
    );
  }
}

[danieljvdm]

+1

[rsml]

+1
I'm using iOS 11 and react-native-splash-screen 3.0.1

[danieljvdm]

The problem I was having was that I was calling [SplashScreen show]; too early in my AppDelegate. Make sure it's after the call to [self.window makeKeyAndVisible];

[jweboy]

I really have been removed after

[self.window makeKeyAndVisible];

but also the same problem, splash screen is not hiding, I'm using iOS 10.3 and react-native-splash-screen 3.0.1 react-native 0.44.3

[YasirSherzad]

Hi , can someone help me out. I can't get the splashscreen working for iOS, I get black screen. I am not sure if I have set it up correctly on iOS. There is only an example for customizing splashscreen on iOS.

[QuantBull]

@YasirPanjsheri show your code of AppDelegate.m、Info.plist and Images.xcassets.

[IvanzZ0814]

has this problem was solved?

[danieljvdm]

It's not a problem... it's just incorrect usage. If you want help post your AppDelegate.m applicationDidLaunch code function

[ghost]

+1
Using "react-native":"0.47.2" and "react-native-splash-screen":"^3.0.6"!
The screen does not disappear after calling SplashScreen.hide() in componentDidMount() function in my LoginScreen.
Here is my AppDelegate.m

#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>
#import <React/RCTRootView.h>
#import "SplashScreen.h"
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  NSURL *jsCodeLocation;
  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"MyApp"
                                               initialProperties:nil
                                                   launchOptions:launchOptions];
  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];
  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  [SplashScreen show];
  return YES;
}
@end

Here is my LoginScreen.js (as part of StackNavigator of react-navigation):

const AuthNavigator = StackNavigator(
  {
    LoginScreen: {screen: Login},
    RegisterScreen: {screen: Register}
  },
  {
    initialRouteName: 'LoginScreen',
    headerMode: 'none'
  }
)
...
class LoginScreen extends React.Component {
  componentDidMount() {
    setTimeout(SplashScreen.hide(), 3000)
  }
  ...
}

Any help?

[danieljvdm]

@Ralcon likely you haven't linked the library properly. Are you sure you ran react-native link react-native-splash-screen?

[ghost]

This is the output:

myName:MyApp (feature/BlaBlaBla *)$ react-native link react-native-splash-screen
Scanning 1157 folders for symlinks in /Users/myName/DEV/projects/MyApp/node_modules (9ms)
rnpm-install info Android module react-native-splash-screen is already linked
rnpm-install info iOS module react-native-splash-screen is already linked

I'm on a mac. Are there any known issues or problems?
I will try to follow the instructions of a manual installation. Maybe this helps?! I will give you an info...

[6axter82]

same here, I have got the same problem, splash screen doesn't disappear

[6axter82]

@Ralcon I have deleted the ios directory in my project with rm -rf ios,
than react-native eject,
after react-native link.

This helped me and now everything is fine.

[aditya-simplecrm]

If I add the splash screen through LaunchScreen.xib then this library works like a charm.
But if I add splash screen images in Images.xcassets then splash screen is not hiding.

[tikkichan4]

If I add the splash screen through LaunchScreen.xib then this library works like a charm. But if I add splash screen images in Images.xcassets then splash screen is not hiding.

Same here. But for my use case, i need to use images.xcassets instead of LaunchScreen.

[6axter82]

@tikkichan4 try to do the suggestion from the Nov 30, 2017 above.

[HelloHxz]

I remove [SplashScreen show] in my native code , then found some error in my js code; that is the real reason for it; sorry , my english is very poor; holp it can help

[christophermark]

The iOS implementation of this library creates a semi-blocking loop which is dangerous depending on where you instantiate it.

I'm not entirely sure how this is all working, but from what I understand:
Black screen
Try making sure you call [SplashScreen show] specifically inside the didFinishLaunchingWithOptions lifecycle method.

Splash screen won't hide
Move where you put the [SplashScreen show] until after the React Native view is already created, else the splash screen's blocking loop never allows React Native to be instantiated. You might have to put both the React Native view creation also inside the didFinishLaunchingWithOptions, and before the splash screen show.

[mileung]

@christophermark What's the "React Native view creation"?

[christophermark]

@mileung it's when you create and assign the RCTRootView, the native view which holds the React Native view.

https://facebook.github.io/react-native/docs/integration-with-existing-apps.html#the-magic-rctrootview

[841660202]

now anyone could solve this issue, give me some help? waiting answer on line.

[wincod75]

So, I had the same exact issue, this is how I fixed it. Seems a bit glitchy in my emulator, will test on actual device.

change -> DidMount to -> WillMount

componentWillMount() {
SplashScreen.hide();
}

"react": "^16.3.2",
"react-native": "^0.55.4"

UPDATE

While this will work, if you have an authenticated space (login/logout) with tokens, which allows the app to not always fire from the initial launch screen, the splash screen still remains and does not hide. Currently exploring additional options.

UPDATE PART 2

Ok, so if your app has the potential to launch from different screens (login screen/another screen) you'll need to import RN Splash Screen and hide on both screens. Component Did Mount does not work for me on my launch screen; it does work on my other "interior" screen. Component Will Mount works everywhere.

[stephencookdev]

I had this issue, but because of an issue nothing to do with this library 🙈

Just in case anyone else is in the same boat - check that your root component doesn't have a render error! The splash screen hides react-native's default red screen error, so you might not notice properly.

If your component has a render error, then your componentDidMount() { SplashScreen.hide() } never gets called! 😨

If you're using React 16, you can make this a little less confusing by changing your code to this:

componentDidMount() {
  SplashScreen.hide();
}

componentDidCatch() {
  SplashScreen.hide();
}

[VinceBT]

@danieljvdm This worked for me, this issue needs to be documented in the readme @crazycodeboy

[DISKONEKTeD]

edit: nvm, my issue was an export issue. I forgot to place 'default', when i changed my root set up. So when i imported it to the file where i register the app, it wasn't exporting correctly. Oops.

[ShaharyarMaroof]

@aditya-simplecrm did you manage to solve the issue you were facing? I am also facing the same issue, where I have to use the image assets instead of the LaunchScreen.xib. Any help would be appreciated.

[ShaharyarMaroof]

I've tried @wincod75 and @stephencookdev 's solution. But none of them are working. I'm using react-native 0.60.6 and react-native-splash-screen 3.2.0. For android it is working perfectly.

In my AppDelegate file I have the required lines in the following order.

[self.window makeKeyAndVisible];
[RNSplashScreen show];

The async calls execute fine, but the splash screen doesn't hide. Any help will be appreciated.

[wincod75]

@ShaharyarMaroof Do this simple test... remove [RNSplashScreen show]; from your appdelegate file, rebuild your app and see what happens. I rediscovered this issue after upgrading to RN 61 and thought it was the splash screen not hiding, but I had other errors preventing the splash screen from hiding. Once i removed the [RNSplashScreen show]; and could identify and resolve my console errors, I added [RNSplashScreen show]; back and it works fine.

[povilasDadelo]

@wincod75 have added try catch block in my CDM component. No errors, but SplashScreen is still not hiding.

[wincod75]

@wincod75 have added try catch block in my CDM component. No errors, but SplashScreen is still not hiding.

Getting any errors Xcode? Checked your pods/using pods? Ironically my splash screen was failing to hide today and I ended up back here, but yet again the issue was errors in RN, not this package.

[SurendraVSS]

Dont use this package simply make a splash screen in xcode it will be added no need of this package, this hide method does not work.

[IvanzZ0814]

邮件已收到，马上看

[chwasifjameel]

I think this package has usability only in Android. iOS works better for me without it.

[IvanzZ0814]

邮件已收到，马上看

[elangovansword]

This worked for me in new version

#606 (comment)

[zahid502]

Mentioned here
This worked for me.

[RNSplashScreen show]; return [super application:application didFinishLaunchingWithOptions:launchOptions];

to

BOOL ret = [super application:application didFinishLaunchingWithOptions:launchOptions]; if (ret == YES) { [RNSplashScreen show]; } return ret;

I encountered this issue with:
"react-native": "0.72.4"
"react-native-splash-screen": "^3.3.0"

[IvanzZ0814]

邮件已收到，马上看

[IvanzZ0814]

邮件已收到，马上看