'Keyboard disapears instanty after clicking on textinput react native

whenever i click on textinput , key board appears and disappears, i also tried on other android device as well

import React, { useState } from 'react'; import {SafeAreaView,Image,StyleSheet,FlatList,View,Text,Button,TextInput,StatusBar,ScrollView,TouchableOpacity,Dimensions,}

from 'react-native';

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import ForgotScreen from './ForgotScreen';
const {width, height} = Dimensions.get('window');
const Login = ({navigation}) => {

  const [email , setEmail]= useState('')
  return (
    <SafeAreaView style={{flex: 1 , backgroundColor:'white'}}>
      <StatusBar backgroundColor={'white'} barStyle="dark-content" />
        <View style={{flex:0.5  ,alignItems:'center', justifyContent:'center'}}>
          <Text style={{fontWeight:'bold' , color:'black',fontSize:20 ,margin:50}}>Login</Text>
          **<TextInput placeholder='Email' placeholderTextColor={'grey'} style={styles.input_text} value={email} onChangeText={setEmail}/>
          <TextInput placeholder='Password' placeholderTextColor={'grey'} style={styles.input_text}/>**
                
          <TouchableOpacity style={{justifyContent:'center' , width:'90%' }} onPress={() => navigation.navigate('ForgotScreen')}>
            <Text style={{color:'#A2D5AB' , alignSelf:'flex-end',marginVertical:15 , justifyContent:'center'}}>Forgot Password?</Text>
          </TouchableOpacity>
                    
          <TouchableOpacity style={styles.btn}>
            <Text style={{color:'white'}} onPress={() => navigation.navigate('HomeScreen')}>Login</Text>
          </TouchableOpacity>
        </View>
        <View style={{flex:0.5  ,alignItems:'center', justifyContent:'center'}}>
          <TouchableOpacity>
            <Text style={{color:'#A2D5AB' , alignSelf:'baseline' , justifyContent:'center' , marginTop:200}} onPress={() => navigation.navigate('SignUp')}>Sign up an account</Text>
          </TouchableOpacity>
        </View>
    </SafeAreaView>
  );
  
};

const styles=StyleSheet.create({
  input_text:{
    width:'90%',
    height:50,
    color:'black',
    borderRadius:10,
    borderBottomWidth:1,
    borderColor:'grey',
  },
  btn: {
    width:'90%',
    shadowColor:"black",
    shadowOpacity:0.8,
    elevation:3,
    shadowRadius:15,
    height: 50,
  
    marginHorizontal:10,
    borderRadius: 5,
    backgroundColor: 'gold',
    justifyContent: 'center',
    alignItems: 'center',
  },

})
export default Login;


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source