dismissing-keyboards-in-react-native-views-3.js

// Be sure to import the Keyboard
import { Keyboard } from 'react-native'

// Tell the view what to do with taps
const shouldSetResponse = () => true;
const onRelease = () => (
  Keyboard.dismiss()
);

// Your view
<SafeAreaView>
  <View
    onResponderRelease={ onRelease }
    onStartShouldSetResponder={ shouldSetResponse }
    style={ { height: '100%' } }
  >

    <TextInput
      autoCapitalize="none"
      keyboardType="email-address"
      onChangeText={ this.changeEmailText }
      placeholder="Email Address"
      style={ [styles.textInput, emailInvalid ? styles.textInputError : null] }
      testID="email"
      value={ email }
    />

    <TextInput
      onChangeText={ this.changePasswordText }
      placeholder="Password"
      secureTextEntry
      style={ [styles.textInput, passwordInvalid ? styles.textInputError : null] }
      testID="password"
      value={ password }
    />

    <Text>
      { failureMessage }
    </Text>

    { !loggingIn
      && (
        <Button
          onPress={ this.login }
          testID="button-login"
          title="Login"
          color="#841584"
          accessibilityLabel="Login"
        />
      )
    }

    <Button
      onPress={ this.closeModal }
      testID="button-close-modal"
      title="Close"
      color="#841584"
      accessibilityLabel="Close"
    />

  </View>
</SafeAreaView>