Permalink
Browse files

Opensourcing RCTWrapper

Summary:
RCTWrapper is a library that allows turn any UIView/UIViewController-based widget into React Native component
which will respect layout constrains of native (wrapped) view.
So, you don't need to explicitly specify width and hight in styling.

Take a look at examples to see how to use RCTWrapper.

Reviewed By: mmmulani

Differential Revision: D5868763

fbshipit-source-id: 0a503b42be166d547ca6cbf0829eea9c75a8e364
  • Loading branch information...
shergin authored and facebook-github-bot committed Oct 10, 2017
1 parent aa97c9a commit c0e9936d8e43e949567012eab77ad8f6005397a8
@@ -0,0 +1,11 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface RCTWrapperExampleView : UIView
@end
NS_ASSUME_NONNULL_END
@@ -0,0 +1,55 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import "RCTWrapperExampleView.h"
#import <RCTWrapper/RCTWrapper.h>
@implementation RCTWrapperExampleView {
NSTimer *_timer;
CGSize _intrinsicContentSize;
}
- (instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
self.backgroundColor = [UIColor whiteColor];
_intrinsicContentSize = CGSizeMake(64, 64);
_timer = [NSTimer scheduledTimerWithTimeInterval:1.0
target:self
selector:@selector(tick)
userInfo:nil
repeats:YES];
UITapGestureRecognizer *gestureRecognizer =
[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tick)];
[self addGestureRecognizer:gestureRecognizer];
}
return self;
}
- (void)tick
{
_intrinsicContentSize.width = 32 + arc4random() % 128;
_intrinsicContentSize.height = 32 + arc4random() % 128;
[self invalidateIntrinsicContentSize];
[self.superview setNeedsLayout];
}
- (CGSize)intrinsicContentSize
{
return _intrinsicContentSize;
}
- (CGSize)sizeThatFits:(CGSize)size
{
return CGSizeMake(
MIN(size.width, _intrinsicContentSize.width),
MIN(size.height, _intrinsicContentSize.height)
);
}
@end
RCT_WRAPPER_FOR_VIEW(RCTWrapperExampleView)
@@ -0,0 +1,11 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface RCTWrapperExampleViewController : UIViewController
@end
NS_ASSUME_NONNULL_END
@@ -0,0 +1,17 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import "RCTWrapperExampleViewController.h"
#import <RCTWrapper/RCTWrapper.h>
#import "RCTWrapperExampleView.h"
@implementation RCTWrapperExampleViewController
- (void)loadView {
self.view = [RCTWrapperExampleView new];
}
@end
RCT_WRAPPER_FOR_VIEW_CONTROLLER(RCTWrapperExampleViewController)
@@ -0,0 +1,15 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
@class RCTBridge;
NS_ASSUME_NONNULL_BEGIN
@interface RCTWrapperReactRootViewController : UIViewController
- (instancetype)initWithBridge:(RCTBridge *)bridge;
@end
NS_ASSUME_NONNULL_END
@@ -0,0 +1,42 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import "RCTWrapperReactRootViewController.h"
#import <RCTWrapper/RCTWrapper.h>
#import <React/RCTBridge.h>
#import <React/RCTRootView.h>
#import "RCTWrapperExampleView.h"
@implementation RCTWrapperReactRootViewController {
RCTBridge *_bridge;
}
- (instancetype)initWithBridge:(RCTBridge *)bridge
{
if (self = [super initWithNibName:nil bundle:nil]) {
_bridge = bridge;
}
return self;
}
- (void)loadView
{
RCTRootView *rootView =
[[RCTRootView alloc] initWithBridge:_bridge
moduleName:@"WrapperExample"
initialProperties:@{}];
rootView.backgroundColor = [UIColor whiteColor];
UIActivityIndicatorView *progressIndicatorView =
[[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
[progressIndicatorView startAnimating];
rootView.loadingView = progressIndicatorView;
rootView.sizeFlexibility = RCTRootViewSizeFlexibilityWidthAndHeight;
self.view = rootView;
}
@end
@@ -0,0 +1,13 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
#import <RCTWrapper/RCTWrapperViewManager.h>
NS_ASSUME_NONNULL_BEGIN
@interface RCTWrapperReactRootViewManager : RCTWrapperViewManager
@end
NS_ASSUME_NONNULL_END
@@ -0,0 +1,27 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import "RCTWrapperReactRootViewManager.h"
#import <RCTWrapper/RCTWrapperView.h>
#import <RCTWrapper/RCTWrapperViewControllerHostingView.h>
#import "RCTWrapperReactRootViewController.h"
@implementation RCTWrapperReactRootViewManager
RCT_EXPORT_MODULE()
- (UIView *)view
{
RCTWrapperViewControllerHostingView *contentViewControllerHostingView =
[RCTWrapperViewControllerHostingView new];
contentViewControllerHostingView.contentViewController =
[[RCTWrapperReactRootViewController alloc] initWithBridge:self.bridge];
RCTWrapperView *wrapperView = [super view];
wrapperView.contentView = contentViewControllerHostingView;
return wrapperView;
}
@end
@@ -0,0 +1,61 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
#import <RCTWrapper/RCTWrapperView.h>
#import <RCTWrapper/RCTWrapperViewControllerHostingView.h>
#import <RCTWrapper/RCTWrapperViewManager.h>
// Umbrella header with macros
// RCT_WRAPPER_FOR_VIEW
#define RCT_WRAPPER_FOR_VIEW(ClassName) \
\
NS_ASSUME_NONNULL_BEGIN \
\
@interface ClassName##Manager : RCTWrapperViewManager \
\
@end \
\
NS_ASSUME_NONNULL_END \
\
@implementation ClassName##Manager \
\
RCT_EXPORT_MODULE() \
\
- (UIView *)view \
{ \
RCTWrapperView *wrapperView = [super view]; \
wrapperView.contentView = [ClassName new]; \
return wrapperView; \
} \
\
@end
// RCT_WRAPPER_FOR_VIEW_CONTROLLER
#define RCT_WRAPPER_FOR_VIEW_CONTROLLER(ClassName) \
\
NS_ASSUME_NONNULL_BEGIN \
\
@interface ClassName##Manager : RCTWrapperViewManager \
\
@end \
\
NS_ASSUME_NONNULL_END \
\
@implementation ClassName##Manager \
\
RCT_EXPORT_MODULE() \
\
- (UIView *)view \
{ \
RCTWrapperViewControllerHostingView *contentViewControllerHostingView = \
[RCTWrapperViewControllerHostingView new]; \
contentViewControllerHostingView.contentViewController = \
[[ClassName alloc] initWithNibName:nil bundle:nil]; \
RCTWrapperView *wrapperView = [super view]; \
wrapperView.contentView = contentViewControllerHostingView; \
return wrapperView; \
} \
\
@end
@@ -0,0 +1,17 @@
// Copyright 2004-present Facebook. All Rights Reserved.
#import <UIKit/UIKit.h>
#import <React/RCTShadowView.h>
@class RCTBridge;
NS_ASSUME_NONNULL_BEGIN
@interface RCTWrapperShadowView : RCTShadowView
- (instancetype)initWithBridge:(RCTBridge *)bridge NS_DESIGNATED_INITIALIZER;
@end
NS_ASSUME_NONNULL_END
Oops, something went wrong.

0 comments on commit c0e9936

Please sign in to comment.