diff --git a/docs/api/navigators/DrawerNavigator.md b/docs/api/navigators/DrawerNavigator.md index 868f9c5..ddc3a7f 100644 --- a/docs/api/navigators/DrawerNavigator.md +++ b/docs/api/navigators/DrawerNavigator.md @@ -87,7 +87,6 @@ The route configs object is a mapping from route name to a route config, which t ### DrawerNavigatorConfig - - `drawerWidth` - Width of the drawer - `drawerPosition` - Options are `left` or `right`. Default is `left` position. - `contentComponent` - Component used to render the content of the drawer, for example, navigation items. Receives the `navigation` prop for the drawer. Defaults to `DrawerItems`. For more information, see below. @@ -172,6 +171,10 @@ String, React Element or a function that given `{ focused: boolean, tintColor: s React Element or a function, that given `{ focused: boolean, tintColor: string }` returns a React.Element, to display in drawer sidebar +#### `drawerLockMode` + +Specifies the [lock mode](https://facebook.github.io/react-native/docs/drawerlayoutandroid.html#drawerlockmode) of the drawer. This can also update dynamically by using screenProps.lockMode on your top level router. + ### Navigator Props The navigator component created by `DrawerNavigator(...)` takes the following props: diff --git a/src/TypeDefinition.js b/src/TypeDefinition.js index 85b7aeb..e40bec3 100644 --- a/src/TypeDefinition.js +++ b/src/TypeDefinition.js @@ -359,6 +359,7 @@ export type NavigationDrawerScreenOptions = { | ((options: { tintColor: ?string, focused: boolean }) => ?React.Element< * >), + drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open', }; /** diff --git a/src/navigators/DrawerNavigator.js b/src/navigators/DrawerNavigator.js index dcd718d..a1d21b0 100644 --- a/src/navigators/DrawerNavigator.js +++ b/src/navigators/DrawerNavigator.js @@ -43,6 +43,7 @@ const DrawerNavigator = ( const { containerConfig, drawerWidth, + drawerLockMode, contentComponent, contentOptions, drawerPosition, @@ -82,6 +83,7 @@ const DrawerNavigator = ( )((props: *) => , @@ -138,11 +139,26 @@ export default class DrawerView extends PureComponent { const DrawerScreen = this.props.router.getComponentForRouteName( 'DrawerClose' ); + + const screenNavigation = addNavigationHelpers({ + state: this._screenNavigationProp.state, + dispatch: this._screenNavigationProp.dispatch, + }); + + const config = this.props.router.getScreenOptions( + screenNavigation, + this.props.screenProps + ); + return ( { this._drawer = c; }} + drawerLockMode={ + (this.props.screenProps && this.props.screenProps.drawerLockMode) || + (config && config.drawerLockMode) + } drawerWidth={this.props.drawerWidth} onDrawerOpen={this._handleDrawerOpen} onDrawerClose={this._handleDrawerClose}