Search code examples
reactjsreact-nativedropdown

React native, using selectable style to make a dropdown picker on top of all views makes it untouchable

I have a certain dropdown view that I want to stay on top of all other views. It currently looks like this.

enter image description here

I've tried setting a style of "elevation: 1" which fixes the UI but the dropdown stays untouchable if there were originally views on top of it.

enter image description here

The area that's not clickable should be clickable as well:

enter image description here

To explain it more using a gif.

Here's the github issue link with the code.

Edit: Toggling the inspector on and off fixes the issue. But it's not a viable solution for production.

Solution

  • I've wrapped the dropdown picker and the below components under a ScrollView with a nestedScrollEnabled and it's working.

    <ScrollView nestedScrollEnabled={true} />
    <DropDownPicker  ... />
</ScrollView>