From 791770e2434233c708b76558ea4b4425bbd482c3 Mon Sep 17 00:00:00 2001 From: aksonov Date: Sun, 30 Jul 2017 10:05:21 +0200 Subject: [PATCH] Fixes #2124, Fixes #2130 --- dist/NavBar.js | 4 ++-- dist/navigationStore.js | 23 +++++++++++++---------- src/NavBar.js | 2 +- src/navigationStore.js | 13 ++++++++----- 4 files changed, 24 insertions(+), 18 deletions(-) diff --git a/dist/NavBar.js b/dist/NavBar.js index 1e5f4b587..2c2fe9c2d 100644 --- a/dist/NavBar.js +++ b/dist/NavBar.js @@ -10,7 +10,7 @@ Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.ass -renderBackButton=renderBackButton;exports. +BackButton=BackButton;exports. @@ -120,7 +120,7 @@ LeftButton=LeftButton;exports. -RightButton=RightButton;var _react=require('react');var _react2=_interopRequireDefault(_react);var _reactNative=require('react-native');var _navigationStore=require('./navigationStore');var _navigationStore2=_interopRequireDefault(_navigationStore);var _back_chevron=require('../images/back_chevron.png');var _back_chevron2=_interopRequireDefault(_back_chevron);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function renderBackButton(state){var textButtonStyle=[styles.barBackButtonText,state.backButtonTextStyle];var style=[styles.backButton,state.leftButtonStyle];var buttonImage=state.backButtonImage||_back_chevron2.default;var tintColor=getValue(state.backButtonTintColor,state)||state.tintColor||state.navBarButtonColor||state.headerTintColor;var onPress=state.onBack;if(onPress){onPress=onPress.bind(null,state);}else{onPress=_navigationStore2.default.pop;}var text=state.backTitle?_react2.default.createElement(_reactNative.Text,{style:textButtonStyle,__source:{fileName:_jsxFileName,lineNumber:32}},state.backTitle):null;return _react2.default.createElement(_reactNative.TouchableOpacity,{testID:'backNavButton',style:styles.backButtonContainer,onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:38}},_react2.default.createElement(_reactNative.View,{style:style,__source:{fileName:_jsxFileName,lineNumber:43}},buttonImage&&!state.hideBackImage&&_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:[styles.backButtonImage,state.barButtonIconStyle,state.leftButtonIconStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:44}}),text));}function LeftButton(state){var onPress=state.onLeft;var buttonImage=getValue(state.leftButtonImage,state);var menuIcon=state.drawerIcon;var style=[styles.leftButton,state.leftButtonStyle];var leftButtonTextStyle=getValue(state.leftButtonTextStyle,state);var leftButtonIconStyle=getValue(state.leftButtonIconStyle,state);var leftButtonStyle=[styles.defaultImageStyle,leftButtonIconStyle];var leftTitle=state.getLeftTitle?state.getLeftTitle(state):getValue(state.leftTitle,state);var textColor=getValue(state.leftButtonTintColor,state);var tintColor=textColor||state.tintColor||state.navBarButtonColor||state.headerTintColor;var textStyle=[{color:tintColor},styles.barLeftButtonText,leftButtonTextStyle,textColor&&{color:textColor}];if(state.leftButton){var Button=state.leftButton||state.left;return _react2.default.createElement(Button,_extends({},state,{key:'leftNavBarBtn',testID:'leftNavButton',style:[].concat(style,leftButtonStyle),textStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:76}}));}if(onPress&&(leftTitle||buttonImage)){onPress=onPress.bind(null,state);return _react2.default.createElement(_reactNative.TouchableOpacity,{key:'leftNavBarBtn',testID:'leftNavButton',style:style,onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:89}},leftTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:95}},leftTitle),!leftTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-start'},__source:{fileName:_jsxFileName,lineNumber:99}},menuIcon||_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:[state.leftButtonIconStyle||styles.defaultImageStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:100}})));}if(!!state.onLeft^!!(leftTitle||buttonImage)){console.warn('Both onLeft and leftTitle/leftButtonImage\n must be specified for the scene: '+state.name);}return null;}function getValue(value,params){return value instanceof Function?value(params):value;}function RightButton(state){ +RightButton=RightButton;var _react=require('react');var _react2=_interopRequireDefault(_react);var _reactNative=require('react-native');var _navigationStore=require('./navigationStore');var _navigationStore2=_interopRequireDefault(_navigationStore);var _back_chevron=require('../images/back_chevron.png');var _back_chevron2=_interopRequireDefault(_back_chevron);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function BackButton(state){var textButtonStyle=[styles.barBackButtonText,state.backButtonTextStyle];var style=[styles.backButton,state.leftButtonStyle];var buttonImage=state.backButtonImage||_back_chevron2.default;var tintColor=getValue(state.backButtonTintColor,state)||state.tintColor||state.navBarButtonColor||state.headerTintColor;var onPress=state.onBack;if(onPress){onPress=onPress.bind(null,state);}else{onPress=_navigationStore2.default.pop;}var text=state.backTitle?_react2.default.createElement(_reactNative.Text,{style:textButtonStyle,__source:{fileName:_jsxFileName,lineNumber:32}},state.backTitle):null;return _react2.default.createElement(_reactNative.TouchableOpacity,{testID:'backNavButton',style:styles.backButtonContainer,onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:38}},_react2.default.createElement(_reactNative.View,{style:style,__source:{fileName:_jsxFileName,lineNumber:43}},buttonImage&&!state.hideBackImage&&_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:[styles.backButtonImage,state.barButtonIconStyle,state.leftButtonIconStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:44}}),text));}function LeftButton(state){var onPress=state.onLeft;var buttonImage=getValue(state.leftButtonImage,state);var menuIcon=state.drawerIcon;var style=[styles.leftButton,state.leftButtonStyle];var leftButtonTextStyle=getValue(state.leftButtonTextStyle,state);var leftButtonIconStyle=getValue(state.leftButtonIconStyle,state);var leftButtonStyle=[styles.defaultImageStyle,leftButtonIconStyle];var leftTitle=state.getLeftTitle?state.getLeftTitle(state):getValue(state.leftTitle,state);var textColor=getValue(state.leftButtonTintColor,state);var tintColor=textColor||state.tintColor||state.navBarButtonColor||state.headerTintColor;var textStyle=[{color:tintColor},styles.barLeftButtonText,leftButtonTextStyle,textColor&&{color:textColor}];if(state.leftButton){var Button=state.leftButton||state.left;return _react2.default.createElement(Button,_extends({},state,{key:'leftNavBarBtn',testID:'leftNavButton',style:[].concat(style,leftButtonStyle),textStyle:textStyle,__source:{fileName:_jsxFileName,lineNumber:76}}));}if(onPress&&(leftTitle||buttonImage)){onPress=onPress.bind(null,state);return _react2.default.createElement(_reactNative.TouchableOpacity,{key:'leftNavBarBtn',testID:'leftNavButton',style:style,onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:89}},leftTitle&&_react2.default.createElement(_reactNative.Text,{style:textStyle,__source:{fileName:_jsxFileName,lineNumber:95}},leftTitle),!leftTitle&&buttonImage&&_react2.default.createElement(_reactNative.View,{style:{flex:1,justifyContent:'center',alignItems:'flex-start'},__source:{fileName:_jsxFileName,lineNumber:99}},menuIcon||_react2.default.createElement(_reactNative.Image,{source:buttonImage,style:[state.leftButtonIconStyle||styles.defaultImageStyle,{tintColor:tintColor}],__source:{fileName:_jsxFileName,lineNumber:100}})));}if(!!state.onLeft^!!(leftTitle||buttonImage)){console.warn('Both onLeft and leftTitle/leftButtonImage\n must be specified for the scene: '+state.name);}return null;}function getValue(value,params){return value instanceof Function?value(params):value;}function RightButton(state){ var drawer=null; if(!state){ return null; diff --git a/dist/navigationStore.js b/dist/navigationStore.js index 2fe51e734..7b40b55b0 100644 --- a/dist/navigationStore.js +++ b/dist/navigationStore.js @@ -15,6 +15,7 @@ var _Reducer=require('./Reducer');function _interopRequireWildcard(obj){if(obj&& var RightNavBarButton=void 0; var LeftNavBarButton=void 0; +var BackNavBarButton=void 0; var actionMap=exports.actionMap=(_actionMap={},_defineProperty(_actionMap, ActionConst.JUMP,'jump'),_defineProperty(_actionMap, @@ -102,8 +103,9 @@ function createNavigationOptions(params){var title= -params.title,backButtonImage=params.backButtonImage,navTransparent=params.navTransparent,hideNavBar=params.hideNavBar,hideTabBar=params.hideTabBar,backTitle=params.backTitle,right=params.right,rightButton=params.rightButton,left=params.left,leftButton=params.leftButton,navigationBarStyle=params.navigationBarStyle,headerStyle=params.headerStyle,navBarButtonColor=params.navBarButtonColor,tabBarLabel=params.tabBarLabel,tabBarIcon=params.tabBarIcon,icon=params.icon,getTitle=params.getTitle,renderTitle=params.renderTitle,panHandlers=params.panHandlers,navigationBarTitleImage=params.navigationBarTitleImage,navigationBarTitleImageStyle=params.navigationBarTitleImageStyle,component=params.component,rightTitle=params.rightTitle,leftTitle=params.leftTitle,leftButtonTextStyle=params.leftButtonTextStyle,rightButtonTextStyle=params.rightButtonTextStyle,backButtonTextStyle=params.backButtonTextStyle,headerTitleStyle=params.headerTitleStyle,titleStyle=params.titleStyle,navBar=params.navBar,onRight=params.onRight,onLeft=params.onLeft,rightButtonImage=params.rightButtonImage,leftButtonImage=params.leftButtonImage,init=params.init,back=params.back,props=_objectWithoutProperties(params,['title','backButtonImage','navTransparent','hideNavBar','hideTabBar','backTitle','right','rightButton','left','leftButton','navigationBarStyle','headerStyle','navBarButtonColor','tabBarLabel','tabBarIcon','icon','getTitle','renderTitle','panHandlers','navigationBarTitleImage','navigationBarTitleImageStyle','component','rightTitle','leftTitle','leftButtonTextStyle','rightButtonTextStyle','backButtonTextStyle','headerTitleStyle','titleStyle','navBar','onRight','onLeft','rightButtonImage','leftButtonImage','init','back']); -var NavBar=navBar; + +params.title,backButtonImage=params.backButtonImage,navTransparent=params.navTransparent,hideNavBar=params.hideNavBar,hideTabBar=params.hideTabBar,backTitle=params.backTitle,right=params.right,rightButton=params.rightButton,left=params.left,leftButton=params.leftButton,navigationBarStyle=params.navigationBarStyle,headerStyle=params.headerStyle,navBarButtonColor=params.navBarButtonColor,tabBarLabel=params.tabBarLabel,tabBarIcon=params.tabBarIcon,icon=params.icon,getTitle=params.getTitle,renderTitle=params.renderTitle,panHandlers=params.panHandlers,navigationBarTitleImage=params.navigationBarTitleImage,navigationBarTitleImageStyle=params.navigationBarTitleImageStyle,component=params.component,rightTitle=params.rightTitle,leftTitle=params.leftTitle,leftButtonTextStyle=params.leftButtonTextStyle,rightButtonTextStyle=params.rightButtonTextStyle,backButtonTextStyle=params.backButtonTextStyle,headerTitleStyle=params.headerTitleStyle,titleStyle=params.titleStyle,navBar=params.navBar,onRight=params.onRight,onLeft=params.onLeft,rightButtonImage=params.rightButtonImage,leftButtonImage=params.leftButtonImage,init=params.init,back=params.back,renderBackButton=params.renderBackButton,renderNavigationBar=params.renderNavigationBar,props=_objectWithoutProperties(params,['title','backButtonImage','navTransparent','hideNavBar','hideTabBar','backTitle','right','rightButton','left','leftButton','navigationBarStyle','headerStyle','navBarButtonColor','tabBarLabel','tabBarIcon','icon','getTitle','renderTitle','panHandlers','navigationBarTitleImage','navigationBarTitleImageStyle','component','rightTitle','leftTitle','leftButtonTextStyle','rightButtonTextStyle','backButtonTextStyle','headerTitleStyle','titleStyle','navBar','onRight','onLeft','rightButtonImage','leftButtonImage','init','back','renderBackButton','renderNavigationBar']); +var NavBar=renderNavigationBar||navBar; if(component&&component.navigationOptions){ return component.navigationOptions; } @@ -123,7 +125,7 @@ headerStyle:getValue(navigationParams.headerStyle||headerStyle||navigationBarSty headerBackImage:navigationParams.backButtonImage||backButtonImage}); if(NavBar){ -res.header=function(data){return _react2.default.createElement(NavBar,_extends({navigation:navigation},state,data,{__source:{fileName:_jsxFileName,lineNumber:126}}));}; +res.header=function(data){return _react2.default.createElement(NavBar,_extends({navigation:navigation},state,data,{__source:{fileName:_jsxFileName,lineNumber:128}}));}; } if(panHandlers===null){ @@ -131,7 +133,7 @@ res.gesturesEnabled=false; } if(navigationBarTitleImage){ -res.headerTitle=_react2.default.createElement(Image,{source:navigationBarTitleImage,style:navigationBarTitleImageStyle,__source:{fileName:_jsxFileName,lineNumber:134}}); +res.headerTitle=_react2.default.createElement(Image,{source:navigationBarTitleImage,style:navigationBarTitleImageStyle,__source:{fileName:_jsxFileName,lineNumber:136}}); } if(tabBarLabel){ @@ -140,7 +142,7 @@ res.tabBarLabel=tabBarLabel; if(tabBarIcon||icon){ var Icon=tabBarIcon||icon; -res.tabBarIcon=function(data){return _react2.default.createElement(Icon,_extends({},state,data,{__source:{fileName:_jsxFileName,lineNumber:143}}));}; +res.tabBarIcon=function(data){return _react2.default.createElement(Icon,_extends({},state,data,{__source:{fileName:_jsxFileName,lineNumber:145}}));}; } var componentData={}; @@ -157,19 +159,19 @@ componentData[key]=component[key]; if(rightButtonImage||rightTitle||params.renderRightButton||onRight||navigationParams.onRight|| navigationParams.rightTitle||navigationParams.rightButtonImage||rightButtonTextStyle){ res.headerRight=getValue(navigationParams.right||navigationParams.rightButton||params.renderRightButton,_extends({}, -navigationParams,screenProps))||_react2.default.createElement(RightNavBarButton,_extends({},params,navigationParams,componentData,{__source:{fileName:_jsxFileName,lineNumber:160}})); +navigationParams,screenProps))||_react2.default.createElement(RightNavBarButton,_extends({},params,navigationParams,componentData,{__source:{fileName:_jsxFileName,lineNumber:162}})); } if(leftButtonImage||backButtonImage||backTitle||leftTitle||params.renderLeftButton||leftButtonTextStyle|| backButtonTextStyle||onLeft||navigationParams.leftTitle||navigationParams.onLeft||navigationParams.leftButtonImage|| navigationParams.backButtonImage||navigationParams.backTitle){ res.headerLeft=getValue(navigationParams.left||navigationParams.leftButton||params.renderLeftButton,_extends({},params,navigationParams,screenProps))|| -onLeft&&(leftTitle||navigationParams.leftTitle||leftButtonImage)&&_react2.default.createElement(LeftNavBarButton,_extends({},params,navigationParams,componentData,{__source:{fileName:_jsxFileName,lineNumber:167}}))||( -init?null:(0,_NavBar.renderBackButton)(_extends({},params,navigationParams,screenProps))); +onLeft&&(leftTitle||navigationParams.leftTitle||leftButtonImage)&&_react2.default.createElement(LeftNavBarButton,_extends({},params,navigationParams,componentData,{__source:{fileName:_jsxFileName,lineNumber:169}}))||( +init?null:renderBackButton&&renderBackButton(state)||_react2.default.createElement(BackNavBarButton,_extends({},state,{__source:{fileName:_jsxFileName,lineNumber:170}}))); } if(back){ -res.headerLeft=(0,_NavBar.renderBackButton)(_extends({},params,navigationParams)); +res.headerLeft=renderBackButton&&renderBackButton(state)||_react2.default.createElement(BackNavBarButton,_extends({},state,{__source:{fileName:_jsxFileName,lineNumber:174}})); } if(hideTabBar){ @@ -192,7 +194,7 @@ return null; } var wrapper=wrapBy||function(props){return props;}; function wrapped(_ref4){var navigation=_ref4.navigation,props=_objectWithoutProperties(_ref4,['navigation']); -return _react2.default.createElement(Component,_extends({},props,{navigation:navigation},navigation.state.params,{name:navigation.state.routeName,__source:{fileName:_jsxFileName,lineNumber:195}})); +return _react2.default.createElement(Component,_extends({},props,{navigation:navigation},navigation.state.params,{name:navigation.state.routeName,__source:{fileName:_jsxFileName,lineNumber:197}})); } wrapped.propTypes={ navigation:_propTypes2.default.object}; @@ -245,6 +247,7 @@ create=function(scene){var params=arguments.length>1&&arguments[1]!==undefined?a (0,_Util.assert)(!Array.isArray(scene),'Router should contain only one scene, please wrap your scenes with root Scene '); RightNavBarButton=wrapBy(_NavBar.RightButton); LeftNavBarButton=wrapBy(_NavBar.LeftButton); +BackNavBarButton=wrapBy(_NavBar.BackButton); var AppNavigator=_this.processScene(scene,params,[],wrapBy); _this.router=AppNavigator.router; _this.dispatch(_reactNavigation.NavigationActions.init()); diff --git a/src/NavBar.js b/src/NavBar.js index 108f2ec5d..a11163c4a 100644 --- a/src/NavBar.js +++ b/src/NavBar.js @@ -10,7 +10,7 @@ import { } from 'react-native'; import Actions from './navigationStore'; import _backButtonImage from '../images/back_chevron.png'; -export function renderBackButton(state) { +export function BackButton(state) { const textButtonStyle = [ styles.barBackButtonText, state.backButtonTextStyle, diff --git a/src/navigationStore.js b/src/navigationStore.js index 70c112f00..a3d11be08 100644 --- a/src/navigationStore.js +++ b/src/navigationStore.js @@ -4,7 +4,7 @@ import * as ActionConst from './ActionConst'; import { OnEnter, OnExit, assert } from './Util'; import { View } from 'react-native'; import { TabNavigator, DrawerNavigator, StackNavigator, NavigationActions } from 'react-navigation'; -import { LeftButton, RightButton, renderBackButton } from './NavBar'; +import { LeftButton, RightButton, BackButton } from './NavBar'; import LightboxNavigator from './LightboxNavigator'; import OverlayNavigator from './OverlayNavigator'; import _drawerImage from '../images/menu_burger.png'; @@ -15,6 +15,7 @@ import { reducer } from './Reducer'; let RightNavBarButton; let LeftNavBarButton; +let BackNavBarButton; export const actionMap = { [ActionConst.JUMP]: 'jump', @@ -102,8 +103,9 @@ function createNavigationOptions(params) { const { title, backButtonImage, navTransparent, hideNavBar, hideTabBar, backTitle, right, rightButton, left, leftButton, navigationBarStyle, headerStyle, navBarButtonColor, tabBarLabel, tabBarIcon, icon, getTitle, renderTitle, panHandlers, navigationBarTitleImage, navigationBarTitleImageStyle, component, rightTitle, leftTitle, leftButtonTextStyle, rightButtonTextStyle, - backButtonTextStyle, headerTitleStyle, titleStyle, navBar, onRight, onLeft, rightButtonImage, leftButtonImage, init, back, ...props } = params; - const NavBar = navBar; + backButtonTextStyle, headerTitleStyle, titleStyle, navBar, onRight, onLeft, rightButtonImage, leftButtonImage, init, back, + renderBackButton, renderNavigationBar, ...props } = params; + const NavBar = renderNavigationBar || navBar; if (component && component.navigationOptions) { return component.navigationOptions; } @@ -165,11 +167,11 @@ function createNavigationOptions(params) { || navigationParams.backButtonImage || navigationParams.backTitle) { res.headerLeft = getValue(navigationParams.left || navigationParams.leftButton || params.renderLeftButton, { ...params, ...navigationParams, ...screenProps }) || (onLeft && (leftTitle || navigationParams.leftTitle || leftButtonImage) && ) - || (init ? null : renderBackButton({ ...params, ...navigationParams, ...screenProps })); + || (init ? null : (renderBackButton && renderBackButton(state)) || ); } if (back) { - res.headerLeft = renderBackButton({ ...params, ...navigationParams }); + res.headerLeft = (renderBackButton && renderBackButton(state)) || ; } if (hideTabBar) { @@ -245,6 +247,7 @@ class NavigationStore { assert(!Array.isArray(scene), 'Router should contain only one scene, please wrap your scenes with root Scene '); RightNavBarButton = wrapBy(RightButton); LeftNavBarButton = wrapBy(LeftButton); + BackNavBarButton = wrapBy(BackButton); const AppNavigator = this.processScene(scene, params, [], wrapBy); this.router = AppNavigator.router; this.dispatch(NavigationActions.init());