【React Native】react-native-navigation導入 for iOS

1.インストール

"react-native link"を行うと、ネイティブに関わる修正を自動行う
しかし、一部手動で設定する必要がある。
自動で設定される手順:＊自動＊
手動で設定する手順　:＊手動＊
＊自動で設定される手順もバージョンによってされない可能性があるので、
設定されているか確認する必要がある。

npm i -save react-native-navigation@latest
react-native link

2.ライブラリの追加＊自動＊

下記のライブラリファイルをドラック&ドロップでxcodeに追加
ライブラリファイル：ReactNativeNavigation.xcodeproj
ファイルパス　　　：./node_modules/react-native-navigation/ios/ReactNativeNavigation.xcodeproj

3.ライブラリをリンクする(表現が適切か不明)＊自動＊

手順2.で追加したライブラリをxCode上の下記の追加先項目にドラック&ドロップで追加
ファイル　：libReactNativeNavigation.aを下記の項目に追加
追加先項目：Libraries > Add files to [project name] > Build Phases tab (タブの右のほう). > In the Link Binary With Libraries

4.下記のパスを追加＊手動＊

パス：$(SRCROOT)/../node_modules/react-native-navigation/ios

5."AppDelegate.m"の編集＊手動＊

この設定を行うと、起動時に読み込まれるファイルが、
'index.js'から'index.ios.js'に変わる
編集するファイル：ios/reactNativeApp/AppDelegate.m
下記のソースをで上書く

#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>

// **********************************************
// *** DON'T MISS: THE NEXT LINE IS IMPORTANT ***
// **********************************************
#import "RCCManager.h"

// IMPORTANT: if you're getting an Xcode error that RCCManager.h isn't found, you've probably ran "npm install"
// with npm ver 2. You'll need to "npm install" with npm 3 (see https://github.com/wix/react-native-navigation/issues/1)

#import <React/RCTRootView.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  NSURL *jsCodeLocation;
#ifdef DEBUG
//  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
#else
   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif


  // **********************************************
  // *** DON'T MISS: THIS IS HOW WE BOOTSTRAP *****
  // **********************************************
  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  self.window.backgroundColor = [UIColor whiteColor];
  [[RCCManager sharedInstance] initBridgeWithBundleURL:jsCodeLocation launchOptions:launchOptions];

  /*
  // original RN bootstrap - remove this part
  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"example"
                                               initialProperties:nil
                                                   launchOptions:launchOptions];
  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
  UIViewController *rootViewController = [UIViewController new];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.window makeKeyAndVisible];
  */


  return YES;
}

@end

6.初期読み込みファイル追加

index.ios.jsを追加

参考

ドキュメント

スクリーンショット