Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adds support for headerLayoutPreset and headerBackTitleEnabled #3256

Merged
merged 1 commit into from
Sep 13, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions Example/Example.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ const Example = () => (
<Scene key="echo" back clone component={EchoView} getTitle={({ navigation }) => navigation.state.key} />
<Scene key="launch" component={Launch} title="Launch" initial type={ActionConst.RESET} />

<Stack key="customNavBar" hideTabBar titleStyle={{ alignSelf: 'center' }}>
<Stack key="customNavBar" hideTabBar headerLayoutPreset='center'>
<Scene key="customNavBar1" title="CustomNavBar 1" navBar={CustomNavBar} component={CustomNavBarView} back />
<Scene key="customNavBar2" title="CustomNavBar 2" navBar={CustomNavBar} component={CustomNavBarView} back />
<Scene key="customNavBar3" title="Another CustomNavBar" navBar={CustomNavBar2} component={CustomNavBarView} back />
Expand Down Expand Up @@ -130,7 +130,7 @@ const Example = () => (
<Scene key="demo_lightbox" component={DemoLightbox} />
</Lightbox>
<Scene key="error" component={ErrorModal} />
<Stack key="login" path="login/:data" titleStyle={{ alignSelf: 'center' }}>
<Stack key="login" headerLayoutPreset='center' path="login/:data" titleStyle={{ alignSelf: 'center' }}>
<Scene key="loginModal" component={Login} title="Login" onExit={() => console.log('Login: onExit')} leftTitle="Cancel" onLeft={Actions.pop} />
<Scene key="loginModal2" component={Login2} title="Login2" onEnter={() => console.log('Login2: onEnter') } backTitle="Back" panHandlers={null} duration={1} />
<Scene key="loginModal3" hideNavBar component={Login3} title="Login3" onEnter={() => console.log('Login3: onEnter') } onExit={() => console.log('Login3: onExit')} panHandlers={null} duration={1} />
Expand Down
2 changes: 1 addition & 1 deletion Example/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
"react-native-button": "^2.3.0",
"react-native-message-bar": "^2.0.10",
"react-native-router-flux": "file:..",
"react-navigation": "2.12.x"
"react-navigation": "2.13.x"
},
"devDependencies": {
"@babel/code-frame": "7.0.0-beta.47",
Expand Down
39 changes: 16 additions & 23 deletions Example/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1772,9 +1772,9 @@ create-react-class@^15.6.3:
loose-envify "^1.3.1"
object-assign "^4.1.1"

create-react-context@^0.2.1:
version "0.2.3"
resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.3.tgz#9ec140a6914a22ef04b8b09b7771de89567cb6f3"
[email protected].2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
dependencies:
fbjs "^0.8.0"
gud "^1.0.0"
Expand Down Expand Up @@ -4456,13 +4456,7 @@ react-native-message-bar@^2.0.10:
opencollective "^1.0.3"
path-to-regexp "^2.4.0"
prop-types "^15.6.2"
react-navigation "2.12.x"

react-native-safe-area-view@^0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.7.0.tgz#38f5ab9368d6ef9e5d18ab64212938af3ec39421"
dependencies:
hoist-non-react-statics "^2.3.1"
react-navigation "2.13.x"

react-native-safe-area-view@^0.9.0:
version "0.9.0"
Expand Down Expand Up @@ -4550,35 +4544,34 @@ [email protected]:
dependencies:
react-native-drawer-layout-polyfill "^1.3.2"

react-navigation-stack@0.2.3:
version "0.2.3"
resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-0.2.3.tgz#9d1e2524aa1d178302c938948b8ece49d713f12b"
react-navigation-stack@0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-0.3.0.tgz#cdd056771e5fd12114811824653b1ec7e9ae5de1"

react-navigation-tabs@0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/react-navigation-tabs/-/react-navigation-tabs-0.6.0.tgz#2f526194f4360e56c2702e736887449acc2080dc"
react-navigation-tabs@0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/react-navigation-tabs/-/react-navigation-tabs-0.7.0.tgz#c89d41e501043f7fdb38550de85814452c3e6104"
dependencies:
hoist-non-react-statics "^2.5.0"
prop-types "^15.6.1"
react-lifecycles-compat "^3.0.4"
react-native-safe-area-view "^0.7.0"
react-native-tab-view "^1.0.0"

react-navigation@2.12.x:
version "2.12.1"
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-2.12.1.tgz#17122a4162cd5a65d79814385cd61c2c0cb7ebb5"
react-navigation@2.13.x:
version "2.13.0"
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-2.13.0.tgz#7102ff7cbc492c8daf2ad90fc80463c3469f8b78"
dependencies:
clamp "^1.0.1"
create-react-context "^0.2.1"
create-react-context "0.2.2"
hoist-non-react-statics "^2.2.0"
path-to-regexp "^1.7.0"
query-string "^6.1.0"
react-lifecycles-compat "^3"
react-native-safe-area-view "^0.9.0"
react-navigation-deprecated-tab-navigator "1.3.0"
react-navigation-drawer "0.5.0"
react-navigation-stack "0.2.3"
react-navigation-tabs "0.6.0"
react-navigation-stack "0.3.0"
react-navigation-tabs "0.7.0"

react-proxy@^1.1.7:
version "1.1.8"
Expand Down
2 changes: 1 addition & 1 deletion ReduxExample/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-router-flux": "file:..",
"react-navigation": "2.12.x",
"react-navigation": "2.13.x",
"react-navigation-redux-helpers": "^2.0.5",
"react-redux": "^5.0.5",
"redux": "4.0.x"
Expand Down
2 changes: 2 additions & 0 deletions docs/API.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,12 +39,14 @@ All properties of type `React.Component` will receive the same properties availa
| `backButtonTextStyle` | `Style` | | Style applied to back button text |
| `backButtonTintColor` | `string` | | Custom back button tint color |
| `backTitle` | `string` | | Specifies the back button title for scene |
| `backTitleEnabled` | `boolean` | | allows you to force back button titles to either be rendered or not (if you disagree with defaults for your platform and layout preset) |
| `clone`     | `boolean` | `false` | Scenes marked with `clone` will be treated as templates and cloned into the current scene's parent when pushed. See example. |
| `contentComponent` | `React.Component` | | Component used to render the content of the drawer (e.g. navigation items). |
| `drawer`     | `boolean` | `false` | load child scenes inside [DrawerNavigator](https://reactnavigation.org/docs/navigators/drawer) |
| `drawerLockMode` | enum('unlocked', 'locked-closed', 'locked-open') | | If a child of a drawer, specifies the [lock mode of the drawer](https://facebook.github.io/react-native/docs/drawerlayoutandroid.html#drawerlockmode) |
| `failure` | `Function` | | If `on` returns a "falsey" value then `failure` is called. |
| `headerMode` | `string` | `float` | Specifies how the header should be rendered: `float` (render a single header that stays at the top and animates as screens are changed. This is a common pattern on iOS.), `screen` (each screen has a header attached to it and the header fades in and out together with the screen. This is a common pattern on Android) or `none` (No header will be rendered) |
| `headerLayoutPreset` | `string` | `center | left` | Change layout preset from header to be able to center text in some cases where it would be misaligned. |
| `hideBackImage`     | `boolean` | `false` | hide back image |
| `hideNavBar`     | `boolean` | `false` | hide the nav bar |
| `init`     | `boolean` | `false` | If it is `true` back button will not be displayed |
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
"opencollective": "^1.0.3",
"path-to-regexp": "^2.4.0",
"prop-types": "^15.6.2",
"react-navigation": "2.12.x"
"react-navigation": "2.13.x"
},
"devDependencies": {
"@babel/cli": "7.0.0-beta.47",
Expand Down
16 changes: 10 additions & 6 deletions src/navigationStore.js
Original file line number Diff line number Diff line change
Expand Up @@ -140,12 +140,14 @@ function createNavigationOptions(params) {
backButtonImage,
backButtonTextStyle,
backTitle,
backTitleEnabled,
backToInitial,
component,
drawerIcon,
drawerImage,
drawerPosition,
getTitle,
headerLayoutPreset,
headerStyle,
headerTitleStyle,
hideDrawerButton,
Expand Down Expand Up @@ -195,15 +197,17 @@ function createNavigationOptions(params) {
};
const res = {
...props,
headerTintColor: navBarButtonColor || props.tintColor || navigationParams.tintColor || navigationParams.headerTintColor,
headerTitleStyle: headerTitleStyle || titleStyle,
title: getValue(navigationParams.title || title || getTitle, state),
headerBackImage: navigationParams.backButtonImage || backButtonImage,
headerBackTitle: getValue(navigationParams.backTitle || backTitle, state),
headerRight: getValue(navigationParams.right || right || rightButton || params.renderRightButton, state),
headerBackTitleEnabled: navigationParams.backTitleEnabled || backTitleEnabled,
headerLayoutPreset: navigationParams.headerLayoutPreset || headerLayoutPreset,
headerLeft: getValue(navigationParams.left || left || leftButton || params.renderLeftButton, state),
headerTitle: getValue(navigationParams.renderTitle || renderTitle || params.renderTitle, state),
daviscabral marked this conversation as resolved.
Show resolved Hide resolved
headerRight: getValue(navigationParams.right || right || rightButton || params.renderRightButton, state),
headerStyle: getValue(navigationParams.headerStyle || headerStyle || navigationBarStyle, state),
headerBackImage: navigationParams.backButtonImage || backButtonImage,
headerTintColor: navBarButtonColor || props.tintColor || navigationParams.tintColor || navigationParams.headerTintColor,
headerTitle: getValue(navigationParams.renderTitle || renderTitle || params.renderTitle, state),
Ekhui marked this conversation as resolved.
Show resolved Hide resolved
headerTitleStyle: headerTitleStyle || titleStyle,
title: getValue(navigationParams.title || title || getTitle, state),
};

const NavBarFromParams = navigationParams.renderNavigationBar || navigationParams.navBar;
Expand Down
37 changes: 15 additions & 22 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1914,9 +1914,9 @@ create-react-class@^15.6.3:
loose-envify "^1.3.1"
object-assign "^4.1.1"

create-react-context@^0.2.1:
version "0.2.3"
resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.3.tgz#9ec140a6914a22ef04b8b09b7771de89567cb6f3"
[email protected].2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
dependencies:
fbjs "^0.8.0"
gud "^1.0.0"
Expand Down Expand Up @@ -5165,12 +5165,6 @@ react-native-jest-mocks@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/react-native-jest-mocks/-/react-native-jest-mocks-1.4.0.tgz#8380992bd4c1a533193d96f42dbf2e89bcfea617"

react-native-safe-area-view@^0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.7.0.tgz#38f5ab9368d6ef9e5d18ab64212938af3ec39421"
dependencies:
hoist-non-react-statics "^2.3.1"

react-native-safe-area-view@^0.9.0:
version "0.9.0"
resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.9.0.tgz#10ece2ecac70e7005a5b0b3f06c8833060e6d21f"
Expand Down Expand Up @@ -5257,35 +5251,34 @@ [email protected]:
dependencies:
react-native-drawer-layout-polyfill "^1.3.2"

react-navigation-stack@0.2.3:
version "0.2.3"
resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-0.2.3.tgz#9d1e2524aa1d178302c938948b8ece49d713f12b"
react-navigation-stack@0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/react-navigation-stack/-/react-navigation-stack-0.3.0.tgz#cdd056771e5fd12114811824653b1ec7e9ae5de1"

react-navigation-tabs@0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/react-navigation-tabs/-/react-navigation-tabs-0.6.0.tgz#2f526194f4360e56c2702e736887449acc2080dc"
react-navigation-tabs@0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/react-navigation-tabs/-/react-navigation-tabs-0.7.0.tgz#c89d41e501043f7fdb38550de85814452c3e6104"
dependencies:
hoist-non-react-statics "^2.5.0"
prop-types "^15.6.1"
react-lifecycles-compat "^3.0.4"
react-native-safe-area-view "^0.7.0"
react-native-tab-view "^1.0.0"

react-navigation@2.12.x:
version "2.12.1"
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-2.12.1.tgz#17122a4162cd5a65d79814385cd61c2c0cb7ebb5"
react-navigation@2.13.x:
version "2.13.0"
resolved "https://registry.yarnpkg.com/react-navigation/-/react-navigation-2.13.0.tgz#7102ff7cbc492c8daf2ad90fc80463c3469f8b78"
dependencies:
clamp "^1.0.1"
create-react-context "^0.2.1"
create-react-context "0.2.2"
hoist-non-react-statics "^2.2.0"
path-to-regexp "^1.7.0"
query-string "^6.1.0"
react-lifecycles-compat "^3"
react-native-safe-area-view "^0.9.0"
react-navigation-deprecated-tab-navigator "1.3.0"
react-navigation-drawer "0.5.0"
react-navigation-stack "0.2.3"
react-navigation-tabs "0.6.0"
react-navigation-stack "0.3.0"
react-navigation-tabs "0.7.0"

react-proxy@^1.1.7:
version "1.1.8"
Expand Down