Come posso presentare un UIViewController nativo in React Native? (Non è possibile utilizzare solo un UIView)

Question

Sto provando ad usare ABNewPersonViewController nella mia app React Native. Questo è il modo in cui è utilizzato in Objective-C:

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

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

Come farei questo in React Native? Non riesco a scrivere un componente UI a ponte poiché è un UIViewController, non un UIView.

Per favore non mi dica di reimplementare lo

Answer 1

si desidera implementare un componente dell'interfaccia utente ponte che monta un UIView vuoto ed è responsabile in primo luogo per presentare la vostra UIViewController. L'esempio più semplice di questa tecnica è in RCTModalHostView; check out the source code.

In particolare, React Native definisce una categoria su UIView che aggiunge una proprietà denominata reactViewController che scala la gerarchia della vista per trovare il UIViewController più vicino. Usa questo UIViewController per presentare il tuo controller di visualizzazione personalizzato:

- (void)didMoveToWindow 
{ 
    [super didMoveToWindow]; 

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

Answer 2

Ecco cosa ha funzionato per me.

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 

Questo tutorial è più in dettaglio: http://moduscreate.com/leverage-existing-ios-views-react-native-app/

io aggiornare come a implementare il modo migliore per comunicare le informazioni torna a RN.