diff --git a/README.md b/README.md index 7b65b12..742e470 100644 --- a/README.md +++ b/README.md @@ -72,6 +72,8 @@ class Application extends React.Component { | animationStyle | none | (Function -> Object) | Function that accept 1 argument (value) and return an object:
- `value` you should use at the place you need current value of animated parameter (left offset of content view) | | bounceBackOnOverdraw | true | boolean | when true, content view will bounce back to openMenuOffset when dragged further | | autoClosing | true | boolean | When true, menu close automatically as soon as an event occurs | +| closeByClickingOnContent | true | boolean | When true, menu close automatically as soon as the content area was touched | +| fixedMenuOffset | false | boolean | When true, menu offset is independent of the layout size | ### FAQ diff --git a/index.js b/index.js index 0d481e4..0eaebf5 100644 --- a/index.js +++ b/index.js @@ -29,7 +29,9 @@ type Props = { onStartShouldSetResponderCapture: Function, isOpen: bool, bounceBackOnOverdraw: bool, - autoClosing: bool + autoClosing: bool, + closeByClickingOnContent: bool, + fixedMenuOffset: bool }; type Event = { @@ -101,7 +103,7 @@ export default class SideMenu extends React.Component { left, }; - this.state.left.addListener(({value}) => this.props.onSliding(Math.abs((value - this.state.hiddenMenuOffset) / (this.state.openMenuOffset - this.state.hiddenMenuOffset)))); + this.state.left.addListener(({ value }) => props.onSliding(Math.abs((value - this.state.hiddenMenuOffset) / (this.state.openMenuOffset - this.state.hiddenMenuOffset)))); } componentWillMount(): void { @@ -124,7 +126,11 @@ export default class SideMenu extends React.Component { const { width, height } = e.nativeEvent.layout; const openMenuOffset = width * this.state.openOffsetMenuPercentage; const hiddenMenuOffset = width * this.state.hiddenMenuOffsetPercentage; - this.setState({ width, height, openMenuOffset, hiddenMenuOffset }); + if (this.props.fixedMenuOffset === true) { + this.setState({ width, height, hiddenMenuOffset }); + } else { + this.setState({ width, height, openMenuOffset, hiddenMenuOffset }); + } } /** @@ -134,7 +140,7 @@ export default class SideMenu extends React.Component { getContentView() { let overlay: React.Element = null; - if (this.isOpen) { + if (this.props.closeByClickingOnContent && this.isOpen) { overlay = ( this.openMenu(false)}> @@ -275,6 +281,9 @@ SideMenu.propTypes = { isOpen: PropTypes.bool, bounceBackOnOverdraw: PropTypes.bool, autoClosing: PropTypes.bool, + closeByClickingOnContent: PropTypes.bool, + onSliding: PropTypes.func, + fixedMenuOffset: PropTypes.bool, }; SideMenu.defaultProps = { @@ -304,4 +313,6 @@ SideMenu.defaultProps = { isOpen: false, bounceBackOnOverdraw: true, autoClosing: true, + closeByClickingOnContent: true, + fixedMenuOffset: false, };