react-native-navigation的迁移库
Roman Kozlov 55cd3f51a7 V2 async (#2163) преди 7 години
.github update remx преди 7 години
AndroidE2E V2 overlay skeleton (#2097) (#2098) преди 7 години
docs Update installation-android.md (#2032) преди 7 години
e2e V2 nested (#2194) преди 7 години
integration add redux integration tests \#1649 преди 7 години
lib V2 async (#2163) преди 7 години
playground V2 async (#2163) преди 7 години
scripts fix travis deploy преди 7 години
.gitignore update gitignore преди 8 години
.npmignore update npmignore преди 7 години
.travis.yml fix travis deploy преди 7 години
.watchmanconfig deleted old redux example, using yarn, update package.json to alpha преди 8 години
LICENSE Update LICENSE преди 7 години
README.md V2 async (#2163) преди 7 години
ReactNativeNavigation.podspec update podspec преди 7 години
index.android.js support react-native start преди 7 години
index.ios.js support react-native start преди 7 години
jsconfig.json app lifecycle преди 7 години
package-lock.json update deps преди 7 години
package.json update deps преди 7 години
wallaby.js fix \#919 преди 7 години

README.md

Build Status Join us on Discord

React Native Navigation v2 (WIP)

We are rebuilding react-native-navigation

Why Rebuild react-native-navigation?

A New & Improved Core Architecture

react-native-navigation has a few issues which are unsolvable in its current architecture. These issues stem from the same problem: you cannot specify on which screen you wish to make an action. Whenever you want to push a screen, show a modal or any other action, the action defaults to originate from your current screen. In most cases this is fine, but becoms problematic in specific edge cases. For example:

  • What if you want to update your navbar icons and the user pops the screen? Your icons might update on the wrong screen.
  • What if you want to push a screen as a result of a redux action?

There are ways to solve some of these problems in v1 but they are not straightforward. We want to change that.

New API

To solve this problem in v2, every screen receives its containerId as a prop. Whenever you want to perform an action from that screen you need to pass the containerId to the function:

Navigator.pop(this.props.containerId)

Built for Contributors

Currently, it requires a lot of work to accept pull requests. We need to manually make sure that everything works before we approve them because v1 is not thoroughly tested.
v2 is written with contributors in mind from day one.

Written In TDD

v2 is written in Test Driven Development. We have a test for every feature including features that are not implemented yet. This makes accepting pull requests extremely easy: If our tests pass, your pull request is accepted.

v2 Roadmap

Current Priorities

1) buttons in Android 2) showOverlay in iOS 3) showOverlay in Android 4) async commands 5) currentTab 6) change navigationOptions to be nested 7) topTabs in both platforms, with API implications

Top API

Top API iOS Android
setRoot
registerContainer
container
sideMenu
tabs
customViewController Contribute Contribute
splitView Contribute Contribute

Screen API

Screen API iOS Android
push
pop
popToRoot
resetTo
showModal
dismissModal
showOverlay Contribute WIP @cool04ek
dismissOverlay Contribute WIP @cool04ek
customTransition Contribute
Screen Visibility
async commands (await push) Contribute

Navigation Options

topBar iOS Android contributors
title Wix
textColor Wix
textFontSize Wix
textFontFamily Wix
backgroundColor Wix
buttonColor Contribute Wix
hidden Wix
hideOnScroll Contribute Wix
translucent Contribute Wix
transparent WIP @bogobogo Contribute
noBorder Contribute @gtchance
drawUnder WIP @gran33 Contribute
blur Contribute @gtchance
custom WIP @gran33 Contribute
subtitleColor Contribute Contribute
subtitleFontFamily Contribute Contribute
largeTitle (iOS 11) /iOS Specific
tabBar iOS Android contributors
drawUnder WIP @gran33 Contribute
hidden Contribute @gtchance
tabBadge Contribute Wix
currentTab by Index Contribute Contribute
currentTab by cointainerId Contribute Contribute
buttons iOS Android contributors
id Contribute @Johan-dutoit
testID Contribute @Johan-dutoit
color Contribute @Johan-dutoit
icon Contribute @Johan-dutoit
disableTint Contribute @Johan-dutoit
fontSize Contribute @Johan-dutoit
fontWeight Contribute @Johan-dutoit
fontWeight Contribute @Johan-dutoit
statusBar iOS Android contributors
textColorScheme in development / iOS specific
textColorSchemeSingleScreen in development / iOS specific
blur Contribute @gtchance
hideWithTopBar Contribute @gtchance
hidden Contribute WIX
other iOS Android contributors
screenBackgroundColor Contribute Wix
orientation Contribute Wix
disabledBackGesture WIP @gran33 / iOS specific
screenBackgroundImageName Contribute Contribute
rootBackgroundImageName Contribute Contribute
sideMenuVisible Contribute Contribute

v1 vs v2 Feature Comparison

v2 currently supports most of react-native-navigation’s basic functionality but it is still behind v1. Here is the full comparison of features between v1 and v2 (will be updated regularly):

Top Level API

API v1 v2
startTabBasedApp
startSinglePageApp
registerScreen
drawer

Screen API

 API              v1 v2 iOS v2 Android
push
pop
showModal
popToRoot
resetTo
dismissModal
dismissAllModals
showContextualMenu / Android specific Contribute
dismissContextualMenu / Androic specific Contribute
showFab / Android specific Contribute
dismissFab / Android specific Contribute
showSnackBar / Android specific Contribute
dismissSnackBar / Android specific Contribute
showLightBox Contribute Contribute
dismissLightBox Contribute Contribute
handleDeepLink Contribute Contribute
Screen Visibility

Styles

Note: v1 properties with names beginning with ‘navBar’ are replaced in v2 with properties beginning with ‘topBar’ to avoid confusion with the Android native bottom nav bar.

v1 v2 iOS v2 Android Contributors
topBarTextColor Wix
topBarTextFontSize Wix
topBarTextFontFamily Wix
topBarBackgroundColor Wix
topBarButtonColor Contribute Wix
topBarHidden Wix
topBarHideOnScroll Contribute Wix
topBarTranslucent Contribute Wix
topBarTransparent WIP @bogobogo Contribute
topBarNoBorder Contribute @gtchance
drawUnderTabBar WIP @gran33 Contribute
drawUnderTopBar WIP @gran33 Contribute
statusBarBlur Contribute @gtchance
topBarBlur Contribute @gtchance
tabBarHidden Contribute @gtchance
statusBarTextColorScheme in development / iOS specific
statusBarTextColorSchemeSingleScreen in development / iOS specific
topBarSubtitleColor Contribute Contribute
topBarSubtitleFontFamily Contribute Contribute
screenBackgroundColor Contribute Wix
orientation Contribute Wix
statusBarHideWithTopBar Contribute @gtchance
statusBarHidden Contribute WIX
disabledBackGesture WIP @gran33 / iOS specific
screenBackgroundImageName Contribute Contribute
rootBackgroundImageName Contribute Contribute
setButtons Contribute @Johan-dutoit
title Wix
toggleDrawer Contribute Contribute
setTabBadge Contribute Wix
switchToTab Contribute
topBarCustomView WIP @gran33 Contribute
customTransition(shared element) :x: WIP @bogobogo Contribute
splitViewScreen :x: Contribute Contribute

Element transitions, adding buttons and styles are not yet implemented. Contribute