如何在React Native中呈现本机UIViewController？(不能只使用UIView)

Question

我正在尝试在我的React Native应用程序中使用ABNewPersonViewController.这是它在Objective-C中的使用方式:

ABNewPersonViewController *picker = [[ABNewPersonViewController alloc] init];
picker.newPersonViewDelegate = self;

UINavigationController *navigation = [[UINavigationController alloc] initWithRootViewController:picker];
[self presentViewController:navigation animated:NO completion:nil];

我如何在React Native中执行此操作？我不能写一个桥接的UI组件,因为它是一个UIViewController,而不是UIView.

请不要告诉我重新实现它

Answer 1

这是最终为我工作的东西.

CreateContact.h:

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
#import <AddressBook/AddressBook.h>
#import <AddressBookUI/AddressBookUI.h>
#import "RCTBridgeModule.h"

@interface CreateContact : NSObject <ABNewPersonViewControllerDelegate, RCTBridgeModule>

@end

CreateContact.m:

#import "CreateContact.h"
#import "AppDelegate.h"

@implementation CreateContact

RCT_EXPORT_MODULE(CreateContact);


RCT_EXPORT_METHOD(presentContact) {

    dispatch_async(dispatch_get_main_queue(), ^{
        ABNewPersonViewController *picker = [[ABNewPersonViewController alloc] init];
        picker.newPersonViewDelegate = self;
        UINavigationController* contactNavigator = [[UINavigationController alloc] initWithRootViewController:picker];
        AppDelegate *delegate = (AppDelegate *)[[UIApplication sharedApplication] delegate];
        [delegate.window.rootViewController presentViewController:contactNavigator animated:NO completion:nil];
    });
}

- (void)newPersonViewController:(ABNewPersonViewController *)newPersonViewController didCompleteWithNewPerson:(ABRecordRef)person
{
    [newPersonViewController dismissViewControllerAnimated:YES completion:nil];
}
@end

本教程有更多详细信息:http://moduscreate.com/leverage-existing-ios-views-react-native-app/

我将更新,因为我实现了将信息传递回RN的最佳方式.

Answer 2

你想实现一个桥接的 UI 组件，它挂载一个空的 UIView 并主要负责呈现你的 UIViewController。这种技术最简单的例子是在 RCTModalHostView 中；查看源代码。

值得注意的是，React Native 在 UIView 上定义了一个类别，该类别添加了一个名为的属性，该属性reactViewController会爬升视图层次结构以找到最近的 UIViewController。使用这个 UIViewController 来展示你的自定义视图控制器：

- (void)didMoveToWindow
{
  [super didMoveToWindow];

  if (!_isPresented && self.window) {
    [self.reactViewController presentViewController:_customViewController
                                           animated:NO
                                         completion:nil];
    _isPresented = YES;
  }
}