react-native-navigation ios - push UIViewController to navigation stack

Question

I am building a navigation stack consisting of both native iOS views and react-native screens. But when I push the native iOS view, the view layout is not coming out as designed in storyboard. I am using autolayout in Xcode for the native views.

ICNativeViewManager.h
---------------------
#import <React/RCTViewManager.h>

@interface ICNativeViewManager : RCTViewManager

@end

ICNativeViewManager.m
---------------------
#import <React/RCTViewManager.h>
#import <React/RCTView.h>

#import "ICNativeViewManager.h"

@implementation ICNativeViewManager

UIViewController *vc;

RCT_EXPORT_MODULE()

-(UIView *)view
{
  if (vc == nil)
  {
    UIStoryboard *storyboard = [UIStoryboard storyboardWithName:@"ICNativeUI" bundle:nil];
    vc = [storyboard instantiateInitialViewController];
  }
  return vc.view;
}

RCT_EXPORT_VIEW_PROPERTY(labelText, NSString)

@end

Design in Xcode:

View Design in Storyboard

What is shown in Simulator:

View shown in Simulator

Answer 1

1. You should not cache output of -view method, always return new view with all new dependencies, for instance view controller.
2. You should use constraints to layout your view, since ReactNative through mounting process send methods that change frame of your view. Without constraints layout may be broken.
3. For calculate frame of your view React Native use YogaLayout (old CSSLayout), make sure it calculate right size of your view. If not implement -shadowView method of ViewManager and return RCTShadowView instance with right value of width and height property.

Answer 2

I have managed to fix the layout issue using a container view with constraints. I still have problem receiving callbacks on tapping the button.

-(UIView *)view
{
  UIView *parentView = [ICNativeView new];
  parentView.translatesAutoresizingMaskIntoConstraints = NO;
  UIStoryboard *storyboard = [UIStoryboard storyboardWithName:@"ICNativeUI" bundle:nil];
  self.viewController = [storyboard instantiateInitialViewController];
  UIView *nativeView = self.viewController.view;
  [parentView addSubview:nativeView];
  [parentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-0-[nativeView]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(nativeView)]];
  [parentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[nativeView]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(nativeView)]];
  return parentView;
}

Layout Fixed