Modal segue support for data entry views

[mcgsoftware]

A common iOS pattern is present modal segues for editing data in the app. Note: A good example of this is the health app, click on 'medical ID' tab, then tap on 'Edit' button in navbar, and the behavior is the new view animates into existence and covers over any existing navbar, tabbar and view currently displayed. I can see a modal segue in the facebook groups app, when Clicking on the 'Groups' tab, the click on the 'create' navbar button, which makes me think it may already be in this framework somewhere, and if so, is there a good example or documentation on how to perform this common use case?

I was hoping for see a Navigation method for this, something like 'modal()' since there is a push() method

The example in UIExplorer where the view 'Navigator' uses 'configureScene' to float a view is sort of similar, but it doesn't wallpaper over the existing navbar, tabbar, etc.

[jordwalke]

Check out the FB Mobile Ads Manager app which has this same experience. You can accomplish it via nested navigators. The outermost one is the full modal that typically only has one scene on its stack (the scene with the tab bar), but occasionally that outer navigator will push on another scenes which necessarily covers the inner navigator (the one with the tab bar).

[mcgsoftware]

An example ad manager app example sounds great, where can I find the code for it?

[sophiebits]

The Ads Manager app isn't open source.

[ericvicenti]

@mcgsoftware, I'm not sure what you mean by "wallpaper over the existing navbar, tabbar, etc". Could you post a screenshot or video of what you want to accomplish?

All of the modals in the Ads Manager app (in the app store) are built with the Navigator component. The UIExplorer sample is very similar:

https://github.com/facebook/react-native/blob/master/Examples/UIExplorer/Navigator/NavigatorExample.js

If you have specific questions about how to do things with Navigator, please file an issue an cc me