Keyboard Avoiding View not working on both iOS and Android
See original GitHub issueDescribe the bug KeyboardAvodingView is not working for both platforms with TextInput
Dependencies:
- react-native-modalize-2.0.5
- react-native-0.61.5
- react-native-gesture-handler - 1.7.0
Sharing code snippet here:
<SafeAreaView style={{ flex: 1}}>
<Button onClick={() => {
modalizeRef.current.open();
}}></Button>
<Modalize
ref={modalizeRef}
snapPoint={300}
panGestureComponentEnabled
avoidKeyboardLikeIOS={true}
HeaderComponent={
<View style={{ padding: 30 }}>
<Text>Header</Text>
</View>
}
>
<View
style={{
padding: 20,
}}
>
<View style={{ paddingVertical: 20 }}>
<TextInput placeholder="Write something here" />
</View>
</View>
</Modalize>
</SafeAreaView>
Issue Analytics
- State:
- Created 3 years ago
- Reactions:2
- Comments:9
Top Results From Across the Web
KeyboardAvoidingView not Working Properly - Stack Overflow
This is a known issue with KeyboardAvoidingView and Android. ... also now recommends setting the behavior prop for both iOS and Android.
Read more >iOS KeyboardAvoidingView not Entirely Avoiding Keyboard
I'm trying to use a keyboard avoiding view to basically push up the entire app window on iOS (mocking the behavior seen by...
Read more >KeyboardAvoidingView not working properly? Check your ...
KeyboardAvoidingView not working properly? Check your Flexbox Layout first. Keyboard overlaying Input or Submit button is a common problem in ...
Read more >KeyboardAvoidingView - React Native
KeyboardAvoidingView. This component will automatically adjust its height, position, or bottom padding based on the keyboard height to ...
Read more >keyboard avoiding view react native not working - You.com
EDIT: The problem now goes deeper, as KeyboardAvoidingView does not support all types of Android keyboards. The solution must rely on opening the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’ve got this working by using the
keyboardAvoidingOffset
prop.I removed all height props and used
keyboardAvoidingOffset={100}
.@shridhar52war try this, it worked for me