How to disable keyboard in react native

Question

I created a screen keyboard component that I want to disable the platform's keyboard, how I can disable it?

<TextInput
  secureTextEntry
  ref="Pin"
  selectionColor="#656565"
  keyboardType="numeric"
  activeColor="#656565"
  inactiveColor="#fff"
  autoFocus={false}
  ignoreCase
  codeLength={4}
  inputPosition="center"
  size={50}
  onFulfill={isValid => this}
  codeInputStyle={{ borderWidth: 1.5 }}
/>

Answer 1

Just write showSoftInputOnFocus={false} in <TextInput> like this:

<TextInput showSoftInputOnFocus={false} />

Answer 2

I think you need to add something like:

<TextInput showSoftInputOnFocus={false} keyboardType="numeric" />

Answer 3

I had issues also. No other solutions was working for me. This will display text input field and it will be clickable but not editable.

<TouchableOpacity onPress={this.openPinKeyboard}>
  <View pointerEvents="none">
    <Input editable={false} value="1234" />
  </View>
</TouchableOpacity>

Answer 4

The easiest solution is to use the onFocus prop on TextInput.

1. Import Keyboard from ‘react-native’

import {Keyboard, TextInput} from 'react-native'

2. Then pass Keyboard.dismiss() to TextInput onFocus prop, to stop the keyboard from popping up when focused.

<TextInput onFocus = {()=> Keyboard.dismiss()} .../>

Now test the input field by pressing it to see if the keyboard will pop up