status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-01-09 09:12:02 +00:00
Code Issues Projects Releases Wiki Activity
react-native/docs/NavigatorComparison.md
Tal Kol d7835e26da Update NavigatorComparison.md 
Summary:Thanks for submitting a pull request! Please provide enough information so that others can review your pull request:

(You can skip this if you're fixing a typo or adding an app to the Showcase.)

Explain the **motivation** for making this change. What existing problem does the pull request solve?

Prefer **small pull requests**. These are much easier to review and more likely to get merged. Make sure the PR does only one thing, otherwise please split it.

**Test plan (required)**

Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI.

Make sure tests pass on both Travis and Circle CI.

**Code formatting**

Look around. Match the style of the rest of the codebase. See also the simple [style guide](https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md#style-guide).

"nobody who uses this has stepped up to take ownership for it yet" - react-native-navigation is a rewrite which is a fully featured
Closes https://github.com/facebook/react-native/pull/6888

Differential Revision: D3161511

fb-gh-sync-id: b3e0c1f6138fb40561cb542d8905bcc478f781cb
fbshipit-source-id: b3e0c1f6138fb40561cb542d8905bcc478f781cb
2016-04-10 11:51:18 -07:00

2.8 KiB
Raw Blame History

id title layout category permalink next
navigator-comparison Navigator Comparison docs Guides docs/navigator-comparison.html known-issues

The differences between Navigator and NavigatorIOS are a common source of confusion for newcomers.

Both Navigator and NavigatorIOS are components that allow you to manage the navigation in your app between various "scenes" (another word for screens). They manage a route stack and allow you to pop, push, and replace states. In this way, they are similar to the html5 history API. The primary distinction between the two is that NavigatorIOS leverages the iOS UINavigationController class, and Navigator re-implements that functionality entirely in JavaScript as a React component. A corollary of this is that Navigator will be compatible with Android and iOS, whereas NavigatorIOS will only work on the one platform. Below is an itemized list of differences between the two.

Navigator

  • Extensive API makes it completely customizable from JavaScript.
  • Under active development from the React Native team.
  • Written in JavaScript.
  • Works on iOS and Android.
  • Includes a simple navigation bar component similar to the default NavigatorIOS bar: Navigator.NavigationBar, and another with breadcrumbs called Navigator.BreadcrumbNavigationBar. See the UIExplorer demo to try them out and see how to use them.
    • Currently animations are good and improving, but they are still less refined than Apple's, which you get from NavigatorIOS.
  • You can provide your own navigation bar by passing it through the navigationBar prop.

NavigatorIOS

  • Small, limited API makes it much less customizable than Navigator in its current form.
  • Development belongs to open-source community - not used by the React Native team on their apps.
    • A result of this is that there is currently a backlog of unresolved bugs, nobody who uses this has stepped up to take ownership for it yet.
    • You may find an alternative in the community project react-native-navigation which replaces NavigatorIOS.
  • Wraps UIKit, so it works exactly the same as it would on another native app. Lives in Objective-C and JavaScript.
    • Consequently, you get the animations and behavior that Apple has developed.
  • iOS only.
  • Includes a navigation bar by default; this navigation bar is not a React Native view component and the style can only be slightly modified.

For most non-trivial apps, you will want to use Navigator - it won't be long before you run into issues when trying to do anything complex with NavigatorIOS.