HwangTaehyun / react-native-lottie-splash-screen

⚡ Lottie splash screen for your react native app!
MIT License
222 stars 62 forks source link

How to configure UIView for Lottie Splash on AppDelegate.mm RN v0.71 #63

Closed codeOlam closed 1 year ago

codeOlam commented 1 year ago

RN v0.71 react-native-splash-screen: v1.0.1 Platform: IOS

@HwangTaehyun please can you help guide me on how to configure RNSplashScreen on AppDelegate.mm for ios?

GoktuqCan commented 1 year ago

I'm having issues too. Splash screen doesn't seem to be mounted at all. It was working perfectly before RN 0.71 update.

codeOlam commented 1 year ago

Yes. I have been using it for me recent applications before v0.71, I tried looking for a work around. I couldn't get it to work yet.

HwangTaehyun commented 1 year ago

rootview is gone to the RCTAppDelegate.mm

We should find some way to get rootview from the super class RCTAppDelegate of AppDelegate! @codeOlam @GoktuqCan

codeOlam commented 1 year ago

Thank you @HwangTaehyun. I will look toward this direction

madmeatballs commented 1 year ago

UPDATE:

react-native version 0.71.1

I managed to make it work following some tips from this issue thread https://github.com/facebook/react-native/issues/35937

in your:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

add this code: (your setup may vary but here is how mine worked out, put you own splash screen setup inside the success condition, then return 'success' after the condition)

  self.moduleName = @"YourAppName";
  // You can add your custom initial props in the dictionary below.
  // They will be passed down to the ViewController used by React Native.
  self.initialProps = @{};

   BOOL success = [super application:application didFinishLaunchingWithOptions:launchOptions];
    if (success) {
    // Modify as needed to match the main color of your splash.
    UIView *rootView = self.window.rootViewController.view;

    //set rootView background color
    rootView.backgroundColor = [UIColor colorWithRed: 1.00 green: 0.94 blue: 0.94 alpha: 1.00]; // change backgroundColor

    Dynamic *t = [Dynamic new];
    UIView *animationUIView = (UIView *)[t createAnimationViewWithRootView:rootView lottieName:@"logo_animated"]; // change lottieName to your lottie files name

    //instead of rootView, create a full screen UIView called animationContainerView with the same background color as the rootView
    UIView *animationContainerView = [[UIView alloc] initWithFrame:rootView.frame];
    animationContainerView.backgroundColor = [UIColor colorWithRed: 1.00 green: 0.94 blue: 0.94 alpha: 1.00]; // change backgroundColor

    //add animationUIView to animationContainerView
    [animationContainerView addSubview:animationUIView];

    //register animationContainerView to RNSplashScreen
    [RNSplashScreen showLottieSplash:animationContainerView inRootView:rootView];

    // casting UIView type to AnimationView type
    AnimationView *animationView = (AnimationView *) animationUIView;

    // play
    [t playWithAnimationView:animationView];

    // If you want the animation layout to be forced to remove when hide is called, use this code
    [RNSplashScreen setAnimationFinished:true];

    }

   return success;

I hope this will help you guys.

ElSeniorMikael commented 1 year ago

Thanks @madmeatballs your solution worked for me, we just need to be sure that is the LAST action inside of => - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

Good job for your solution and thanks again

HwangTaehyun commented 1 year ago

@madmeatballs Thank you for your hard work! If possible, could you make some PR to rn v0.71?

codeOlam commented 1 year ago

Super Awesome @madmeatballs, thank you. I just got back to my project and tried out your solution here. worked great for me, only that i have to comment out self.initialProps = @{};, remember my version is RNv0.71.

Thank you for taking out time to do this @madmeatballs

madmeatballs commented 1 year ago

@madmeatballs Thank you for your hard work! If possible, could you make some PR to rn v0.71?

Sure, will make a PR. 👍 Glad this helped.