From 5bd63e2f3e06e9723f5381289958a8eb2f8a1688 Mon Sep 17 00:00:00 2001 From: Brent Vatne Date: Tue, 27 Nov 2018 13:35:58 -0800 Subject: [PATCH] Implement drawerLockMode --- packages/drawer/src/views/DrawerLayout.js | 29 +++++++++++++---------- 1 file changed, 17 insertions(+), 12 deletions(-) diff --git a/packages/drawer/src/views/DrawerLayout.js b/packages/drawer/src/views/DrawerLayout.js index 7ab22400..0acad742 100644 --- a/packages/drawer/src/views/DrawerLayout.js +++ b/packages/drawer/src/views/DrawerLayout.js @@ -1,7 +1,5 @@ /* eslint-disable */ -// @flow - // ######################################################### // This is vendored from react-native-gesture-handler! // ######################################################### @@ -17,7 +15,6 @@ import React, { Component } from 'react'; import { Animated, StyleSheet, View, Keyboard, StatusBar, I18nManager } from 'react-native'; import invariant from '../utils/invariant'; -import { AnimatedEvent } from 'react-native/Libraries/Animated/src/AnimatedEvent'; import { PanGestureHandler, @@ -52,9 +49,11 @@ export type PropType = { overlayColor: string, contentContainerStyle?: any, + // Added in this fork, needs to be upstreamed + drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open', + // Properties not yet supported // onDrawerSlide?: Function - // drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open', }; export type StateType = { @@ -82,6 +81,7 @@ export default class DrawerLayout extends Component { edgeWidth: 20, minSwipeDistance: 3, overlayColor: 'black', + drawerLockMode: 'unlocked', }; static positions = { @@ -89,7 +89,7 @@ export default class DrawerLayout extends Component { Right: 'right', }; _openValue: ?Animated.Interpolation; - _onGestureEvent: ?AnimatedEvent; + _onGestureEvent: any; constructor(props: PropType, context: any) { super(props, context); @@ -227,7 +227,11 @@ export default class DrawerLayout extends Component { }; _onTapHandlerStateChange = ({ nativeEvent }) => { - if (this.state.drawerShown && nativeEvent.oldState === State.ACTIVE) { + if ( + this.state.drawerShown && + nativeEvent.oldState === State.ACTIVE && + this.props.drawerLockMode !== 'locked-open' + ) { this.closeDrawer(); } }; @@ -407,8 +411,7 @@ export default class DrawerLayout extends Component { : styles.containerInFront, containerStyles, contentContainerStyle, - ]} - > + ]}> {typeof this.props.children === 'function' ? this.props.children(this._openValue) : this.props.children} @@ -417,8 +420,7 @@ export default class DrawerLayout extends Component { + style={[styles.drawerContainer, drawerStyles]}> {this.props.renderNavigationView(this._openValue)} @@ -433,6 +435,7 @@ export default class DrawerLayout extends Component { const { drawerPosition, drawerType, + drawerLockMode, edgeWidth, minSwipeDistance, } = this.props; @@ -457,9 +460,11 @@ export default class DrawerLayout extends Component { minOffsetX={gestureOrientation * minSwipeDistance} maxDeltaY={15} onGestureEvent={this._onGestureEvent} + enabled={ + drawerLockMode !== 'locked-closed' && drawerLockMode !== 'locked-open' + } onHandlerStateChange={this._openingHandlerStateChange} - ref={this.props.gestureRef} - > + ref={this.props.gestureRef}> {this._renderDrawer()} );