|
6 jaren geleden | |
---|---|---|
.. | ||
_images | 6 jaren geleden | |
api | 6 jaren geleden | |
docs | 6 jaren geleden | |
templates | 6 jaren geleden | |
.nojekyll | 7 jaren geleden | |
README.md | 6 jaren geleden | |
_sidebar.md | 6 jaren geleden | |
index.html | 6 jaren geleden | |
sw.js | 7 jaren geleden |
We are rebuilding react-native-navigation.
As we are in stage alpha, expect breaking API changes or use a specific version (for example “2.0.1234”)
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 becomes problematic in specific edge cases. For example:
There are ways to solve some of these problems in v1 but they are not straightforward. We want to change that.
To solve this problem in v2, every screen receives its componentId
as a prop. Whenever you want to perform an action from that screen you need to pass the componentId
to the function:
Navigator.pop(this.props.componentId)
Another big architectural change is that now you can compose arbitrary native layout hierarchies, and assign a custom id
to each and control them individually.
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.
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.
1) buttons in Android 2) showOverlay in iOS 3) showOverlay in Android 4) async commands 5) currentTab 6) change Options to be nested 7) topTabs in both platforms, with API implications
Top API | iOS | Android |
---|---|---|
setRoot | ✅ | ✅ |
registerContainer | ✅ | ✅ |
container | ✅ | ✅ |
sideMenu | ✅ | ✅ |
tabs | ✅ | ✅ |
customViewController | Contribute | Contribute |
splitView | Contribute | Contribute |
Screen API | iOS | Android |
---|---|---|
push | ✅ | ✅ |
pop | ✅ | ✅ |
popToRoot | ✅ | ✅ |
resetTo | ✅ | ✅ |
showModal | ✅ | ✅ |
dismissModal | ✅ | ✅ |
showOverlay | ✅ | ✅ |
dismissOverlay | ✅ | ✅ |
customTransition | ✅ | Contribute |
Screen Visibility | ✅ | ✅ |
async commands (await push) | ✅ | ✅ |
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 | ✅ | Contribute | |
noBorder | ✅ | Contribute | @gtchance |
drawUnder | ✅ | Contribute | |
blur | ✅ | Contribute | @gtchance |
custom | WIP @gran33 | Contribute | |
subtitleColor | Contribute | Contribute | |
subtitleFontFamily | Contribute | Contribute | |
largeTitle (iOS 11) | ✅ | /iOS Specific |
tabBar | iOS | Android | contributors |
---|---|---|---|
drawUnder | ✅ | Contribute | |
hidden | ✅ | ✅ | @gtchance |
tabBadge | ✅ | Contribute | Wix |
currentTab by Index | ✅ | ✅ | Wix |
currentTab by cointainerId | Contribute | ✅ | Wix |
buttons | iOS | Android | contributors |
---|---|---|---|
id | ✅ | @Johan-dutoit | @Johan-dutoit |
testID | ✅ | Contribute | @Johan-dutoit |
color | ✅ | @Johan-dutoit | @Johan-dutoit |
icon | ✅ | @Johan-dutoit | @Johan-dutoit |
disableTint | ✅ | @Johan-dutoit | @Johan-dutoit |
fontSize | ✅ | @Johan-dutoit | @Johan-dutoit |
fontWeight | ✅ | Contribute | Contribute |
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 | ✅ | / iOS specific | |
screenBackgroundImageName | ✅ | Contribute | |
rootBackgroundImageName | ✅ | Contribute | |
sideMenuVisible | ✅ | Contribute |
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):
API | v1 | v2 |
---|---|---|
startTabBasedApp | ✅ | ✅ |
startSinglePageApp | ✅ | ✅ |
registerScreen | ✅ | ✅ |
drawer | ✅ | ✅ |
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 | ✅ | ✅ | ✅ |
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 | ✅ | ✅ | Contribute | |
drawUnderTopBar | ✅ | ✅ | 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 | ✅ | ✅ | / iOS specific | |
screenBackgroundImageName | ✅ | ✅ | Contribute | |
rootBackgroundImageName | ✅ | ✅ | Contribute | |
setButtons | ✅ | ✅ | Contribute | @Johan-dutoit |
title | ✅ | ✅ | ✅ | Wix |
toggleDrawer | ✅ | ✅ | 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