diff --git a/README.md b/README.md index f303f167..6700fb91 100644 --- a/README.md +++ b/README.md @@ -110,6 +110,7 @@ This module supports a wide range of drawer styles, and hence has *a lot* of pro - `panThreshold` (Number) `.25` - Ratio of screen width that must be travelled to trigger a drawer open/close. - `panOpenMask` (Number) `null` - Ratio of screen width that is valid for the start of a pan open action. If null -> defaults to `max(.05, closedDrawerOffset)`. - `panCloseMask` (Number) `null` - Ratio of screen width that is valid for the start of a pan close action. If null -> defaults to `max(.05, openDrawerOffset)`. +- `gestureMarginTop` (Number) `0` - Sets the height in dp of top part of the screen where drawer won't capture pan gestures. For example when you have menu button in the top-left corner, you want your gestures to trigger that button, and not the drawer. - `initializeOpen` (Boolean) `false` - Initialize with drawer open? - `side` (String left|right) `left` - which side the drawer should be on. - `useInteractionManager` (Boolean) `false` - if true will run InteractionManager for open/close animations. diff --git a/index.js b/index.js index aced9c60..386f4f67 100644 --- a/index.js +++ b/index.js @@ -63,6 +63,7 @@ export default class Drawer extends Component { tweenHandler: PropTypes.func, type: PropTypes.oneOf(['overlay', 'static', 'displace']), useInteractionManager: PropTypes.bool, + gestureMarginTop: PropTypes.number, // deprecated panStartCompensation: PropTypes.bool, @@ -79,6 +80,7 @@ export default class Drawer extends Component { panThreshold: 0.25, // @TODO consider rename to panThreshold panOpenMask: null, // defaults to closedDrawerOffset panCloseMask: null, // defaults to openDrawerOffset + gestureMarginTop: 0, tweenHandler: null, tweenDuration: 250, @@ -357,6 +359,7 @@ export default class Drawer extends Component { let deltaOpen = this.props.side === 'left' ? this.state.viewport.width - x0 : x0 let deltaClose = this.props.side === 'left' ? x0 : this.state.viewport.width - x0 + if ( e.nativeEvent.pageY < this.props.gestureMarginTop ) return false if ( this._open && deltaOpen > this.getOpenMask() ) return false if ( !this._open && deltaClose > this.getClosedMask() ) return false return true