title: React Native: Sidebar is shown but unable to interact with it
body: <p>I am using <a href="https://github.com/jerolimov/react-native-sidebar" rel="nofollow noreferrer">React Native Sidebar</a></p>
  
  <p>This is the sidebar:</p>
  
  <pre><code>&lt;Sidebar
  ref={(ref) =&gt; this._drawer = ref}
  leftSidebar={ this.renderLeftSidebar() }
  leftSidebarWidth = {200}
  &gt;
  
  &lt;/Sidebar&gt;
  </code></pre>
  
  <p>This is how I'm rendering the left sidebar:</p>
  
  <pre><code>  renderLeftSidebar = () =&gt;{
      return (
              &lt;View style = {{ position:'absolute', backgroundColor:'#24292e4f', height:Dimensions.get('window').height}}&gt;
                  &lt;DrawerContent/&gt;
              &lt;/View&gt;
  
      )
    }
  </code></pre>
  
  <p>And this is the content for that left sidebar:</p>
  
  <pre><code>export default DrawerContent = () =&gt; {
      return (
        &lt;View style={styles.animatedBox}&gt;
  
          &lt;Image
          source={require('../assets/images/header.png')}
          style={{height:200, alignSelf:'center'}}
          /&gt;
  
          &lt;View style = {styles.drawerContentView}&gt;
          &lt;Icon
          name='setting'
          type='antdesign'
          color='#4abce3'
          size ={22}
          iconStyle = {styles.drawerItemIconStyle}
          onPress={() =&gt; console.log('hello settings')}
          /&gt;
  &lt;/View&gt;
  </code></pre>
  
  <p>The sidebar opens just fine and renders correctly, but when I try and press anything on the sidebar the press goes through the sidebar and interacts with elements rendered beneath it. Should I be using <code>zIndex</code> in my styles or is my approach completely wrong?</p>