In my application i have implemented several TextInput and everything was working fine in iOS, However, in android whenever i click on text input keyboard display then close directly before even typing anything.
I tried in several screens in the app and in every screen same issue happened, I even i tried to just import TextInput in full screen without warping it with any other component but same issue. I am not sure the issue caused by what or how even to debug it.
I hope someone can lead me to a solution.
UPDATE
After debugging looks like the issue is caused by @react-navigation
library. When importing TextInput outside the NavigationContainer
it works fine.
Example to produce:
Screen where i import TextInput
const TestScreen = () => { return ( <TextInput label="Phone number" mode="outlined" theme={{colors: {primary: COLORS.primary}}} keyboardType="number-pad" left={<TextInput.Icon name="phone" />} /> ); };
Tabs Navigator
const Tabs = () => {
return (
<Tab.Navigator
initialRouteName="Home"
tabBarOptions={{
activeTintColor: COLORS.primary,
inactiveTintColor: COLORS.darkgray,
showLabel: false,
}}>
<Tab.Screen name="Home" component={Home} />
<Tab.Screen name="Test" component={TestScreen} />
<Tab.Screen name="User" component={Profile} />
</Tab.Navigator>
);
};
- Navigation Container
<NavigationContainer theme={theme} onReady={() => RNBootSplash.hide()}>
<Stack.Navigator
screenOptions={{
headerShown: false,
}}
initialRouteName={'Home'}>
<Stack.Screen name="Home" component={Tabs} />
</Stack.Navigator>
</NavigationContainer>
Versions:
"@react-navigation/bottom-tabs": "^5.11.2",
"@react-navigation/native": "^5.8.10",
"@react-navigation/stack": "^5.12.8",
"react-native-screens": "^3.15.0",
CodePudding user response:
Change the line in AndroidManifest.xml android:windowSoftInputMode="adjustResize" to android:windowSoftInputMode="stateAlwaysHidden|adjustPan"
OR Downgrading the react native screens version to "react-native-screens": "3.4.0"