Me
I WANT TO REDESIGN SOME SCREENS IN MY APP,
CAN WE DO THAT IN REACT-NATIVE ?
MPPubViewController *pubViewController = [[MPPubViewController alloc]
initWithInPub:dictionary
andWithBar:bar
withRewardId:nil];
[self.navigationController pushViewController:pubViewController animated:YES];
pod 'React', :path => '../node_modules/react-native', :subspecs => [
'Core',
'RCTText',
'RCTNetwork',
'RCTWebSocket', # needed for debugging
]
import { AppRegistry } from 'react-native';
import InPubPage from './src/page/InPubPage';
AppRegistry.registerComponent('InPubPage', () => InPubPage);
Create a controller that contains the magic class: RCTRootView
#ifdef DEBUG
NSURL *jsCodeLocation =
[NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios"];
#else
NSURL *jsCodeLocation =
[[NSBundle mainBundle] URLForResource:@"index.ios" withExtension:@"bundle"];
#endif
self.rootView =
[[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"InPubPage"
launchOptions:nil ];
self.view = self.rootView;
return self;
- (void) displayModal
-(void) hideModal
{
[self.view.layer setMasksToBounds:YES];
[self.view.layer setBackgroundColor:[UIColor colorWithWhite:1 alpha:0].CGColor];
backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0,
[[UIScreen mainScreen] bounds].size.width,
[[UIScreen mainScreen] bounds].size.height)];
[backgroundView addSubview:self.view];
CGRect targetFrame = CGRectMake(0, 0,
self.targetView.view.frame.size.width,
self.targetView.view.frame.size.height);
[self.view setFrame:targetFrame];
[self.targetView addChildViewController:self];
[self.targetView.view addSubview:backgroundView];
[self didMoveToParentViewController:self.targetView];
}
{
[self willMoveToParentViewController:nil];
[backgroundView removeFromSuperview];
[self removeFromParentViewController];
}
@implementation NavigationManager
+ (id) sharedInstance
{
...
}
// ...
- (void) goToInPubPage
{
self.inPubPageModal = [[RNInPubPageController alloc]
init:[UIApplication sharedApplication].keyWindow.rootViewController];
[self.inPubPageModal displayModal];
}
- (void) exitInPubPage
{
[self.inPubPageModal hideModal];
}
// MPPubViewController *pubViewController = [[MPPubViewController alloc]
// initWithInPub:dictionary
// andWithBar:bar
// withRewardId:nil];
// [self.navigationController pushViewController:pubViewController animated:YES];
// Enter React-Native sub-app
[[MPNavigationManager sharedInstance] goToInPubPage];
self.rootView =
[[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"InPubPage"
initialProperties:@{
@"bar" : self.bar
}
launchOptions:nil ];
Native
#import "NativeNavigation.h"
#import "NavigationManager.h"
@implementation NativeNatigation
RCT_EXPORT_MODULE();
RCT_EXPORT_METHOD(exitInPubPage) {
dispatch_async(dispatch_get_main_queue(), ^{
[[MPNavigationManager sharedInstance] exitInPubPage];
});
}
import { NativeModules } from 'react-native';
export const NativeNavigation = NativeModules.NativeNavigation;
React-Native
import { NativeNavigation } from '../nativeNavigation';
// ...
<TouchableOpacity onPress={NativeNavigation.exitInPubPage}>
Back
</TouchableOpacity>