Prevent keyboard dismiss. React native

Question

How to keep keyboard opened when i have TextInput and Touchable near input that sends message. So i want to send message without double tap on touchable. First to hide keyboard, second to send message. How to do that?

• WayneC: Possible duplicate of React Native have to double click for onPress to work

Answer 1

Use keyboardShouldPersistTaps to handle this.

Example:-

<ScrollView
 keyboardDismissMode="on-drag"
 keyboardShouldPersistTaps={'always'} >
</ScrollView>

Deprecated Properties:-

false, deprecated, use 'never' instead

true, deprecated, use 'always' instead

source

• Gant Laborde: Don't use true, use 'always', as true is deprecated.

Answer 2

Check out keyboardShouldPersistTaps.

The following keeps the keyboard open when content is tapped but closes the keyboard when dragged.

<ScrollView keyboardShouldPersistTaps="always" keyboardDismissMode="on-drag">
 {/* Content containing interactive elements such as <Touchable /> */}
</ScrollView>

Note
Any parent ScrollViews/VirtualizedLists/Flatlists/SectionLists will also need to set keyboardShouldPersistTaps="always"

Here are some gory details if you're interested.

Answer 3

Have a look at the keyboardShouldPersistTaps property of ScrollView. Setting it to "handled" should do what you are looking for.

• IC_: Why scrollview? I need TouchableHighlight
• WayneC: if you wrap your screen in ScrollView, you can set the keyboard behaviour.
• WayneC: You can add scrollEnabled={false} to disable scrolling if you don't need it.
• IC_: That's not working. Tried 'always', 'handled' but no one worked for me. Keyboard closes after tapping item in scrollview

Answer 4

just only wrap you submit button with scrollview and then make sure u need to add two props keyboardShouldPersistTaps="always" and keyboardDismissMode="on-drag" like this ...

<TextInput/> 
<ScrollView
 contentContainerStyle={{
 width: SIZES.width / 6,
 height: 60,
 }}
 keyboardShouldPersistTaps="always"
 keyboardDismissMode="on-drag">
<TouchableOpacity onPress={}>
</TouchableOpacity>
</ScrollView>