React-native-navigation: How to Integrate RNN into a existing native app?

Created on 17 Jan 2018  路  4Comments  路  Source: wix/react-native-navigation

Issue Description

Hi, I have some screens developed in react native environment and base on this library(RNN), and I want to integrate this RN app into a existing native app for reuse

It could like: user click on a button in native app then present RN app

I have read the source code, I found in RCCManagerModule it will perform
method (performSetRootController: animationType: globalProps:) to change the appdelegate.window.rootViewController

appDelegate.window.rootViewController = controller;
[appDelegate.window makeKeyAndVisible];

so it will change the native app's rootVC

Is there some other method to delay launch RN app ?like launch RN when click on button ?

Steps to Reproduce / Code Snippets / Screenshots

I have some attempt like run the launch code in a viewcontroller like below, and it also work, and the RN app will cover the native app

    - (void)viewDidLoad {
          [super viewDidLoad];
      // this use to write in AppDelegate.m
          NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
          [[RCCManager sharedInstance] initBridgeWithBundleURL:jsCodeLocation launchOptions:nil];
    }

So I thought if there some method can launch RN by click, and it not wok, and error is "Could not connect to development server"
```

  • (IBAction)junmToRN:(UIButton *)sender {
      NSURL *jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
      [[RCCManager sharedInstance] initBridgeWithBundleURL:jsCodeLocation launchOptions:nil];
}

```
image


Environment

  • React Native Navigation version: 1.1.136
  • React Native version: 0.42.0
  • Platform(s) (iOS, Android, or both?): both
  • Device info (Simulator/Device? OS version? Debug/Release?): FILL THIS OUT

All 4 comments

Hey there, RNN doesn't support brown field apps. We also don't have any plans at the moment to add such support.

If I am not wrong React Native Documentation says otherwise.

If you'd like to achieve a native look and feel on both iOS and Android, or you're integrating React Native into an app that already manages navigation natively, the following libraries provide native navigation on both platforms: native-navigation, react-native-navigation.

If RNN does not support brownfield app, Is there any library that does support and being active maintained?

Although @DanielZlotin has mentioned that support will be provided in v2 https://github.com/wix/react-native-navigation/issues/1234#event-107764936

Take a look right here: https://github.com/anhtuank7c/scooter-baby
I just done wix v2 with existing iOS (Swift) project only.

Please clearly state this on your website! This is very misleading - I also think that having brownfield as an option would make more sense - since you are more native

Was this page helpful?
0 / 5 - 0 ratings