question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Two Drawers - onClose not firing on touch event

See original GitHub issue

I’m new to this package so forgive me if I don’t have it setup properly. I’m trying to create a left and right drawer, which I have nested as suggested in an older issue.

It appears through some debugging that a dragged touch to close either panel below does not fire the onClose handler. I have a custom nav bar with a left and right button; those buttons call the open/close methods as shown below and the button press method does cause the appropriate drawer to fire it’s onClose handler. In fact, it looks like it’s firing onOpen of the other drawer.

Any suggestions?

toggleLeftDrawer: function() {
   (this.state.leftDrawerOpen) ? this.refs.leftDrawer.close() : this.refs.leftDrawer.open();
},
toggleRightDrawer: function() {
   (this.state.rightDrawerOpen) ? this.refs.rightDrawer.close() : this.refs.rightDrawer.open();
}

<Drawer
   ref='leftDrawer'
   type='static'
   side='left'
   content={<Text>Left Panel</Text>}
   openDrawerOffset={100}
   onOpen={this.openLeftDrawer}
   onClose={this.closeDrawer}
   styles={{main: {shadowColor: '#000000', shadowOpacity: 0.4, shadowRadius: 3}}}
   tweenHandler={Drawer.tweenPresets.parallax}
   >
   <Drawer
      ref='rightDrawer'
      type='static'
      side='right'
      content={<Text>Right Panel</Text>}
      openDrawerOffset={100}
      onOpen={this.openRightDrawer}
      onClose={this.closeDrawer}
      styles={{main: {shadowColor: '#000000', shadowOpacity: 0.4, shadowRadius: 3}}}
      tweenHandler={Drawer.tweenPresets.parallax}
      >
      <View>
         ...
      </View>
   </Drawer>
</Drawer>

Issue Analytics

  • State:closed
  • Created 8 years ago
  • Comments:10 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
Jpadilla1commented, Feb 1, 2016

I got it working modifying the openLeftDrawer function to this.

openLeftDrawer () {
    if (this.state.rightDrawerOpen) {
      this.setState({
        rightDrawerOpen: false,
        leftDrawerOpen: false
      });
      this.refs.leftDrawer.close();
      this.refs.rightDrawer.close();
    } else {
      this.setState({
        leftDrawerOpen: true
      });
    }
  }

Note: I am setting negotiatePan to true in my case.

0reactions
rt2zzcommented, Mar 23, 2016

Closing, feel free to reopen if needed

Read more comments on GitHub >

github_iconTop Results From Across the Web

Close Persistent MUI Drawer on clicking outside
Persistent Drawer ... Use ClickAwayListener to know when the user clicks outside the Drawer . You also need to set mouseEvent="onMouseDown" , ...
Read more >
Touch events - Web APIs - MDN Web Docs - Mozilla
When a touchstart event occurs, indicating that a new touch on the surface has occurred, the handleStart() function below is called.
Read more >
Autocomplete API - Material UI - MUI
Name Type Default options * array renderInput * func autoComplete bool false
Read more >
Drawer - Ant Design
A Drawer is a panel that is typically overlaid on top of a page and slides in from the side. It contains a...
Read more >
How touch events are delivered in Android - Suragch - Medium
If some ViewGroup wants to handle the touch event right away (and not give anyone else down the line a chance at it)...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found