Button can't be clicked while keyboard is visible - react native

Question

I have an textInput and a button. While the textInput is focused, the keyboard comes up but if you tap the button with keyboard visible, first the keyboard disappears and then only you can tap button. Why is it? How can I make it work so that the button can be tapped with keyboard visible? The apps developed in android studio (android native) can get the click listener with keyboard visible. But in react native, it is not working. If you tap anywhere but button, then the keyboard should disappear, isn't it? But if you tap on the button with keyboard visible, the btn should receive the listener. I'm testing it in android devices.

P.S you can try it here: https://snack.expo.io/@codebyte99/addcomponents

<TextInput
    placeholder={'Type smth'}
    style={[{ borderBottomColor: 'gray', borderBottomWidth: 1 }]}
/>

<TouchableOpacity onPress={() => { this._onPressOut(); }}>
  <Text>click here</Text>
</TouchableOpacity>

Answer 1

The scrollview contains a prop keyboardShouldPersistTaps which handles the keyboard tap behaviour inside a scrollview.

For your case give it as <ScrollView keyboardShouldPersistTaps='handled'>

Here is a expo link scrollview with keyboard

Answer 2

As an addition to @thakur-karthik answer:

It's very important to note that in the scrollview scenario, some oddity occurs when you have a scrollview in a react-native modal.

Just adding keyboardShouldPersistTaps={'always'} on the scrollview in the modal alone will not work.

If you have scrollviews in any ancestors, they must also have keyboardShouldPersistTaps={'always'} declared on their components