Compatibility with NavigatorIOS

[brentvatne]

As discussed in facebook/react-native#688 there currently is no way to have a component overlay NavigatorIOS from just JavaScript - this would require dipping into Objective C. It seems like some of the options are:

• Add the view as a subview to the UINavigationController view
• Add the view as a subview of the root view

I wasn't able to get this working in my experiments - it still appeared below the navbar. Help is appreciated!

An alternative approach is to just use react-nativate-navbar

[kocyigityunus]

i think we need to add a custom react component written in objective c. and this component should be like this layer by layer

--- a full screen button with changable opacity and color and tap event - we will use this for if that s a popup

--- a view that we will connect to out react component

if you can connect a objective c view class includes RCTBridge to a reactjs base component. than we can use that object from anywhere.

this is solution to add that view to top :

http://stackoverflow.com/questions/6622913/how-to-add-uiview-on-the-top-of-all-views

[brentvatne]

@kocyigityunus - I've tried that approach and couldn't quite get it working, but this comment seems like it adds some nuance to it in a way that would be very helpful for us. I'll give it a try next time I have a free hour!

[kocyigityunus]

i think this must be a problem with TabBarIOS too. didn't tried but thinking.

tried to implement a ModalViewController with RCTBridge. but connecting ModalViewController's view to reactview needs another bundle code like in the appdelegate. i think writing navbar and tabbar as fully react native from 0 is a better idea.

i suppose react team writed popups in fully objective c or they bundled every popup apart from each other and the app's main.

[meetwudi]

I did successfully implemented this before. What I did essentially was using presentViewController method of UIViewController, and setup some modal style or something (Can't remember, though). Then I use RCTBridge to call this method.

You can get the current view controller by using [UIApplication sharedApplication].keyWindow and then get its current view controller.

Because I don't know what specific problem you are facing, so I can't help you with code.

Some code that may help.

WBModal.m

//
//  RCTModal.m
//  ReactNativeWb
//
//  Created by Wu Di on 3/30/15.
//  Copyright (c) 2015 Facebook. All rights reserved.
//

@import UIKit;

#import "WBModal.h"
#import "RCTBridge.h"
#import "RCTEventDispatcher.h"
#import "RCTRootView.h"

@interface WBModal()

@end

@implementation WBModal

@synthesize bridge = _bridge;

- (void)presentModalWithTitle:(NSDictionary*)options {
    RCT_EXPORT(presentModal);

    UIViewController *modalViewController = [[UIViewController alloc] init];
    modalViewController.modalPresentationStyle = UIModalPresentationFullScreen;
    modalViewController.title = options[@"title"];

    dispatch_async(dispatch_get_main_queue(), ^{
        UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
        UIViewController *rootViewController = keyWindow.rootViewController;

        // Init RCTRootView
        NSString *urlString = [NSString stringWithFormat:@"http://localhost:8081/%@", options[@"path"]];
        NSURL *jsCodeLocation = [NSURL URLWithString:urlString];
        RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                moduleName:options[@"registerName"]
                                                        launchOptions:nil];

        [modalViewController setView: rootView];

        [rootViewController presentViewController:modalViewController
                                         animated:YES
                                       completion: nil];
    });
}

@end

[kocyigityunus]

@tjwudi we are not commenting on same problem.

i solved issues on the https://github.com/Kureev/react-native-navbar at : https://github.com/kocyigityunus/react-native-navbar and added an example with ios style navigation and modal.

[brentvatne]

@tjwudi @kocyigityunus - thanks for the ideas! We're very close now, just need to figure out how to properly dispose of the modal UIWindow - if you have any ideas, let me know!

[meetwudi]

@brentvatne I am using event system to emit data from Modal to JS, then just let Modal close itself. :)

[brentvatne]

@tjwudi - I can get it to close but the main application UIWindow doesn't register touches properly afterwards unless I set it to _mainWindow.windowLevel = UIWindowLevelStatusBar :-1:

[brentvatne]

Alright this is fixed in 0.2.0! See comment here